2015年12月15日

ナレッジ

UIデザインのトレンドメモ 2015

UI designer

様々なサイトのデザインアーカイブを見て気づいたこと等をメモしていきたいと思います。
トレンドとは呼べないようなものや、当たり前と思われることもあるかもしれません。
ある種の雑多な情報でも、あまり取り上げられないような部分について突っ込んでいけたらと思います。

カード型UIの可能性

スクリーンショット 2015-08-25 16.01.15
ここ5年くらいカードレイアウトが流行していますね。
Material Design Guideではカードそのものが定義され、以降、デザイナーはカードデザインの様々な可能性を試している状況にあると思います。
特にトレンドになっているのは、左右で大きく分けるレイアウト。映画やプロダクトなどの高品質な写真が映えるデザインとして有用です。またdribbbleに投稿されるものの中には、商品詳細ページとして扱ったり、カルーセルに利用するなど、様々なデザインモックが見られるようになりました。
https://dribbble.com/shots/2165032-Event-Box
https://dribbble.com/shots/2128574-Login-Form
https://dribbble.com/shots/2193164-Buy-a-car-card
http://www.dvtk.us/#home

ラインでグリッドを補助

スクリーンショット 2015-08-25 16.04.47
左揃えのグリッドレイアウトの場合、右にスペースがあまりがちになります。
ブロックの下にラインをいれるとグリッドが際立ち、コンテンツの単位がより明確にわかりやすくなります。
また、2段以上のレイアウト場合には、ラインを入れることでアイテムごとの区切りがわかりづらくなるのを避けることができます。
説明的な罫線を入れることよりも、グリッドを際立たせるようにしてラインを入れるとタイポグラフィとの相性が良く、あえて太めのラインをいれているところも多く見られます。デザインが今ひとつ締まらないなぁという時にも、検討してみてはいかがでしょうか。
http://www.rokivo.com/
http://www.exoape.com/index.html

フッターを大きく!

スクリーンショット 2015-08-25 16.04.06
ここ数年で沢山の項目があるヘッダーナビゲーションは見かけなくなりました。その分フッターは項目数が増え、以前より縦に長くなりつつあります。リスト表示のフッターはシンプルで分かりやすいですが、項目数が多い場合は目的の項目を探すストレスをなるべく軽減したいので、スペースに余裕を持ったフッターが好ましいです。
https://jdand.co/
https://ustwo.com/

ポスターは立てかける。

スクリーンショット 2015-08-25 16.00.11
壁にポスターフレームを立てかけた空間として魅せる手法がトレンドになっています。
3Dソフトを使わずともphotoshopのみで作ることができると思います。ここ数年のvaporwave,seapunkの流れもありそうな、チープな3D表現が面白いです。
https://dribbble.com/shots/2176838-DSD-Summer-Camp-Posters
https://dribbble.com/shots/2189512-NANNA
https://dribbble.com/shots/2105491-The-Sun
https://dribbble.com/shots/2018309-The-Big-Wide-World

流行とも呼べないようなものかもしれませんが、微妙な相似点からデザイナーがどのような狙いでデザインをしているか考えられるきっかけになるかもしれません。

UI designer

Yuma Sasaki

西東京にある美大を卒業後、i3DESIGNに入社。meetsource.comやin-Pocketなど、i3DESIGNでwebサービスやアプリUI、自社プロダクトのデザインをしています。

関連する記事

おすすめの記事

Recruit

アイスリーデザインでは

一緒に働くメンバーを募集しています

採用情報はこちら矢印