💻

デザイナーにUIの相談をするときに気をつけたいこと。

2023/11/28に公開

はじめに

こんにちは、まさき。です。

突然ですが、新しくUIを作るのって難しくないですか?
ボタンや入力フォームがたくさん並んでいるUIなら、たしかにいろんなことができそうな気はしますが、同時にフォームをたくさん埋めるのはストレスだし、押さないといけないボタンがたくさんあると途中でその機能を使うのを諦めてしまうことがあると思います。

そんなわけで開発者だけで考えても埒が明かないので、新しいUIを作る際にはカスタマーサポートを行ってくださっている方々やデザイナーにUIのイメージを共有して、ユーザーがやりたいことができそうなUIになっているか、もっと改善できるところはないかなどをフィードバックをいただくことが多々あります。

この記事では、UIデザインをデザイナーに相談する開発者に向け、UIへのフィードバックをいただいたときの反省点を具体的なエピソードと改善点を添えて紹介しようと思います。

UIへのフィードバック時の失敗談

機能開発において、UIが複雑になりそうだったり、今のプロダクトにあまり無いようなUIを作る際に、デザイナーに相談することがありました。
開発の背景を説明しつつ、こんなUIを作りました!とモックの画像を見せながらフィードバックを得るような場を設定したのですが、結果、デザイナーを困らせてしまうことがありました。いくつか振り返りを兼ねて挙げて見ようと思います。

フィードバックしてほしい観点が曖昧だった

コードレビューのときに、大量の差分があるPRを渡されてなんの説明もなくレビューお願いします!ってされるとどこを見ればいいか困ると思いますが、それと同じようなことをやってしまいました。UIを作ってこのUIはこういう機能なんですがいかがでしょうか?という感じです。デザイナーからすると解決したい課題に対してこういう方法がありますよ!、こっちのほうが良いかもしれませんね!といった感じのフィードバックをしたいのに、このUI作りました、どうですか?では困ってしまいます。

このままだとUIが下に長くなってユーザーの利便性が悪くなってしまうと思うのですが、このようなケースで最適な解決策はありますか?とか、処理の進捗状況を管理するUIを作っているのですが、この見せ方で大丈夫ですか?このUIに他の情報も出した方がいいですか?という感じでしょうかね。

機能の仕様がある程度定まってから呼んでしまった

機能の仕様がある程度定まってからデザイナーを呼んでしまいました。仕様が曖昧な部分があるということは、現時点のUIに対してフィードバックをもらってもそのフィードバックが生かされない可能性があるのでフィードバックする側としても何をフィードバックすればいいんだろう?状態になってしまいました。

であれば、完全に仕様を決めてから呼ぶか、せっかく社内に開発者が相談可能なデザイナーがいるのであれば時間の許す限り最初から案件に関わっていただくのが良かったのかな、と思いました。開発者もデザイナーも手段が違うだけでユーザーが抱えている課題を解決するという目的は同じだと思うので積極的にコラボレーションしていくのがいいのかもしれません。

開発環境の前提を共有してなかった

この記事を書こうと思った一番の理由がこれです。フィードバック会でデザイナーにこんな感じにするのはいかがでしょうか、とUIデザインの提案をいただきました。が、いざ実装に入ったときにライブラリ(Bootstrap)のバージョンが古すぎてそのデザイン通りに実装するにはちょっと工数が伸びそうだな、と一部デザインを反映できなかった部分があります。できる範囲でデザインを活かしてほしいと言っていただけてはいたのですが、できるだけそのまま実装して欲しいはず。これに関しては開発環境を事前に共有することで回避することができたはずの事象でした。

まとめ

UIをつくるときにデザイナーに相談することがありました。
相談したときの失敗談を説明し、以下のようなことに気をつけるとより良いフィードバックをもらえるであろうということを説明しました。

  1. 課題解決プロセスの初期段階からデザイナーにも入っていただいてより良い課題解決手法を検討すること
  2. どの観点でレビューしてほしいのか、そのUIでどんな課題を解決したいのかを明確にすること
  3. UIを実装する開発環境で利用可能なライブラリなどの前提を事前に共有しておくこと

もしデザイナーにUIの相談をする機会に活かしていただけると嬉しいです。

NE株式会社の開発ブログ

Discussion