UIデザインの参考になるアイディア集で、インスピレーションを補完しよう!

DESIGNER

あらゆるクライアントがオリジナリティとトレンド感のあるUIデザインを求めています。今回は、UIデザインの参考になる、デザイントレンドを考慮されたアイディアをまとめました。

オンラインストアアプリ

スニーカー UI
Daniel Klopper / dribble

シューズを取り扱うオンラインストアのUIをイメージして作られたアイディアです。パープルを中心としたカラフルな配色がトレンディです。商品をカードで表示させるのも、広告などでよく使われている手法なので、参考にして見てください。

レスポンシブモバイルUI オンラインストア

オンラインストアにおいては、商品を大きく、わかりやすく見せることが大切です。背景色や文字をつけることで、世界観を損なわずに商品の全容を伝えています。

ハンバーガーメニューからは5つのメニューが展開され、さらにそこから商品のセレクトができるようになっています。細いメニューを行き来させるのは操作ミスを招くので、少々複雑なUIと言えるかもしれません…。

腕時計 アプリ
Nick Buturishvili / dribble

こちらも似たようなデザインが使われていますね。より要素を減らし手織り、すっきりとしています。

Foodly 買い物カート
Olia Gozha / dribble

カレンダー管理・イベント検索アプリ

イベント アプリ コンセプト
Thomas Budiman / dribble

販売しているチケットをカードのように陳列し、展開するとさらに種類が表示される仕組みになっています。カードのビジュアルを消さないことで、関連性のあるページだということが伝わりますね。

イベント アプリ
Agilie Team / dribble

タスク、イベント、会議を作成できるイベントアプリです。SNSに近い感覚で、参加者の情報も見れるようになっています。

イベントアプリ
Tamara / dribble

こちらもイベント情報の検索アプリです。カラフルな配色とシンプルなアイコンの組み合わせが今っぽいですね。

ソーシャルカレンダーアプリ

マテリアルデザインならではのレイヤーをいかしたデザイン。フローティングしているフッターの中でも、アクションを展開するボタンが大きく表示されているので非常にわかりやすいです。

カレンダーアプリ
Gal Shir / dribble

斜めのグリッドを使うのも、最新トレンドのひとつです。

観光情報アプリ

Skydeck アプリ
Konst / dribble

日の出とサンセットの名所を探索できるアプリのUI。アイディア自体が面白いですね。グラデーションを取り入れたフラットなデザインは、多くのクリエイティブカンパニーのリデザインにも採用されている手法です。

iOS 旅行アプリ
Timur Gabbasov / dribble

チケットの購入はアイコンを使ってわかりやすく。街の紹介カードには、印象的な画像を使って購入意欲を書き立てています。全体的にクリーンな印象で、安心感がありますね。

天気情報アプリ

Marline
Javi Perez / dribble

干潮、天気、月の満ち欠け情報を提供しているアプリ。グラデーションを取り入れたフラットなデザインが今っぽいです。一日に何度でも開きたくなるようなモダンな雰囲気も素敵ですね。

iPhone 天気アプリ
Oleksandr Pronskyi / dribble

SFa Day ダッシュボード
Angel Bartolli / dribble

そのほか

財務管理系

財務管理アプリ(アニメーションコンセプト)
Bilal Mechairia / dribble

アニメーションで数値をポップアップさせています。ハンバーガーメニューを左上に設置することで画面をすっきりとさせ、数値の可読性をあげています。

マルチメディア

マルチメディア アプリ画面
HOARRD / dribble

100個以上の PSDデータがセットになった「Ghost Ship Mobile UI Kit」から、コンテンツ表示のUIを見て見ましょう。ビデオ、プレイリスト、フォトそれぞれの最適な表示方法が提案されています。

同じアプリ内でも、コンテンツの種類に合わせて表示方法を変更しなければなりません。

コミュニケーションアプリ

Livo UI キット
Agenceme / Visual Hierarchy

210以上のアプリ画面と800以上のUI要素を備えた幅広いユーザーインターフェイスキットである「Livo UI Kit」の中から、フィードのUIをご紹介。

ミニマムなアイコンを使用した、トレンド感のあるUIデザインです。

(翻訳:Yutai Satake)

SHARE

RELATED

  • お問い合わせ
  • お問い合わせ
  • お問い合わせ