iOS 6、iOS 7、Androidの各種Mobile Appのアイコンテンプレートを配布しているサイト。それぞれの詳細ページからPSDをダウンロードできます。各PSDにはPhotoshop用のアクションファイルも同梱されていて、ちょうどいい感じに書き出しまでを行えます。配布元はPixelresortというサイトで、自分もいつもここのテンプレート使ってアイコン作ってます。ここのテンプレートは同梱されているアクションが便利で、確認用と申請用に分けて書き出せる機能が重宝してます。iOS 7版も出たようなので、早速テンプレート1個落としておきました。素晴らしい。
ズラっと並んでるスマートフォンやタブレットの中からどれかひとつを選んで、そのディスプレイ部分に任意の画像を表示させたモックアップ画像を作る事のできるサイト。各デバイスは当然ディスプレイ解像度が異なるので、あらかじめそれぞれに合ったサイズで画面用の画像を作っておく必要があります。ちなみにiPhone 5は640px * 1136px、iPhone 4 and 4Sは 640px * 960pxです。Androidは色々あり過ぎて分かりません。デバイスを選ぶとディスプレイ解像度が表示されるので、あとは「Drop files here」の部分に画面用の画像を放り込むだけでOK。生成した画像はPNGで保存する事ができ、またこんな感じで固有リンクを使った共有もできます。UIデザインする際に他のメンバーや顧客とデザイン共有する際に便利そうです。
iOSとAndroidの各種インターフェースに関するガイドラインをまとめたチートシート。ここに書いてある内容はどれも純正のガイドラインに載っている類の事ではあるんだけど、iOSとAndroidそれぞれを並べて紹介している点に意味があるかと。例えばiOSでは「ナビゲーションバー」って呼ばれるものがAndroidでは「メインアクションバー」って呼ばれる等、それぞれのプラットフォームの習慣やマナーについて比較する事ができます。自分の場合Appleの犬なので仕事じゃなければAndroidなんて使う気が全く起きないんですが、そのせいもあってAndroidの事何も知らないんです。なのでこういうまとめ方はスゴく仕事に役立ちます。ナイスです。けどそろそろAndroid端末1台くらい持っておくか・・・的な感じになってきたので、HTC oneが塩漬けプランで買えるようになったら確保しとこうかなぁ、みたいなアレではあります。まぁ言うてもどうせ使わないんだろうけど。
iOSとAndroidの各種UIをパーツごとに見比べて、それぞれのUIデザインに役立つPSDキットへのリンクを掲載した記事。iOSのPSDキットへのリンクは、昨日紹介したTeehanlax PSDです。iOSのバージョンは6系と7系それぞれ紹介されているので、合計3プラットフォームでの比較がされています。この3つが並ぶとなかなか興味深いです。iOS 7がAndroidに似てると言われる理由というか根拠というか、そういうのが良く分かります。俺みたいなAppleの犬から見ても実際似てると思うもんなー。黒系がライトグレーになって明るい印象ではあるけど、意匠そのものが似てるんだよね。まぁ良い部分の模倣は良い事だとは思うけど。あ、けどiOS 7でダイアログかっこ良くなってますね。前のテカテカのやつ個人的にはあんまし好きじゃなかったのです。
スマートフォンやタブレット、PCなどの各種デバイスごとのディスプレイ解像度を一覧できるサイト。3つのカテゴリをそれぞれ抽出でき、メジャーなガジェットの解像度とインチ数などを確認できます。このサイト素晴らしいのが一番右にある「Pupularity」という数値。その端末がどれだけメジャーなのかが数値で分かります。モバイルサイトやアプリを作る際にとっても役に立ちそう。
スマートフォンのUIデザインの際に役立つPSDファイルをまとめた記事。対象OSはiPhoneとAndroidとWindows 8 Phone。それぞれデフォルトにUIに沿ったデザインのPSDもあれば、そうでない独自のあしらいのものもあります。 また記事下部にはプロトタイピングに使えそうなラフデザイン調のものもいくつか用意されてます。デザイナーやディレクターの方に是非。一部ベクターデータのものもあるので、IllustratorでUIデザインする方にもオススメ。
MobileAppの優れたUIを紹介した記事。見た感じiPhoneとAndroidが混在しているようです。いやーかっこいいデザイン多いっす。けど重要なのはただかっこいいという事ではなく、優れたユーザーエクスペリエンスを提供するという点。この記事で紹介されている作例は、どれもそれらに注意を払った優れた作例らしいです。アプリのUIデザインをする際のネタ帳としてナイスです。
40 Beautifully Designed Mobile Apps With Excellent UI Experience in Mind
iOSやAndroidデバイスで使い勝手の良さそうなアイコンセット。配布はフリーで、ライセンスはCreative commons 3.0なので、クレジット表記のみで使う事ができます。配布形式はPNG。300種類という数の豊富さとデザインの秀逸さにより、なかなかイイ感じのアイコンセットだと思います。欲を言えばベクターデータが同梱されているともっと良かったなーというか、デザインベースとして使えそうだなーとか思いました。
