UX / UI のデザインに強いWebシステムの開発と、BtoB Webマーケを支援するWeb制作を提供するN’s Creates (エヌズクリエイツ) 株式会社の坂本です。

デザインデータの作り方にも改革がありました。
入社するまで「自分のための備忘録」のような存在だったデザインデータが、「チーム全体で確認する設計書」になりました。

これはデザインの話ですが、Excelの表作りや資料のフォルダ分けなど、『次にそれを使う誰か』がいるすべての仕事に通じることかもしれません。

今回は、次にデータを開く人を迷わせないための工夫についてご紹介します。

意識改革のきっかけ

先輩デザイナーがクライアントとのミーティングの際に用意するデータには、
至る所に矢印や注釈があり、説明がなくても「次に何を見るべきか」が、ひと目でわかるようになっていました。

一方で、私が修正したデータを画面共有をしながら先輩デザイナーにフィードバックをいただいている時に、
「あれ、次の画面はどこにある？」と、先輩デザイナーが迷子になってしまう場面があったのです。
その際に、こうすれば見やすくなる！というポイントを教えていただきました。

次の章では、教えていただいたものと私が思いついたものを織り交ぜて3ポイントご紹介します。

「相手の時間を奪わない」ための3つの工夫

1. 「比較」のストレスを最小限にする
   新旧で複数画面の改修を行った際、「旧デザイン複数枚」の横に「新デザイン複数枚」を並べて配置しました。
   しかし、先輩からのアドバイスは「旧001・新001・旧002・新002……と交互に並べるほうが、差分がすぐに分かっていいよ」というものでした。
   「確認する人が、目をどう動かすか」を想像する。この視点が大切であることを学びました。
2. 情報に「属性」というタグをつける
   データ内のコミュニケーションを円滑にするため、先輩から紹介していただいたFigmaの「Comment note」というプラグインを活用するようになりました。
   このツールを使い「仕様」「作業者メモ」といったカテゴリ（タグ）を明示するようにしたのです。メモをより良いかたちで記録することを学びました。
3. 「データ上の正解」と「見た目の違和感」を補足する
   デザインでは、数値上は中央に揃っていても、画像の形によっては視覚的にズレて見えることがあります。
   そんな時、「データ上は揃っていますが、視認性を優先して調整しています」と注釈を入れることと、ズレて見えないパターンを作成するようにしました。

まとめ

今は、直接エンジニアの方やクライアント様とやり取りする場面はありませんが、
私の目の前にいる先輩の先に、必ず多くの方々がいます。
データの整理ひとつでも まだまだ改善点がたくさんある私ですが、
『私の整理一つで、チーム全体の確認が早まり、クライアント様への提案がスムーズになる。』
その意識を大切にこれからのデータ作りをしていきます。