デザインの参考になる! 最近のWebサイトやスマホアプリで見かけるUI、インタラクションがまとめられたギャラリーのまとめ
Post on:2023年7月27日
最近のWebサイトやスマホアプリで見かけるUI、レイアウト、コンポーネント、アニメーション、インタラクションなどがまとめられたギャラリ−を紹介します。
デザインのアイデアを探している時に、ブックマークしておくと便利です。

画像: 最近のスマホアプリで見かけるアニメーションの素晴らしいアイデアを解説

400種類以上のスマホアプリ、100,000パターンのUIがまとめられたギャラリー。一つのアプリで、さまざまなUIが収録されているので、非常に便利です。iOS, Android, Web対応で、気に入ったアイデアは保存(要ログイン)もできます。

Mobbinにインスパイアされ、App Storeでのスクリーンショットがなかったのでそれに特化されたギャラリー。アプリを売り込むためにスクリーンショットがどのように使用されているかの資料になります。

UIデザインのギャラリー「Screenlane」の運営者がこれからは「Page Flows」と「Page Collective」の更新に注力するとのことで、まずは、より良いユーザーフローが設計されたデスクトップとスマホのギャラリー。

もう一つの「Page Collective」は、ランディングページのギャラリーで、ページの属性やページの要素ごとにカテゴリがまとめられています。

インタラクティブなUIデザインのパターンのギャラリー。レイアウト・ナビゲーション、フォーム、データ・コンテンツマネジメントなど5つの大カテゴリに、ボタンナビゲーション、カード、タブなどの小カテゴリがあります。

サインアップ、ログイン、削除、検索、保存、移動など、スマホアプリのさまざまなユーザーフローの各スクリーンショットが一覧できるギャラリー。

Figmaのリソース、Dribbbleで人気している作品、フォントやカラーやツールなどの最新情報をまとめて見られるブラウザの機能拡張。現在、Chrome版とEdge版とBrave版がリリースされています。

WebサイトとUIコンポーネントの大カテゴリに、ランディング・ブログ・ポートフォリオ・プロダクトなどの小カテゴリにまとめられたギャラリー。

ペライチ、1ページのWebサイトのインスピレーション、テンプレート、リソースがまとめられています。老舗のギャラリーですが、現在も更新が続けられており、現在は8,000ページを超えています。

5,000を超えるランディングページと無料のUIキットを特集したギャラリー。

ランディングページ、テンプレート、コンポーネントがまとめられたギャラリー。

スマホ、タブレット、デスクトップ、ワイドスクリーン、各スクリーンサイズでどのように表示されるかがまとめられたギャラリー。

名の通り、アプリのアニメーションに特化されたギャラリー。パターンではナビゲーション・ボタン・ローディング・スワイプで見ることができ、スタイルではフリップ・ピンチ・スライドなど各アプリを縦断して表示できます。
sponsors