ブックマークしておきたい!WebサイトやスマホアプリのUIデザインのアイデアに困った時に、参考になるサイトのまとめ
Post on:2018年4月27日
WebサイトやスマホアプリなどのUIデザインのアイデアに困った時に、参考になる、そして勉強になるサイトを紹介します。
ランディングページ・プロダクトページのレイアウト、UIのさまざまなコンポーネント、アニメーションが気持ちいいインタラクションなど、ブックマークして定期的にチェックしておきたいサイトばかりです。
Mobbin -Latest Mobile Design Patterns
デザイン面に優れた最新のスマホ向けデザインのパターンがコレクションされています。100以上のiOSアプリの主要な画面遷移と5,000以上のパターンが厳選されており、自身のライブラリを作成(要登録、無料)することもできます。
DSGN -The hottest web design shocase
クリエイター達に注目され、高いデザイン水準のWebサイトがまとめられています。ダーク・ライトやクリーンやミニマルやアニメーションといったスタイル、コマース・企業サイト・ポートフォリオといったタイプ、使用している技術などで抽出することもできます。
CSS Gridは今までのレイアウトにこだわる必要はまったくありません。
CSS Gridでどういったレイアウトができるのか、効果的に使用されているWebサイトがコレクションされています。
ランディングページ、プロダクトページ、価格ページごとに、良質なWebサイトのページがまとめられています。各詳細ではそれぞれ、縦長でも全ページ分のキャプチャ画像が収録されています。
デスクトップ向けページ、スマホ向けページをはじめ、ブランディングやイラストなど、クリエイティブな作品がコレクションされています。UIキットやデザイン素材も含まれており、有料・無料のものも揃っています。
レイアウトやコンポーネントのアイデアを求めている時は、このサイトがお勧めです。ナビゲーション・サイドバー・フッタ・リストといったコンポーネントをはじめ、アバウトページ・お問い合わせページ・ログインページなど、カテゴリごとに最新のデザインがまとめられています。
Atomicはギャラリーサイトではないのですが、よいインスピレーションが得られると思います。インタラクティブ性に優れたプロトタイプを作成するツールで、そのデザイン・インタラクション・コンポーネント・アニメーションは見るだけでよい刺激になります。
最後は、有名なインターネット企業のWebサイトがどのように変化したかが分かるギャラリーです。一環したブランドのデザインを守りつつも、テクノロジーやトレンドを巧く取り入れて進化しています。
sponsors