こんにちは。株式会社PentagonでUIデザイナー、Webデザイナーをしているmaoです。
デザインを行う際、デザイナー同士でデザインレビューを行うのは当然のフローだと思います。
それと同じようにエンジニアの方にアプリのデザインレビューを行っていただいたり、デザインの知識を少しだけでも持っていただけると、とても良い開発ができるのではないかと思いました。
今回はエンジニアにデザインレビューを行っていただくことで得られるメリットと、レビューのために必要な視点についてお話したいと思います。
【こんな人に読んで欲しい】
- デザインに興味があるアプリエンジニアの方
- デザインレビューを求められたけれど、どうレビューすればいいか分からないエンジニアの方
【この記事を読むメリット】
エンジニアがデザインレビューを行うメリットと、デザインレビューを行うために必要な視点が分かります。
【結論】
エンジニアがデザインレビューを行えるようになると、その後の開発が楽になったり、より良い成果物を生み出すことができます。
エンジニアがデザインレビューを行うことのメリット
早速ですが、エンジニアがデザインレビューを行う上で得られるメリットには、下記の３つがあると考えています。
- 実装を意識した観点でのレビューがもらえる
- デザイナーが見落としていた穴や矛盾点に気づける
- デザインへの理解が深まり、実装時の再現度が上がる
実装を意識した観点でのレビューがもらえる
エンジニアの方にデザインレビューを行っていただくメリットとしてまず挙げられるのは、エンジニアの知識を活かし、実装を意識したレビューがもらえるということです。
例えば、下記のようなアドバイスをいただけると、後の開発で実装できない、想定以上に開発コストがかかるというようなことが回避できるでしょう。
- そのデザインが実装できるのかどうか
- より多く一般的に使われている実装方法はどれか
- 実装にかかるコストが少なくて済む方法はどれか
デザイナーが見落としていた穴や矛盾点に気づける
アプリを実装する際、１つの項目について、色々なステータスが存在する場合があります。
例えば、入力フォーム１つでも、下記のような複数の状態が存在します。
- 何もしていない状態：プレースホルダーが表示されている
- 入力欄をタップして、文字を入力できる状態：文字入力カーソルが表示されている
- 文字を入力した状態：入力した文字とカーソルが表示されている
- 入力内容に不備がある状態：入力欄の下にエラー文が表示されている
要素が状態によって色々な表示に変化する場合ですね。
それらのデザインに漏れがあった場合、レビュー段階でエンジニアからの指摘があれば、実装の前にデザインの不足や矛盾点に気づくことができます。
もちろん、デザイナーもレビュー任せにせず、デザインする際に漏れや矛盾が発生しないように気を付けましょう。
デザインへの理解が深まり、実装時の再現度が上がる
これはデザインレビューを行うメリットというより、デザインレビューを行うためにエンジニアがデザインの素養を身に付けることのメリットになるかもしれません。
私は主にWebデザイナー／UIデザイナーとして仕事をしていますが、Webサイトのコーディングもできるので、コーダーとしてお仕事をすることもたまにあります。
デザインの素養があるため、デザイナーの意図を汲み取ってコーディングできるので、成果物の精度が高いと喜んでいただけることがあります。
アプリエンジニアの方にもデザイン意識を多少でも持っていただければデザインへの理解が増し、実装する際に迷いがなくなるでしょう。
その結果、デザイナーが意図したことへの再現度が上がるのがメリットです。
エンジニアがデザインレビューを行うには
デザインレビューを行うのはデザイナーであっても難しいことです。
何か違和感を感じても、どこがおかしいのか気づけなかったり、それを言語化するのが難しかったりします。
そこで、デザインレビューをするためにどういう視点を持てばいいのか、どういった方法があるのかご紹介いたします。
ユーザー視点に立ってレビューする
これはデザインする際にも大切なことですが、ユーザー視点に立って考えるということです。
UI／UXが「ユーザーインターフェース」、「ユーザーエクスペリエンス」と言うように、ユーザーに良い体験をしてもらうことがアプリの成功に繋がります。
- この機能がここにあったらもっと使いやすいのに
- ボタンが小さすぎて押しづらい
- 文字が小さすぎて見えづらい
など、デザイン思考がなくてもユーザーの立場になれば見えてくることが沢山あります。
「デザインの知識がないのにデザインレビューなんて難しくてできない！」と思った方も、まずはユーザー目線に立ってみることから始めましょう。
デザインとはビジュアルの良し悪しでは無いことを理解する
デザインというと、「かっこいい見た目を作る」ことだと思っていませんか？
「かっこいい」の部分は「華やか」や「可愛い」に置き換えても構いません。
「センスが無いからデザインは分からない」と思っている方も多いでしょう。
ところが、デザインは単に個人のセンスだけで美しいビジュアルを作っていくことを指すわけではありません。
よく言われるのが「デザインはアートとは異なる」ということです。
辞書を引いてみると、デザインという言葉には次のような意味があるそうです。
デザイン（英:design）とは、「美しさ」や「使いやすさ」などの狙いを実現するために創意工夫すること、および、その創意工夫の成果を反映させた見た目や機能のあり方のこと。多くの場合「図案」「模様」「設計」「造形」「構想」などと言い換えられる意味合いで用いられる。
（引用：https://www.weblio.jp/content/design）
もっと分かりやすく言うと、デザインとは次のようなことをいいます。
- ユーザーが目的を達成するために情報を整理すること
- ユーザーをゴールに導くために見た目を工夫していくこと
論理的なデザイン思考に則って情報整理や見た目を工夫していった結果、デザインが美しく見えたりかっこよく見えたりすることはあるでしょう。
ただし、その美しさには理由があって、センスだけでできているものではないということを理解すると、デザインへの苦手意識や抵抗がなくなってきませんか？
デザインの勉強をしてみる
- ユーザー視点を持つ
- デザインは論理でできていることを知る
これらの段階を踏み、よりデザインについて知識を深めて「もっと高度なデザインレビューを行いたい」や「実装の際にデザイン思考を役立てたい」と思った方は、デザインの勉強をしてみることをおすすめします。
「デザインは論理でできていることを知る」の「論理」がどういったものであるか、理解を深めていきましょう。
最近はノンデザイナーのためのデザイン指南本や、デザインの基礎をまとめた書籍も多く出版されています。
デザイン初心者向けの有名な書籍を２つご紹介しましょう。
これらはデザイナーを志望する初学者向けの本として有名で、デザインの四原則などについても解説されています。
これを読むだけでも、デザインの基礎となる部分を学ぶことができ、デザインの「なぜ？」が解決できることでしょう。
デザインレビューはいつ行うのか
では、エンジニアからのデザインレビューはいつ行うのが良いでしょうか。
Pentagonでは、アプリ全体のワイヤーが固まった段階で一度エンジニアに全体を見てもらっています。
ここではワイヤーを見て、仕様的な抜けがないか、実装が難しい箇所はないかなどを主に見ていただいています。
まずこの段階で確認していただくことで、無茶なデザインが生まれないようにできるでしょう。
可能ならば、デザインができあがった際にもレビューを得られるといいですね。
実装に入ってから不測の事態が発生するより、その前に実装できない・実装に無理がある・（デザインにない）その他の箇所への影響が発生するなどの問題点はつぶしておくのが理想的です。
まとめ
エンジニアの方にアプリのデザインレビューを行っていただくことのメリットと、レビューするために必要なことについて解説してみました。
エンジニアがデザインについて理解を深め、デザインレビューを行えるようになると、その後の開発が楽になったり、より良い成果物を生み出したりすることができます。
デザインに苦手意識を持つエンジニアの方に、デザインを身近に感じ、デザインを理解することで得られるメリットについて知っていただければ幸いです。
