インタラクションを"感覚"から"言語"へ - インタラクションデザインシステム - 前編
こんにちはー！アクセンチュア ソングでインタラクションデザインのリードをしている佐々木です。
先日、アクセンチュア・イノベーション・ハブ東京にてFigma Japanさんの2周年記念イベントが開催されました。
改めまして、Figma Japanさん、2周年おめでとうございます！
イベントのセッションでは、「インタラクションを”感覚”から”言語”へ」と言うテーマで、私たちアクセンチュア ソングのインタラクションデザイナーが開発した”atom Interaction”というシステムを紹介させて頂いたのですが、皆様からたくさんの反響を頂きましたので、本記事ではその内容をご紹介できればと思います。
※この記事は前編と後編2回に分けてご紹介します。
前編では、インタラクションを言語化する必要性についてご紹介します。
インタラクションとは？
ユーザー操作を前提としたデザインをする上で、切っても切り離せないのがインタラクションではないでしょうか。
つまり、ユーザー操作に対するフィードバックのことですね。適切なインタラクションがあることで、操作性が高まり、結果としてサービスの満足度が上がる重要な要素と言えます。
今回はモバイルデバイスのインタラクションに焦点を当ててお話しをしていきます。具体的には、以下のようなユーザー操作に対する動きをイメージしていただければと。
さて、このインタラクション、みなさんは人に伝える時にどうやって伝えていますか？擬態語や擬音語と言われるオノマトペを使って感覚的に伝えてしまったりしていないでしょうか。
日本語にはおおよそ4,000語以上のオノマトペがあると言われていて、他の言語と比較しても表現力豊かな言語なんですね。なので、オノマトペでも表現しきれないと言うことはないのかもしれません。
但し、この表現の感じ方は人それぞれなので、私が表現する“スルー”や“ぴょーん”が、今記事を読んでくださっているみなさんと同じとは限りません。
伝え方が品質を左右する
インタラクションをチームメンバー、例えば、クライアントやエンジニアに正確に伝えることは、プロダクトや仕事自体の品質を高めるために非常に重要です。
しかし、感覚に頼ったコミュニケーションは、すれ違いを誘発し、インタラクションの必要性を理解していただくことが難しくなってしまったり、開発工数の増加に直結したりして、品質を左右する重要な要素であるはずのインタラクションを諦めることになりかねません。
そうなると、高められたはずの品質レベルまで届かないと言う悲劇が起こってしまいます。
違うものを他のメンバーは想像しているかも？
インタラクションが伝えにくい理由
ではなぜ、インタラクションが伝えにくいのかと言いますと、
ズバリ、言語化できていないのが理由です。
これは、若手のデザイナーだけにとどまらず、ある程度キャリアがあるシニアなデザイナーであったとしても、インタラクションのことを感覚的にはわかっていても、改めて言語化しようとすると難しいのではないでしょうか。
みんなでインタラクションを語れるシステム”atom Interaction”
そこで私たちアクセンチュア ソングのインタラクションデザイナーは、デザイナーもデザイナーではない方も、みんなでインタラクションを語れるシステム”atom Interaction”を開発しました。
atom Interactionは、伝えにくいインタラクションを構造的に言語化し、インタラクションを語る上での共通化されたシステムです。
制作にあたり、さまざまなサンプルを収集して、特性やパターンを探っていきながら、インタラクションを最小単位まで分解し、感覚ではなく言語でインタラクションが語れるようにしました。
インタラクションは以下の4つの最小単位で構成されています。
それが、Object, Trigger, Response, Purposeです。
Object：ユーザーが操作する対象（ex.ボタンやカードなどのUIパーツ）
Trigger：起点となるユーザーの操作（ex.ボタンをタップする、カードをフリックする）
Response：オブジェクトやUI全体の振る舞い（ex.ボタンの色が変わる、カードが右から左に動く）
Purpose：ユーザー行動の目的（ex.決定したいから、カードを切り替えたいからなど）
atom interactionでは、これらの4つ要素を原子と見立て、
その原子で構成されている分子をインタラクションとして位置付けました。
（余談ですが、だからatom interactionという名前なんです！）
こうする事で、伝えにくかったインタラクションを構造的に言語化して伝えることが可能になります。
前編では、インタラクションを言語化するには？という事に焦点を当ててご紹介しました。
後編では実際のatom Interactionの中身をご紹介していきますね！
私が考えるデザイナーの仕事
今回、登壇のお声がけを頂いた際、他の登壇者様の内容は知らずに持っていったのですが、蓋を開けてみると、どの登壇者様もデザインをデザイナーだけのものにせず、”みんなでデザインを作るには？”という軸でお話しされていましたね。
私たちデザイナーの仕事は、ユーザーのことを考えてデザインするということはもちろんなのですが、クライアントやエンジニアなど、プロジェクトメンバーの目線を合わせ、一緒にゴールを目指せるようにコミュニケーションでサポートすることも大切な仕事だと私は思っています。
Figma Japan Designer Advocateの谷さんも、Designing for Everyoneとお話しされていましたが、みんなでよいものづくりをする事で、素晴らしいデザインが溢れる素敵な世界を作っていきたいですね。
著者プロフィール
佐々木 亜由美 – Ayumi Sasaki
Interaction design Senior Manager / Capability lead
みんなの銀行や資生堂 Beauty Keyなどでデザイン賞を受賞。
“いいものづくり”に情熱を注ぎ、その熱意が周りの人を動かし、コラボレーティブなチームを作ることに定評がある。