Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Category Archives: UI Design

[UI Design] Mobile Tuxedo – モバイルアプリケーションのUIリソース紹介サイト

  • Pocket
  • このエントリーをはてなブックマークに追加

モバイルアプリケーション(Webを含む)UIに関するリソースを紹介するサイト。アプリケーション内で使われるボタンやスイッチ、アイコンのネタ帳、Photoshop用のレイヤースタイルなどの素材、PSD、ステンシル、JS、フレームワーク、そしてクールな作例紹介などがその内容。コンテンツはArticles、Resources、UI Patternsの3つのカテゴリで整理され、それぞれサブカテゴリで細分化されてます。UI Patternsでは話題のclearなんかも取り上げられてます。モバイルAppやスマートフォン向けサイトのデザインする際にとっても役に立ってくれそうなナイスな内容です。UI、インタラクション系のデザイナーさんにオススメ。

[Icon Design] App Icon Template – iOSアプリアイコン制作のテンプレート

  • Pocket
  • このエントリーをはてなブックマークに追加

本日のナニコレ超便利。いやこれマジに便利っす。iOS向けアプリのアイコン制作時に役立つフォトショップ用テンプレート。この手のテンプレートは他にもあるけど、これの素晴らしい点は2つ。まずアイコンの各種解像度に一括対応するため、ベースとなるアイコンデザイン部分をスマートオブジェクト化してある点(「EDIT THIIS SMARTOBJECT」のレイヤー)。なのでこのPSBファイルをベースにデザインすれば、全解像度に適用されます。もう1点は同梱されているアクションファイル。CS5.1では動きが変だった印象もあるけど、これ使えばAppStore申請用のファイル書き出しがサクっとできます。デザイナーのワークフローの作業的な部分をウマい事バッチ化した素晴らしいテンプレート。ありがたく使わせて頂きます。

[Icon Design] iOS Icon Gallery – iOSアプリのアイコンギャラリー

  • Pocket
  • このエントリーをはてなブックマークに追加

iOSアプリのアイコンギャラリー。ズラっとページングする形で並べられてますが、カテゴリーによる抽出もできます。かっこいいアイコンしか集められてないので、アプリのアイコン制作をする際のネタ帳としてとってもナイス。多色、テクスチャ使用、立体的なデザインなど、アプリごとに色々と趣向を凝らして目立つ方法を模索してるという印象。まぁアプリのアイコンってAppStore内で目立ってナンボ、Home画面内でも目立ってナンボ。けどiPhoneユーザーの特性を考えると品良く作らなきゃなんない、というあたりが制作する側としては特に気にする部分ですな。

[UI Design] TappGala – モバイルUIのデザイン作例紹介サイト

  • Pocket
  • このエントリーをはてなブックマークに追加

モバイルアプリのクールなUIのまとめサイト。一時期「CSSなんちゃら」みたいなクールサイトまとめが流行したように、最近じゃモバイルUIのまとめサイトが流行ってるようです。サイトによって色々工夫されてるけど、ここではアプリの種類によってタグ付けされてて、同種のアプリごとに抽出してブラウズできるようになってます。WebデザインからAppデザインに転向したり、両方やってる人も多いと思うので、これ系のまとめサイトはネタ収集の際に重宝しますな。

[UI Design] lovely ui – iPhone, iPad, AndroidアプリのクールなUIを紹介するサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

iPhone, iPad, AndroidアプリのクールなUIを紹介するサイト。これ系のUIまとめサイトらしく、アバウト、プロフィール、ナビゲーション、スプラッシュといったように各場面ごとにカテゴリ分けして抽出する事もできます。アプリのUI制作や、クールなルック&フィールのネタを探す際に使えそうなサイト。ウェブデザインとアプリのUIデザインって共通点も多いから、最近じゃUIに移行してたり並行してやってるデザイナー多そう。

[UI Design] Creating Pixel-Perfect UI for iPhone Applications – ディテールが美しいiPhone App

  • Pocket
  • このエントリーをはてなブックマークに追加

iPhone AppのUIデザインをする際に気をつけるべき点と、美しいUIを持つAppのデザインギャラリーという内容の記事。ちょうど今iPhone AppのUI制作をしているタイミングだったので、個人的にとってもタイムリーな内容の記事。これ見てると最近のiPhone Appってテクスチャなどを使った質感を重視する傾向があるなぁって思います。あとステッチ流行ってるよね。これってiPhone 4以降Retinaディスプレイで紙の解像度に迫ったせいで、質感を出せるようになった結果だと思うんですよ奥さん。実際UIパーツにテクスチャ貼るとグっと良くなる場合多いし。インターフェース作る際に何かをメタファーにする際によく使う手法ですな。テクスチャ大好き野郎に是非これひとつ。

[UI Design] Best Free UI PSDs of 2011 – UIに関するフリーのPSD

  • Pocket
  • このエントリーをはてなブックマークに追加

UIデザインに関するフリーのPSDが紹介された記事。今年アツかったものだそうです。ドロップダウンメニュー、リボン装飾、ボタンセット、アコーディオン、そしてUIパーツ一式のPSDが紹介されており、どれもかっけース。他のデザイナーの作ったPSDはレイヤースタイルなど宝の山だったりするので、有効に活用させてもらいましょう。

[UI Design] Ui Parade – モバイルアプリやWebインターフェースの素材まとめサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

優れたUIデザインの作例をまとめたサイト。大きい意味でのUIというよりは、どちらかというとパーツの意匠そのものにフォーカスした印象。多くの作例はdribbleにリンクされてますが、中にはPSDをダウンロードできるものもあります。テクスチャをウマく使って現実の世界にある操作パネルなどを模すというのは最近よく見る手法だけど、ここで紹介されてるのはどれもその質が高く、ディテールを制作する際の参考になります。かっけーの多いっす。