てくすた

ピクスタ株式会社のエンジニア・デザイナーがつづるよもやまテクニカルブログです

デザインレビューを導入してどうなったか

こんにちは、デザイナーの宇田川です。

PIXTAではデザインレビューを導入して、サイトのクオリティー管理をしています。

今回は

  • なぜデザインレビューをしているのか?
  • どのようにレビューしているのか?

などをお伝えしたいと思います。

目次

  • デザインレビューを導入したきっかけ
  • 導入に当たって、検討した事
  • どのようにデザインレビューをしているのか
  • 導入してよかった事
  • まとめ

デザインレビューを導入したきっかけ

PIXTAのデザイナーはアルバイトを含めると6名います。

デザイナーそれぞれがプロダクト全体のデザインや、新しいプロジェクトに配置されてサイトデザインをしていますが、 その中で様々な問題が発生していました。

問題

  • デザイナーによって、サイトUIのトンマナ(トーン&マナー)が微妙に変わっている
  • デザイナーが自分が担当していないページや、機能を把握できていない
  • そもそもデザインのチェック体制が曖昧だった

このような問題があり、

「情報の共有」と「クオリティー管理」

を改善点としてとらえ、デザインレビュー導入に踏み切りました。

導入に当たって、検討した事

まずは問題点の解決とどのようなレビューにすればいいのか??

  • チェックフローはどうするべきか?
  • デザインを共有できる!ログがしっかり残り、振り返れる!
  • デザイナー以外の人もレビューに簡単に参加できるといいなー

などを考えて検討した結果

invisionを導入してレビューツールにしました。

www.invisionapp.com

また、チェックフローも

  1. プロジェクトのメンバー間でデザインレビューをする
  2. 最後に必ずデザインチーム(6人)にレビューを依頼する

というフローを決めました。

どのようにデザインレビューをしているのか

invisionでデザインのレビューを出すとレビュアーから、 機能的にわからない点の質問や、UIについてこうした方がいいんじゃない? 等のコメントがきます。

f:id:naoki-udagawa:20170726111917p:plain

そのコメントをチェックして返信をし、 直すべきUIは修正を入れて再度レビューを出します。

f:id:naoki-udagawa:20170726112110p:plain

レビューでは簡単にコメントをする事もでき、直感的にわかりやすい!

また、デザイナー以外のメンバー(エンジニアやディレクター)も気がついた点は なんでもコメントを残してくれるので、メンバー全員でプロダクトのUIを提案しています。

レビューフローにも記載しましたが、最後に必ずデザイナーチームでのレビューを行いますが、

このレビューでは

  • 必ず修正した方がいいところ(MUST)
  • 僕ならこうするけどどう?(IMO)

をコメントに記載してレビューをしています。

コメントのログも残るので、後でも振り返りができるのも良い点だと思っています。

導入してよかった事

必ずデザインチーム全員にレビューを出す!

をする事によって、デザイナーが担当していないデザインの情報をインプットでき、

情報の共有が自ずとできるようになりました。

クオリティーの管理と言う点も、プロダクト全体のデザインの統一ができるようになってきています。

後は、デザイナー以外のメンバーも、結構UIに対して意見を言ってくれる事が多くなった事が ユーザーにより良いUIを提供できることに繋がって行くと感じています。

まとめ

いかがだったでしょうか?

デザインレビューはデザインのクオリティー管理だけではなく、 情報共有のツールとしても活躍してくれます。

デザインレビューに興味をお持ちの方は、ぜひ導入して見てください。