🌊

エンジニアがUI/UX力を高めるには?

に公開

はじめに

「この画面は如何にもプログラマーが作ったって感じだね」

これは、先日私が作成した画面を知人に紹介した際に、ポロッとこぼれた言葉です。
自分でも薄々は感じていましたが、改めて言葉にされるとどうしたら良いものかと頭を悩ませました。

機能的には十分、しかし使いづらく、見づらい...。そんな画面を見たことがある方、あるいは私と同じように、そんな画面を作ってしまった経験のある方もいらっしゃるかもしれません。

やはりエンジニアにとってUI/UXは難しいのか?

そんな自身の問いに答えるため、UI/UXを考える上で何が妨げとなっているのか、またどうすれば機能だけではなく、「使う人の視点」でよりよい体験を提供できるようになるのか調べてみました。

なぜ優秀なエンジニアでも、使いづらいUIを作ってしまうのか?

かなり昔(1990年!)の文献ですが、Donald R. GentnerのWHY GOOD ENGINEERS (SOMETIMES) BAD INTERFACES という論文に、まさにこのテーマが語られています。この論文では、エンジニアが システム内部の仕組み(エンジニアリングモデル) に基づいてUIを設計する傾向があることが指摘されています。しかし、ユーザーは 目的達成を重視する視点(タスクモデル) でシステムを利用します。

エンジニアはシステムの基礎となるメカニズムに精通しているため、メカニズムの制御点に直接アクセスできるインターフェースが最も自然だと考えます。しかし、ユーザーは主に達成したいタスクに関心があります。例えば、細かい設定を自分でいじるよりも、システムが自動的に適切な設定をしてくれることを望むかもしれませんし、いくつかの操作をまとめて一度に行いたいと考えるかもしれません。

つまり、エンジニアの考える「使いやすさ」と、ユーザーの「使いやすさ」にはズレがあると考えられます。

このズレを解消するために、以下の点が重要であると述べられています。

  • 一貫性だけでは不十分:システムと整合性が取れていても、必ずしもユーザーにとって良い体験になるとは限らない
  • 素朴な視点の導入:システムの内部構造に詳しくないデザイナーの意見は、新しい視点をもたらし、ユーザー視点での設計に貢献する
  • 早期からのユーザー巻き込み:開発の初期段階から実際のユーザーを巻き込み、彼らがどのようにシステムを使うかを理解する
  • ユーザーの作業環境の継続的な観察:技術の進化とともにユーザーのタスクも変化するため、UIもそれに合わせて継続的にアップデートする

ユーザー視点を取り入れるためのヒント

エンジニアの視点からユーザーの視点へとシフトするには、具体的にどうすれば良いのか?Why is user experience so hard for some developers?という記事では、UI/UXが苦手なエンジニアが陥りがちなこととして、多くのエンジニアがソフトウェアが正しく動作することを最優先に考える一方で、UXデザイナーは人の行動や感情、経験を理解することに重きを置くと指摘しています。この思考のギャップを埋めることが、UI/UX改善の第一歩となります。

そして、記事ではエンジニアへのアドバイスとして、以下を挙げています。

  • デザインはコーディングとは別のスキルと理解する
  • 基本的なデザインの原則(アフォーダンス、フィードバック、フィッツの法則など)を学ぶ
  • プロトタイピングやスケッチなど、ローコストで試行錯誤する
  • ユーザビリティテストを実践する
  • デザインパターンや情報設計(IA)を学ぶ
  • デザイナーやUXの専門家と協業する
  • ユーザー調査やフィールドワークを体験する
  • UX関連のイベントやワークショップに参加する

今日から実践できるUI設計の基本原則

これらの学びを踏まえ、日々の開発で今日からでも実践できる具体的なヒントは何なのか。5 UI Design Tips for Engineersでは、エンジニアがすぐに取り入れられる5つのポイントが強調されていました。

  • 実績あるデザインパターンを使う:既存のパターンを使うことで、ユーザーの迷いが減り、学習コストが減る。

  • 視覚的なヒエラルキーを作る:余白、色、フォントで情報の優先順位を表現し、ユーザーの理解を助ける。

  • アイコンにはラベルをつける:よくある誤解の原因は、意味の分からないアイコン。テキストを添えて明確に。

  • プロトタイプではリアルな文言を使う:ダミー文(Lorem Ipsum)では本当の使われ方が分かりづらい。リアルなコピーで確認を。

  • アクセシビリティを意識する:色のコントラストやラベルの有無など、すべての人にとって使いやすいUIを目指す

おわりに

今回あらためて調べてみて、自分が無意識のうちに「エンジニアリングモデル」でデザインを考えていたことに気づかされました。「システム的に正しいこと」と「ユーザーにとって使いやすいこと」は必ずしも一致しない。これはエンジニアとしてとても大事な視点だと実感しました。

また、UI/UXはコードを書くスキルとはまったく別の能力であり、継続的に学ぶ必要があることも再認識しました。基本的なデザイン原則やプロトタイピング、ユーザビリティテストなど、まだまだ学ぶべきことは多いと感じています。

これからは、エンジニアとしての視点だけでなく、ユーザーの立場に立って考える癖をつけること。そして、デザイナーや他職種のメンバーともっと積極的に対話し、学び合っていきたいと思います。

UI/UXに「正解」はないと思います。しかし、ユーザーの視点を持ち続け、実践と振り返りを繰り返すことで、より良い体験は必ず提供できると思います。この学びを活かし、一つ一つの画面を丁寧に作り上げていきたいと思います。

参考

株式会社アットウェア

Discussion