UI/UXデザインにおける「デザイン原則」ができるまで
こんにちは！UIデザイナーのニイノです。
普段は、カシオで開発している製品/アプリケーションのUIデザインを担当しています。
今回は、私が所属するUI/UXデザインチームの中で取り組んだデザイン原則の作成プロセスについてご紹介したいと思います。
UI/UXデザインチームが普段どんな仕事をしているかは、こちらの記事で紹介しているので合わせてご覧ください！
デザイン原則とは
書籍「Design Systems デジタルプロダクトのためのデザインシステム実践ガイド」によると、デザイン原則とは以下のように説明されています。
デザイン原則とは、チームにとっての優れたデザインの本質をとらえた共用のガイドラインであり、同時に優れたデザインの作成方法に関する指南書です。言い換えれば、何をもってプロダクトにふさわしいデザインとするのかに関して、組織内で承認された基準です。
デザイン原則は、海外のテック系企業から広まり、近年では日本の企業でも独自の方針や考え方を言語化し公開するのが当たり前になってきているように思います。ウェブで「デザイン原則」と検索するだけでも、今ではたくさんの企業のデザイン原則が参照できます。
※厳密には「デザイン原則」と呼んでいないものも含まれ、また各社独自に定義をしているものもあります。ここでは、その会社や組織、プロダクトにおける指針や原則の例を引用しています。
上の例を見てもらえばわかる通り、記載されている内容は各社さまざまであり、原則からその企業の色が見えてきます。
UI/UXの価値の高まりと共に、原則が必要に
カシオが開発する製品は、これまでG-SHOCKをはじめとする時計や電卓、電子ピアノなどのハードウェア製品でした。その中でのUIデザイナーの役割は、製品に備え付けられる液晶画面のUIデザインが中心です。ハードウェアと一体化したUIの価値を追求できるので、とても楽しい仕事だと感じています。
現在でもそのような仕事はあるのですが、2020年に入った頃から、学習アプリ「ClassPad.net」をはじめとしたソフトウェア単体で価値提供を行う製品が増えてきます。製品デザインにおいて、UIデザイナーが主役になる事例が出てきたのです。UIデザイナーにとってはとても嬉しく、やりがいのある状況です。
ClassPad.netについては、興味があったら調べてみてください！
そんな中で、カシオのUI/UXデザインとはどのようなものか？何を大事にしているのか？について統一した考え方をまとめる必要性が高まってきているのを感じました。
そこで、チーム内の取り組みとして、カシオ全体の製品の中で特にUI/UXのデザイン領域におけるデザイン原則の作成に挑戦することになりました。
UI/UXデザインチームのデザイン原則
早速ですが、記事公開時点でのデザイン原則がこちらになります。
サービス精神を発揮する
お客さまがワクワクしたり、心地よいと感じてもらえる体験をつくるため、「ここまでこだわるか！」と感じられるような一手間を加えます。
骨太なコンセプトを貫く
言葉やビジュアルを研ぎ澄ましたコンセプトによって、プロダクトに個性を持たせます。体験 / インタフェース設計 / ビジュアルなど、あらゆる場面でコンセプトを貫きます。
淀みのない流れをつくる
お客さまのメンタルモデルや自然の法則にならい、引っ掛かりがなく、流れるように操作できるインタフェースを設計します。
寄り添いつづける
モノ / コト / お客さまへの徹底的な観察を通して心理や行動を先回りし、お客さまを気遣います。また、プロダクトの改善によって、それらを継続していきます。
どうでしょう。読んでいるみなさんが共感できるような言葉はあったでしょうか。
それぞれの原則が、UI/UXデザインにおける本質を言い表すことを意識すると共に、シンプルかつ短い言葉で覚えやすいものになるよう、慎重な言葉選びを心がけました。
また、ここには記載していませんが、「Point」という項目でデザインする際の具体的な心掛けを一緒に載せることで、実際の仕事に活かしやすい作りにしています。
みんなでつくる、共創プロセス
この4つのワードに行き着くまでには、複数のインタビューやワークショップを経ています。特に大事なポイントとして、UI/UXデザインチームのメンバーが納得できる原則であることを第一に考え、少人数での対話会やワークショップ形式で意見を集めることを大事にしました。
自分自身、原則のような抽象的な概念をまとめていくプロジェクトが初めてだったので、ブランディングチームの当時のマネージャーの方に何回も相談に行き、ブランディング的な考え方を教えてもらいながら進めていきました。
おおまかなプロセスとしてはこのような形です。書いてみると整った進め方のように見えますが、実際にはかなり悩みながら、その場でやり方を変えたりを繰り返していきました。
このプロセスの中で、特に印象に残ったワークショップを1つご紹介します。
Visionをみんなで読みとく -Visionブレストワークショップ-
他社のデザイン原則からもわかる通り、デザイン原則からは、その組織のデザインの特徴や方向性が滲み出るものだと考えています。そのため、「どんなデザイン原則にしたいか？」と並行し「UI/UXデザインチームのデザインにはどんな特徴があって、どんな風にしていきたいか？」というのをみんなで考えたのがこのワークショップ（以下WS）です。
当時のチームの上位方針であるVisionが「街」になぞらえたものであったため、カシオを1つの「街」として捉え、その「街」の特徴やエッセンスを言語化する形でキーワードを抽出していきました。自分たちの普段のデザインのエッセンスを言語化するような抽象的な議論は難易度が高いと考え、実在の街をベースにブレストすることで言語化しやすく、メンバーのイメージを揃えやすくすることを狙いました。
結果、実際の街を題材にして会話することによって話も弾みやすく、リラックスした雰囲気でブレストを行うことができたと思います。普段の業務ではなかなか話さない抽象的な話題を上手く引き出すようなWSが設計できたと感じました。個人としても、こうしたWS自体の設計の工夫なども学びが大きかったです。
このようなWSを経ながら試行錯誤して出来上がったデザイン原則ですが、一度完成して終わりというわけではありません。ここからは、デザイン原則をメンバーに浸透させていくフェーズに入っていきます。
原則は納得できるものだった？
前述の通り、デザイン原則を作成するにあたってUI/UXデザインチームのメンバーが納得できる原則であることを第一に考えたと書きました。実際、納得できるものになっているのか？について、メンバーに対し5段階でアンケートを取ってみました。
ある程度は納得してくれている！嬉しい！
納得度として一定の評価はあったものの、やはり今後どのように運用していくのか？どうブラッシュアップするのか？が課題になりそうだということが分かりました。また、原則を作成したばかりで、原則に対する理解度や解釈もまだバラバラです。
そこで実験として、UI/UXデザインチームのメンバーそれぞれの原則に対する解釈を共有しあい、理解を深めるための場を作ってみることにしました。
原則の理解を深める -デザイン原則ワークショップ-
UI/UXデザインチームがデザインしたプロダクトを題材にし、そのプロダクトを原則に紐付けて褒め合ってみるというWSを実施してみました。原則の解釈を共有し合い、その言葉の意味を深く理解することが目的です。大まかな流れは以下の通りです。
事前準備
題材となるプロダクトを1つ選ぶ
そのプロダクトのデザイナーと一緒に、WS参加者にプロダクトを触る動機になるような「お題」を設定する（一定の目標を設定することで、参加者がある程度同じレベルでプロダクトを触れるようにする）
参加者がお題に沿って2-3週間プロダクトを触ってみて、プロダクトの良い点（GOODポイント）を原則に紐づけて考察する
WS本番
参加者それぞれがお題に取り組んだ結果と感想を共有する
参加者それぞれのGOODポイントを共有し合う
参加者の共有を受けて、プロダクトのデザイナーがそのプロダクトで一番満たせていると感じたデザイン原則を1つ選び、その理由を語る
それぞれのデザイン原則の理解や解釈の違いについて気づきを共有する
具体的なプロダクトのGOODポイントを見つけることを通して、それぞれのデザイン原則に込められた意味をそれぞれが考察してくれることを狙った設計にしています。初回のWSではClassPad.netを題材に、それぞれが見つけたGOODポイントを共有してもらうことにしました。以下のように、実際にシートを記入して共有してもらいます。
また、通常の業務でのデザインレビューと比べよりフラットに、ポジティブな議論をしてもらいたかったため、「参加者の心構え」として3つのポイントを設定し、参加者にあらかじめ共有をしました。
少し捻った構成のWSだったため上手くいくかが不安でしたが、「プロダクトを褒め合う」プログラムにした結果、ポジティブな議論が生まれていたと思います。
また、最後のふり返りでは、「原則の説明をよく読んだら、こういうことが書かれていた」「原則がそれぞれ似た部分があり、解釈に迷った」「この原則は独自性があると思った」など、それぞれの原則に対するメンバーの解釈の違いや課題が浮き彫りになり、当初の目的が達成できたのでは考えています。
ちなみに、このWSではお菓子を必ず用意して社内のカフェスペースで実施することで、普段の業務に比べラフな雰囲気で話し合ってもらいました。デザイナーらしく、毎回こだわりのお菓子が用意されるのも楽しみの一つに…
このWSはメンバー内で数回行い、その議論を元にデザイン原則のアップデートを行っていきました。その結果が冒頭に紹介した原則です。
このように、現在もWSなどを通してチーム内の浸透 / 運用を進めている状態です。定量的な効果を測るのは難しいですが、UI/UXデザインチームが手がけるデザインに対して少しずつ一貫性が生まれてくることによって、いわゆる「らしさ」のようなアイデンティティが強化されていくことを期待しています。
活動の広がりとこれから
デザイン原則を作成して約2年ほどが経ちました。前述のデザイン原則WSも複数回実施し、だいぶメンバー間での理解が揃ってきているように感じます。
現在では、新しく加入されたメンバーに向けてのワークショップ実施や、インターンシップのプログラムにデザイン原則を絡めるなど、地道に活動を続けています。
こうした組織のガイドラインを作成するような取り組みは道半ばな部分もあり、まだまだブラッシュアップが必要に感じています。同じような活動をされているデザイン組織の方がいらっしゃれば、ぜひコメントいただけると幸いです！
【その他のカシオUI/UXデザイナーに関する記事はこちら】