UIデザインの引き出しを増やしたいときや悩んだときに参考になるデザインギャラリー 20

UIデザインの引き出しを増やしたいときや悩んだときに参考になるデザインギャラリー 20

WebサイトやアプリなどのUIデザインに悩んだときに参考になるデザインギャラリーを全20サイト紹介します。
よくあるコンポーネントのデザインや配置の仕方、カラーの組み合わせ方を眺めるだけでなく、ギャラリーによってはクールなものからユニークなものまである様々なアニメーションをまとめているところもあるので、デザイン以外の部分でも参考になるギャラリーもいくつかあります。
また、悩んだ・困ったときに見るだけでなく、お気に入りのギャラリーがあればブックマークやフィード登録などして普段から空いた時間に目を通すことでデザインの引き出しも増やせますね。

Calltoidea

Calltoidea

細かいコンポーネントからページ全体のレベルまで様々なデザインがまとめられています。
カテゴリーを表すアイコンもわかりやすく参考デザインのキャプチャも大きくて見やすいので、個人的によく見るギャラリーサイトのひとつです。

Collect UI

Collect UI

アクセスしてすぐ目に飛び込んでくる数字にもあるように、沢山のデザインが掲載されています。
サイドに表示されているようにカテゴリーも100種類以上で細かく豊富に用意されており。検索機能もあるので目的のデザインも探しやすいと思います。

Inspiration UI

Inspiration UI

こちらも細かくタグ付けがされていて、シンプルなデザインでキャプチャも大きいので見やすいギャラリーです。

UIDB.io

UIDB.io

基本的に検索して目的のUIを探すという作りになっていて、少なめですがタグ付けもされています。
キャプチャが大きく見やすいのも特長です。

UIBox

UIBox

こちらも検索して目的のUIを探すという感じになっていますが、タグが用意されているのでそれを利用して探せるようにもなっています。

UI Temple

UI Temple

掲載数は少なめですが、キャプチャも大きく見やすいギャラリーで、カテゴリー分けタイプやカラーなど細かくされています。

Little Big Details

Little Big Details

他のUI関連のギャラリーとは少し異なり、全体的に細かい部分をピックアップしている感じのものになります。
とにかく細部までこだわりたいときなど、良いヒントが見つかるかもしれませんね。

PatternTap

PatternTap

掲載数も多く、スタイル別・タイプ別・カラー別・デバイス別というようにカテゴリー(タグ)分けもかなり細かく豊富に用意されています。

UIPatterns.io

UIPatterns.io

そこまで掲載数は多くないですが、レイアウト・ナビゲーション・フォームなどよく利用されるコンポーネントなどはひと通りあります。

Ui Parade

Ui Parade

カテゴリー分けもしっかりされていて、キャプチャも大きく見やすいギャラリーです。
また、数は少ないですがアニメーションGIFを用いてアニメーションの動きまで確認できるようにしているデザインもあります。
Dribbbleにアップされていたものから選ばれているのでハイクオリティなものが多いです。

UI Movement

UI Movement

こちらもDribbbleやBehanceにアップされていたものが中心なのでクオリティ高いものが多く、デザイン面だけでなくアニメーションの参考になるものも数多くあります。

UpLabs

UpLabs

大きくAndroid・iOS・Webの3カテゴリーに分けており、様々なタイプのUIが掲載されています。

Pttrns

Pttrns

モバイルサイトやアプリのUIデザインを集めたギャラリーで掲載数もかなり多いですが、カテゴリーやタグで管理されているので目的のUIが探しやすいと思います。

lovely ui

lovely ui

同じくモバイルやアプリのUIデザインに特化したギャラリーで、iPadも用意されています。

Inspired UI

Inspired UI

こちらもモバイルやアプリのUIデザインに特化したギャラリーで、パーツだけでなくiPhone・iPad・Androidと各デバイスでもカテゴリー分けされています。
また、キャプチャが大きく見やすいのも特長です。

Use Your Interface

Use Your Interface

アニメーションの動きを参考にしたいときに便利なギャラリーサイトです。
button、hover、loader、typography、navigationなどタイプ別で探すこともできます。

CAPPTIVATE.co

CAPPTIVATE.co

iOSのアニメーションに特化したギャラリーサイトです。
実際にアニメーションされる動きも見ることができ、キャプチャも大きめなので見やすいです。

UX Archive

UX Archive

こちらはサイト名にもあるように、UIだけでなくUXについて参考になるギャラリーです。
それぞれどのようなフローになっているか、どのようにデザインが変化されていくのかがわかりやすいです。

Code My UI

Code My UI

単純にUIデザインを参考にするだけでなく、気に入ったデザインやアニメーションがあればそれが紹介されていたリンク先で実装するコードを確認したりダウンロードすることができます。

Design Patterns on CodePen

Design Patterns on CodePen

最後はCodePenで投稿されているコンポーネントなどをピックアップしてまとめているページで、CodePenなのでクールなアニメーションやデザインがあれば見た目を参考にするだけでなく、実装コードまでを確認したりすることができます。

Close the search window,
please press close button or esc key.