【海外記事】昔と今のUIレイアウトを比較してみよう
本日はこの記事を読んでみます。なお、画像も以下から引用いたします。
新年最初の海外記事メモなので、自身のリハビリもかねてちょっと軽めな記事にしてみました。
読んでみると結構興味深い内容でもあったので、気楽に楽しく読めたらと思います。
本日もよろしくお願いいたします。
レイアウトの進化がUIデザインにおいて重要である理由
私は任意の昔のOSのUIを現代的なコンポーネントを用いて作り直す実験をしました。ここにNeXTSTEP OSのファイルビューアがあります。（次の章の図の左のスクショです。）
現代のコンポーネントを昔のレイアウトに入れ込んでみる
ここで旧来のレイアウトにはいくつかの問題があることがすぐにわかりました。
最初の行が何を示しているのかが不明確。お気に入りのようにも見えるが、未だによく分からない。
2行目はナビゲーションの用途として機能しているが、Preview.appの選択はフォルダー内の選択と重複してしまっている。
ナビゲーションは水平スクロールだが、フォルダのコンテンツは垂直スクロールになっている
縦方向のレイアウトの約半分程は、お気に入りとナビゲーションの行に使われてしまっている
現代のコンポーネントで作り直した後（右のスクショ）も、これらの問題が残りました。確かにアプリアイコンの見た目は良くなりましたが、画面全体では非常に使いづらいものになっています。
アイコンを変えるだけではUIの改善には何の役にも立たないことがわかります。
現代のレイアウトに昔のコンポーネントを当てはめてみた
私は現代のレイアウトを使って昔のUIコンポーネントを入れ込み、比較してみることもしました。（下の図の右のスクショ）
やってみるとユーザーが現在どこにいるのかやユーザーのお気に入りもサイドバーとコンテンツによって明確にわかるため、現代のレイアウトはよく機能していると言えます。そして特にスクリーン自体に水平方向の情報が必要な場合において、ウィンドウのレイアウト全体がとてもよく設計されていることがわかります。
まとめると、レイアウトは見た目や雰囲気よりも重要なものであるということです。レイアウトはアイコンやコンポーネントのディティールを作り込むことよりも重要です。デザイナーとして、私達はどのようにレイアウトを改善し、現代においてはどんなパターンがトレンドとなっているのかを把握する必要があります。
感想：UIはグラフィックデザインじゃねぇ！ということを理屈で教えてくれる記事
UIデザインというとどうしてもロゴやアイコンを作ったり挿絵を作ったりということを求められがちなのですが、この記事の言う通りそういったグラフィック要素がUIに寄与するインパクトは限定的で、その基礎部分にあるレイアウトやナビゲーションの設計、インタラクションをいかにするかが大事なのだと改めて考えさせられました。
とは言え、自分のようにデザイン組織がないにも関わらず規模が大きめな会社で働いていると、こういった根本の部分からデザインにタッチできる機会が少なく、表層的なデザインのみをちょこちょこ作っていく、みたいなことをやらざるを得なかったりします。
このあたりの意識改革を企業の中でやりたいと考えて、今月イチデザイン勉強会を大阪の京橋でやっています。（2024年1月の会は1月9日になります）
そんなつもりはなかったけれど無理やりつなげた感ありますが、、もしご興味ある方いらっしゃればnoteに過去の勉強会の内容も載せてますのでチラ見してみてください。
個人的に気になった海外記事を週数本メモしていますので、よければフォローおねがいします
ポートフォリオ
X（お気軽にDMください）
https://twitter.com/yamashita_3
__________________________________________________________
#デザイナー #UIデザイン #UX #UXデザイン #UI #海外記事翻訳
この記事が参加している募集
サポートいただいたお金は今後の発信活動に関わるものに活用させていただきます。