見出し画像

UIデザインの手引き「UI GRAPHICS」を読んでみた!

こんにちは、デザイナーのゆりくるです。
UIデザインの勉強のため、今回は「UI GRAPHICS」で学んだことを書いていこうと思います。

この本は、デザイナーの手法や思想を実例をもとに紹介している本です。

日々アプリなどを見て、なんとなく雰囲気が似ているデザインだったり、このパーツ見たことがあるなどの経験はありませんか?

実は「知らない間に求められていた」デザインが、流行のデザインになっていることも考えられます。それは、時代と共に求められるデザインが変わってきているのも一つの理由になります。

この本では、そういった経緯も配慮しながら紹介しています。

はじめに、タッチ操作による身体の拡張について

iPhoneが誕生し、タッチ操作と思考が連動され身体が拡張されたような体験によって、私たちはタッチ・インターフェイスが夢中になりました。それが2007年の出来事です。

画像1

それから、2017年iPhone Xの登場によって誕生した「Fluid Interfaces(フルイドインターフェイス)」によりホームボタンが廃止され、スワイプ操作によって「ホーム画面に戻る」という動作へと変更されました。

さらに人間の考えるスピードにデバイスがついていけるようになり、より体の一部のようにデバイスを扱うことができるようになりました。
これに伴い、UIデザイナーは、今まで以上に視覚的・動的なデザインの知識やスキルが求められるようになるそうです。

それでは、UIデザイン手法の紹介パートに移ります。

「直感的」なデザイン

人の身体から生まれる制約や、環境・歴史や文化といったさまざまな環境要因により感情や動作が生まれることを、アフォーダンスとよばれます。
そういったアフォーダンスされた「直感的」に伝わるデザインが「Fluid Interfaces(フルイドインターフェイス)」においても、とても大切な視点だと考えます。

アプリ『Lake』

🎨 塗り絵アプリ『Lake』
ユーザーが塗り絵に集中できるようにカラーパレットやブラシなどのツールへのUIデザインが洗練されており、「色を選択する」「道具を選択する」などを迷いなく直感的に操作することができます。

最小のデザイン

小さなスクリーンから情報を得るには、 必要最低限で表示できるよう工夫が必要です。いかに要素を少なく見えるように機能を削ぎ落とし、ユーザーが集中できるための空間作りもUIデザインにおいて、大切な考え方の一つとなります。

アプリ「スタディギア」

🔠 英検アプリ「スタディギア」
こちらは、私が普段使用しているアプリの紹介です。6種類の英語学習ができるのですが、タップするとその学習がスタートします。
ホーム画面ではスクロールもなく1画面でおさまっているため、シンプルで使いやすいです。

アナログなデザイン

ネットの普及により情報過多のストレスに晒されたユーザーのため、心地良さを求めてアナログテイストが求められているという視点もあるそうです。

アプリ『Olli』

📷 写真加工アプリ『Olli』
画像を絵のように加工される写真加工アプリです。ダウンロードは有料でしたが、とても使うのが楽しいです。普段見慣れた場所も、イラスト風に見えると新鮮でした。

動きのデザイン

要素が簡素化される一方で、それを補うかのように「動きのデザイン」の必要性が高まっています。動きによって、人とモノの間に親近感を与える効果が考えられます。

アプリ「クロネコヤマト」

📦 宅配サービスアプリ「クロネコヤマト」
宅配会社の「クロネコヤマト」のアプリの紹介です。
グローバルメニューをタップすると、トラックが場所を移動するような仕組みになっています。
この移動するモーションがとても可愛いので、アプリを起動するのが楽しくなります。

※2022年にアプリがリニューアルされ、こちらのUIから変更されていました。

イラストレーションとインフォグラフィックス

アプリは、楽しさややる気を生み出すなどの役割も担います。UIデザインは、機能だけでなく、エンターテイメント性を求められるようになりました。

アプリ『Duolingo』

🔠 英語学習アプリ『Duolingo』
こちらは、Duolingo(デュオリンゴ)という学習アプリです。
この学習アプリのすごいところは、イラストがとても洗練されていることと、ゲーム感覚で学習を進めることができ、ユーザーが飽きてしまわないよう配慮されてます。

IoT(モノのインターネット) 

IoTとは、Internet of Thingsの略語で、モノがインターネット経由で通信することを指します。(例:Google Homeや、Alexaなどの商品)
IoTにより、アプリだけのUIに留まらない領域まで体験設計を考えることが広がりつつあります。

🪵 木製スマートホーム『muiボード』
こちらは私がとても気になっていたIoTの紹介です。
木製スマートホーム「muiボード」は、天気予報や日々のニュースを確認したり、エアコンや音楽などの調整、家族とのコミュニケーション(ボイスレコーディングやメッセージ機能)ができるIoT機器です。

タッチするたびに木と触れ合えるなんて、とても癒されそうですよね。

以上で、今回の本で学んだことをまとめました。

この記事が参加している募集

この記事が気に入ったらサポートをしてみませんか?