よくわかるマテリアルデザインの設計コンセプト | fladdict
iPhoneとAndroidではiPhoneのほうが良くできているが、iOSのフラットデザインとAndroidのマテリアルデザインでは後者の設計が優れている。マテリアルデザインは、デザインとエンジニアリングが高いレベルで融合していて、ロジカルで非常に美しい。 以下、自分の理解をまとめたメモ。 紙とインク マテリアルデザインは「ペーパー」と「インク」のメタファーでできている。 ペーパーの特徴 バーやボタンといった画面上のUIコンポーネントは、バーチャルな紙でできたカードと考える。また、このペーパーは1dpの厚さを持っている。 ペーパーは純白の矩形、あるいはシンプルな円形である。三角や星型といった複雑な形はとらない。そのような複雑な形状や模様はインクが担当する。 現実とことなり、このペーパーは自由に伸縮することができる。 マテリアルデザインにおけるレイアウトは、複数のペーパーを並べたり、重ねた
スマホUI考（番外編） 顧客やユーザーの要望に全て対応すると、アプリは99%破綻する | fladdict
顧客や上司、ユーザーの場当たりな要望に対応しつづけると、どんなアプリもゴミアプリになる。たとえそれが理にかなった要望であっても。 なぜなら面積の限られたスマホでは「一画面の機能数とボタン数」が、使い易さと品質に深くリンクしているからです。 ということを、エラい人にプレゼンするのがお仕事の今日この頃。でも毎回毎回、同じことを説明するのがシンドイので資料をブログにまとめたいなぁと思うなど。 思考実験として、ここでは架空事例としてTwitterアプリを例に考えてみる。 何かの間違いで、日本の大手メーカーがTwitterを買収すると・・・UIデザイナーが体を張らないと99%ぐらいの確率でこうなるのです。 ここがオリジナル Request1: ダイレクトメッセージをトップ階層に ユーザーからの真っ当な要望。実際にはサービスの本質ではないのですが、要望はかなり多いはず。 ただTwitter社的にはme
iOS7用のアイコン製作テンプレート（ピクセル最適化済） | fladdict
WWDCの発表を受けて、Appleが発表したiOS7用アイコンのイラストレータ用テンプレートを作ってみた。 すでにいくつか先行作成されたものがあるものの、ストアサイズ1024pxを基準としたものが多い。 だけどこのサイズは実機表示には都合がわるい。 120pxにリサイズするとデータが滲んでしまう。 そこでこのテンプレートでは、実機サイズ120pxの10倍スケールの1200px基準にしてみた。 10px単位で要素を配置すれば、パッキリとピクセルパーフェクトなアイコンになるはず。 検証に写真アイコンのコピーを作ってみたが、問題なく表示されるはず。 あわせて黄金比分割ガイドも、実機表示でピクセルが滲まないように端数調整している。 外枠のコーナーに関しては、どうも手動の視覚補正つきコーナー為、もう少し使い込んでアップデートしてみたい。 （アップデートしました）。
開発者必見！ 5秒でわかるフラットデザインまとめ | fladdict
・どこ押せばいいか謎 ・言われてるほど新しくない（スイス系のリバイバル） ・立体より工数低いが、誤摩化しがきかず難易度高い ・でもデザイン料を安くされそう ・日本語だと高確率でダサくなる
HTMLで文字詰めするタイポグラフィー用JS | fladdict
HTMLのテキストに対して、文字詰めを行えるスクリプト FLAutoKerningクラスを作ってみた。サンプルはこちら。zipも。 スクリプト内に任意のカーニングペアを定義することによって、ブログのタイトル等のテキストに字詰めを行ってくれるスクリプトです。なんか探しても見つからなかったので自分でやってみた。いちおう朗文堂の新宿私塾に行ったわけだし、僕もなんか成果物作らんとなぁ。。。的に。 実行はとても簡単。jQueryと一緒にhtmlにロードして、 FLAutoKerning.process($(‘h1′)); FLAutoKerning.process($(‘h2′)); FLAutoKerning.process($(‘h3′)); といった具合に、適用したhtml要素を一括していしてやるだけ。カーニング情報の定義も、FLAutoKerningクラスの頭に、下のようにem単位で定義する
アプリの翻訳を依頼するコツ | fladdict
翻訳会社にアプリの依頼を一人ですると、ものすごい苦労するのでメモ。 結構な金額を投じて、ようやくコツがわかってきた。 １：「iPhoneアプリの翻訳です」っていう。 ２：「カメラのアプリです」「日記のアプリです」みたいにジャンルを言う。 ３：「ボタンは○字ぐらいで溢れるので、直訳が長すぎる場合は代替案をください」と言う。 ５：「ボタン系は、あなたのiPhoneやMacのアプリで使われてる単語を参考にしてください」って言う。 ６：New (新規ファイルを開く）、みたいな感じで単語の横に、説明のコメントを書く（すごく重要）。 これで、だいたい安定するはず。 余裕があれば上がってきた翻訳を、違う翻訳会社でさらにクロスチェックすると安全。
iPhone開発規約の変更にともない、Flash for iPhoneは復活するか？ 雑感 | fladdict
iOS4.1の発表にともない、iPhoneの開発者規約に微調整が。 なんとあの悪名高い、Apple以外の開発環境使うな条例が消滅した模様。 In particular, we are relaxing all restrictions on the development tools used to create iOS apps, as long as the resulting apps do not download any code. This should give developers the flexibility they want, while preserving the security we need. つまり、Flash for iPhoneがOKになったってことだってばよ！？ さて、一見バラ色に見えるこの展開。 ところがFlashが復活することはあり得るのでしょ
Flash for iPhoneで簡単iPhoneアプリ開発 | fladdict
Flash for iPhoneの実演デモビデオが、なぜか gotoandlearn で先走って公開されている件。 公開ベータは年内リリース「予定」なのにw ＜追記＞冷静に考えたらこのサイトの中の人Lee Brimelowは、Adobeのエバンジェリストだった。 とりあえず、ビデオの内容のざっとしたまとめ。 ・このビデオは開発中のバージョンなので、正式版はちょっと違うかも。 ・WelcomeスクリーンからiPhoneプロジェクトで、専用のテンプレートが。 ・プロジェクトの形式はAIRアプリケーションに極めて近い。 ・iPhoneのFlashではハードウェアアクセラレーションが使える。 ・三軸センサ等、iPhoneの機能にアクセスするクラスがある。 ・テストは通常のAirアプリと同様にマシン上でデバッグ可能。 ・iPhone用へのコンパイルはAIR用とほぼ同じだが、専用UIあり。 ・iPho
ゆとりiPhoneプログラマの為のメモリ管理 | fladdict
主にFlashのガベコレで脳が弛緩してる、ゆとりiPhoneプログラマ向けのメモリ管理術。しち面倒なRetainCountの管理を30秒で解決するよ。 1:とりあえず NSMutableDictionary を１個作る。このDictionaryはプロパティとして保持する。 2:alloc / init でインスタンスを作るときは、[[[ClassName alloc]init]autorelease] と必ずオートリリースをつける。 3:[NSString stringWith〜] のように、allocとinitを経ずにインスタンスを作る場合は、自分で勝手にretainをしない。 4:作成したインスタンスは持続的に必要な場合、NSMutableDictionary に突っ込む。 5:必要なくなったインスタンスは、NSMutableDictionary から remove する。 こうすると
とりあえず会社を作るべきか | fladdict
三十路になってはたと思った。 「30歳、無職」と「30歳、会社経営」だと、取引するときも、クレジットカードの審査も、将来再就職とかするときも、警察に捕まってニュースでるときも全然扱い違うんだよな。 誰かに「この履歴書の空白の１年間何をしていましたか？」と聞かれたとき、「ニートでした」や「就職活動をしてました」と、「自身で会社を興して経営していました」じゃ、だいぶ印象が色々違うよなぁと。 あとリスクヘッジで考えると、万が一iPhoneアプリとかウェブサービスでどっかのユーザーから億単位の訴訟とか食らった場合、会社を挟んどけば会社が死ぬだけで、個人はある程度守れるなぁと。ディベロッパが直にやってるとアメリカンから訴訟されたら、下手したら人生飛ぶだろうし。 そういうことを考えると、就職浪人でも、派遣切りでも、リストラでも、独立でも、とりあえず社会的バックアップを失ったら会社作るのがリスク管理的に
fladdict » アプリケーションにおけるデザインの重要性
WWDC出てAppleの中の人や、成功したアプリの製作者が口をそろえて言うことは、「これからアプリはデザインがもっとも重要で、開発時間の大半をデザインに充てるべきだ」、ということだった。 １年ほど自分で製作してみた実感でも、テクノロジーはそれほど重要ではない印象。 いわゆるFlexとかRIA系の世界では、デザイナーのポジションはUI設計と切り離されて、単なるスキン屋に甘んじてることが多いとおもう。 しかしiPhone系だと、ぶっちゃけデザインがウンコだと、メディア露出だけで力技で殴り勝てるアプリじゃない限り、まず成功することはありえないと思う。 iPhoneは市場が小さいからまだ当面予算が低いのがアレだけど、最終的にはこういう生活に密着したアプリケーションは、通常のウェブサイトやアプリケーション以上に積極的にデザイナーが設計にコミットして、もっと単価要求すべきな気がする。 これはアプリケー
アプリの設定は、初心者/上級者の２段階モードがいいんじゃないかと思う | fladdict
iPhoneアプリなり, Airアプリなりを作ってて思ったんだけど、特にiPhoneのような画面の小さい環境では、機能要望の取捨選択がムズかしい。 本来、ウィジェットというのは単機能特化が一番いいんだ思う。 ところが、ユーザーからの機能要望というのは限度がなく、その全てに対応すると、アプリケーションがあっという間にファットになってしまう。 ファットになったアプリは、既存のヘビーユーザーには歓迎される一方で、新規ユーザーにとっては害として働くことが多い。 まず、あれもこれもという多すぎる機能は、「何をすべきなのか」という本来のコンセプトを消し去ってしまい、それそのものの持っていた「体験」を台無しにしてしまう。結果、「何をしたいのか」が明確なユーザー以外には、きわめて使いにくい一品になってしまう。 また学習コストの大幅な増加も問題となる。iPhoneのような設定画面と、ヘルプを並列に見せること
HTML 5の仕様からオーディオ・ビデオコーデックに関する要件白紙に | fladdict
Slashdot: HTML 5の仕様からオーディオ・ビデオコーデックに関する要件白紙に。ベンダーの意向の相違が原因。 HTML5にて、ビデオコーデックの仕様が定まらず、予想通りに迷走してるっぽい。 Flash Playerの対立軸（？）として、一部で持ち上げられているHTML5だけれども、課題というか大きな問題点が１つある。 それはHTML5が利害関係の一致しないプレイヤーの綱引きで、フットワークと合理性を失いつつある点だと思う。 ビデオのコーデックなんかは、事実上のディファクト状態になった .flv 以後の主導権を誰が手に入れるか？という綱引き状態で、宙ぶらりん状態な感じかと。iPhone導入を契機にYoutubeにH264対応を押し通したAppleとしては、TheoraよりH264を通したいのだろうし、他も色々考えがあってまったくまとまらない。 ＜追記＞はてぶで指摘があったとおり、f
コンテンツプラットホームとしてのiPhoneの設計が間違っている、を読んで | fladdict
はてなポイント３万を使い切るまで死なない日記: コンテンツプラットホームとしてのiPhoneの設計が間違っている 僕もこの人の考えに近いかなぁ。 ぼくが問いたいのはiPhoneで、今後、大儲けできるようなシナリオが存在できるような設計になっているのかどうか、そしてアップルがそういうシナリオを用意するつもりがどれだけあるか、ということだ。 そもそもDL販売によるアプリケーション販売って構想そのものが、死亡遊戯だもの。Appleもコンテンツで儲かるとか思ってはないと思う。アプリケーションはデバイスを普及させる為の手段ではないかと。 いつも思うんだけど、なんでDL販売を考える場合、誰も在庫について真剣に考えないのだろうか。 DL販売のメリットが流通コストの削減にあるなら、最大のデメリットは在庫という概念の消失だと思う。 在庫という概念がなくなるのは、一見メリットと見えるけど、これは明らかなデメリ
コンピューターに絵画を描かせる | fladdict
コンピューターによる写真の絵画変換ってのは、photoshopにもついてるんだけど、あれってダサい。 なんかヌタッとしてて、全体がのっぺりしている・・・というか、主題と背景とかそういうのが考慮されずに一律に変換されているのがキモイ。 で、最近ごぞんじのように、写真のフラクタル分割をずっと趣味で研究してたんだけど、ようやく自分が納得できる精度でフラクタル分割する方法を思いついた。↓の画像がその処理結果なんだけど、だいぶいい感じに分割できてると思う。 アルゴリズムはQuasimondoのFITCの発表を聞いてる最中に思いついたもの。 まず画面のピクセルを走査し輝度の標準偏差を取る。標準偏差が閾値以上の場合、その領域は十分に複雑であると判断され、分割される。あとはそれを繰り返して二分木あるいは四分木で分割していけばいい。輝度を基準にするってのはJPEGの圧縮からアイデアを頂きました。 ちなみにQ
FITC 3日目 ScaleForm GFxがヤバイ件 | fladdict
FITCで唯一、複数セッションを持ってるGSkinner先生。 ちなみに僕の脳内Flashコーダーヒエラルキーでは、GSkinner, Quasimondo, Bit101, Andre Michelleが四強。 そのGSkinnerが発表したのが、彼の最新プロジェクトScaleForm GFX。WebのFlash屋の間ではあまり知られていない、フレームワークだけどこれが滅茶苦茶凄い。 コンソールゲーム機ソフトのUI、オープニング、エフェクト等をFlashで作ってそのまま、インポートできるようにするミドルウェァ。 対応ハードはWii、PS3、Xbox360、PSP、PS2等。 ScaleForm GFxを使えば、ゲームのコア部分以外の大半はFlashとAS2で開発できるようになるらしい。 ゲーム内で使われるテクスチャ等にFlashを用いることも可能らしい。 PS3のナルトの格ゲーなんかは、
fladdict: flashで擬似流体シミュ20000パーティクル
InfoStorm: study14 flashの限界に挑戦した流体シミュレーターほぼ完成。ここ１～２年のマシンなら全画面で30fps出ると思う。 結局25000個動くだけの余力を確保してから、5000個分のパワーを色の調整やエフェクトのほうにまわしてみた。マウスをゆっくり動かすとキモチイイです。 内部ロジックだけど、なんかwonderflでエライ勢いで解析祭りが行われてるwww コードみたけどメインの処理は大体同じ。 問題はこのあとどこに持ってくかだよね。 このままスクリーンセーバーやトップページにしちゃってもいいんだけど、どうしようかな。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
)
iPadユーザーインターフェース講座 | fladdict
iPhone | fladdict
flight404でソースコード祭り | fladdict