こんにちは、うまです!
デザイナー未経験の方や学生の皆さん、デザイン業務がどのように進んでいくのか興味がありますよね。職業訓練校で勉強していた頃、何を作るのかは理解できても、どのように進むのかを知りたいと常に思っていました。
今回は、GMOインターネットグループの株主優待サイトに設置するチャットボットのデザイン作成の流れの一例をご紹介します。これが皆さんの参考になれば嬉しいです。
チャットボット制作の流れ
初期段階
チャットボット制作の依頼を、部門のマネージャーから受けます。普段はバナーやLPの制作、グラフィックやグッズ・ロゴのデザイン、会社イベントへの登壇など多岐にわたる業務を行っていますが、チャットボットのデザイン制作は今回が初めてです。
業務の概要(期間、納品日、担当するコーダーとディレクターの紹介など)についても説明を受けます。今回は3週間での完成を目指します。
業務のスケジュールにおいては、ラフの完成、デザインの作成期間、デザイン確認など、各ステップを具体的に設定しています。他の業務との並行作業になるため、優先順位をつけての作業を意識しています。
依頼のアサイン
業務はマネージャーやリーダーが選んでアサインしてくれますが、自分の希望する仕事がある場合は相談すれば考慮してくれることもありますし、会社内のコンペで選ばれるとできる業務もあります。
ラフ作成
依頼者との認識合わせ前に、マネージャーと相談してチャットボットのラフを簡単に作成しておきます。この段階で必要なUI(ユーザーインターフェース)をリサーチし、実際に使うものを選定します。
↑実際のラフ案です。
最近では、さまざまなAIを活用した業務が増えてきています。今回は、チャットGPTを利用してUIのリサーチを行う方法をご紹介します。たとえば、「チャットボットのUIで必要な要素は何か?」といった質問を投げてみるとこのように回答を教えてくれます。
AIでの回答も参考に、一般に利用されているチャットボットも調べてよりイメージを作成していきます。
認識合わせ
円滑な進行には、初期段階での認識合わせが欠かせません。ここでは、依頼者、ディレクター、コーダー、システム担当者とともにミーティングを行い、依頼内容やスケジュールを詳細に確認します。
目的や課題についても議論を行います。この段階で不明点をクリアにし、今後生じる可能性のある疑問を事前に解消することが円滑な進行に繋がります。
また、この段階でラフデザインを見てもらうことで、認識のズレがないかを確認することができます。
課題の解決
詳細なペルソナを確認し、ユーザーのニーズや特性を把握します。シニア層が多く利用するサイトに向け、文字を大きくしシンプルで見慣れたデザインにすることを心がけます。直感的な操作が可能なUIや見やすい配色を目指します。
チャットGPTのようなAIツールの利用・一般に利用されているチャットボットを参考に解決策のアイデア出しやデザインの選択肢を広げていきます。
調整
具体的なデザイン案を作成し、それが実装可能かどうかをコーダーやシステム担当者に相談します。その際、スケジュール内での実装が可能かも含めて調整を行います。
デザイン作成
今回の作成はイラレ・XDを使用しました。
デザイン以外にもチャットボット内に表示するコメントや注意事項なども考慮します。より分かりやすいデザインにするためにも、言葉の力を上手に活用していくことが大事だなと感じています。
確認
作成後デザインチーム内での確認を行います。確認作業は、各担当商材の責任者や最終的なデザイン責任者による段階的な流れになります。すべてのステップで問題がないと判断されれば、最終的に依頼者への提出へと進みます。
デザイン確認では、商材のルール、使いやすさ、目的適合、レイアウトなどを考慮してフィードバックをもらい反映します。
最終調整
デザイン決定後、さらに調整があればチームで検討します。
制約があるので全ての要望にお応えできるわけではないですが、できるだけ依頼者の希望に添える形を模索しています。
実装確認
実装作業に入ったら、最終確認のためにChromeやSafariといったブラウザ、およびPCとスマホの実機でもチェックを行います。
公開
デザインが完成し、実装も問題ないことが確認できたら、晴れて公開となります。
まとめ
今回の記事では、チャットボット制作の流れを中心にお届けしました。次回は、デザインを一から作る時の考え方や、AIを使用した作成方法など詳しく書く予定です
これからデザイナーを目指す方や、GMOインターネットグループのデザイナーの仕事内容を知りたい方に少しでも伝われば幸いです。私たちの会社見学も随時行っていますので、ぜひ一度サイトを覗いてみてくださいね。