UXUIデザイン生成AIを使ってみる – ｢ChatGPT｣編

こんにちは。UIデザイナーのカヒブンです。

以前のブログで、AIを使ってUIページを生成することについて書きました。その中で、Galileo AI、Uizard、ChatGPTを紹介しました。実際にGalileo AIとUizardを操作した成果や感想については、サイト名のリンクからご覧ください。今回は「UXUIデザイン生成AIを使ってみる」の最終編ーーChatGPTの活用方法や、私自身が実際に試してみた結果を紹介したいと思います。

まず、｢ChatGPT」とは？

近年、人工知能（AI）の進歩は、デジタルデザイン分野における新たな可能性を切り開いています。その中でも特に注目されているのが、自然言語処理技術を活用したAIである「ChatGPT」の活用です。従来、デザインは人間の直感や経験に大きく依存していましたが、ChatGPTのようなAIツールは、デザイナーに新しい視点やアプローチを提供し、UXUIデザインの質を向上させるサポートをしてくれます。

ChatGPTがUXUIデザインでの活用方法

UXUIデザイナーやWebデザイナーが日々の業務でChatGPTをどのように活用できるか、実践的な例を紹介します。

１、カスタマージャーニーマップ（CJM）

ChatGPTはテーブルを生成する機能を持っているため、この機能はカスタマージャーニーマップ（CJM）の作成に非常に役立ちます。ChatGPTの応答は非常に正確であり、これを活用することで、ユーザー体験に関するリサーチの手間を減らし、改善点を特定し、顧客とのやり取りを最適化することができます。

ChatGPTに求人サイトのカスタマージャーニーマップを作成してもらってみました。

２、エンパシーマップ 

ChatGPTはテーブル生成のコンテキストでも、エンパシーマップの作成に成功しています。例えば、「求人サイトのプロジェクト用にエンパシーマップのテーブルを作成してください。」というリクエストに対して、ChatGPTは求人を探したいユーザーのニーズや問題、影響要因を正確に特定しました。このエンパシーマップを使うことで、デザインチームはエンドユーザーをよりよく理解し、そのニーズに応えるデザインを作ることができます。

３、プロジェクト計画 

プロジェクトの開発スケジュールを計画する段階で行き詰まっていませんか？そんな時は、ChatGPTに「週ごとのデザインマイルストーンを生成してください。」と頼んでみましょう。完璧ではないかもしれませんが、方向性をつかむためのヒントを得ることができます。

４、ストーリーボード 

ChatGPTを使って、「2種類のユーザーが求人サイトを訪問する際のストーリーボードを生成してください」というリクエストに対して、テキスト形式でストーリーボードを作成しました。ストーリーボードを作ることで、デザインチームはユーザー体験をより明確にし、改善すべきデザインのポイントを見つけることができます。

５、ユーザーフロー 

ストーリーボードに加えて、ユーザーフローも生成できます。ChatGPTを使ってユーザーフローを作成すれば、デザイナーは大いに助かるでしょう。長時間かけてシナリオを考えたり、ダイアログを書き出したりする代わりに、ChatGPTにリクエストを送るだけで、さまざまなユーザーフローの例を得ることができます。これにより、ユーザーのさまざまなゴールや動機を考慮したやり取りをデザインに反映させることができます。

1. サイト訪問
   • ユーザーが求職サイトのトップページにアクセス。
2. アカウント登録 or ログイン
   • 【新規ユーザー】アカウント作成
     • 氏名、メールアドレス、パスワードを入力し、アカウントを作成。
     • アカウント確認のためのメールを受信し、認証リンクをクリック。
   • 【既存ユーザー】ログイン
     • メールアドレスとパスワードを入力してログイン。
3. プロフィール作成
   • 【新規ユーザー】アカウント作成後、プロフィール入力画面へ遷移。
     • 履歴書情報、職務経歴、スキル、希望職種などを入力。
   • 【既存ユーザー】プロフィール情報を更新（必要に応じて）。
4. 求人検索
   • ユーザーが検索ボックスに職種、勤務地、雇用形態（正社員、パートタイムなど）を入力して検索。
   • 【検索結果】検索条件に基づいて求人が一覧表示される。
5. 求人詳細の閲覧
   • 検索結果から興味のある求人をクリックして詳細ページへ遷移。
   • 【求人詳細ページ】企業情報、業務内容、給与、応募条件などを確認。
6. 求人応募
   • 応募したい求人が見つかった場合、応募ボタンをクリック。
   • 履歴書や職務経歴書をアップロードし、応募完了。
7. 応募完了の確認
   • 【応募完了ページ】応募完了のメッセージが表示され、確認メールが送信される。
   • ユーザーはマイページで応募状況を確認できる。
8. 企業からの連絡待ち
   • 企業からの面接依頼や結果通知を待つ。
   • ユーザーはマイページで通知を確認、またはメールで連絡を受け取る。
9. 面接日程調整
   • 【面接通知】企業からの面接依頼が届いた場合、日程を調整。
   • 必要な書類や面接準備の確認を行う。
10. 採用 or 不採用通知
    • 面接後、企業から採用結果の通知が届く。
    • 【採用】新しい仕事のスタート準備。企業との契約手続きを進める。
    • 【不採用】他の求人にも引き続き応募する。

６、サイトマップ 

ChatGPTで視覚化する方法のひとつに、マインドマップをリクエストする方法があります。例えば、「求人サイトのサイトマップをマインドマップ形式で作成してください。」というリクエストを送ると、スクリーンショットのような図を生成してくれます。サイトマップは、ウェブサイトのオーナーやユーザーにとって役立つもので、ウェブサイトのコンテンツと構造を明確に把握できるようにしてくれます。

感想

個人的な感想ですが、ChatGPTはプレースホルダーコンテンツの生成、市場調査、新しい知識の学習などに利用できる、強力なユーザーエクスペリエンスデザインツールです。しかし、真に優れたユーザーエクスペリエンスは人間の深い洞察力と専門知識から生まれるものだと考えています。そのため、ChatGPTはデザイナーに新しいツールと能力を提供し、彼らの効率と創造性を向上させるものだと思います。

今回の記事では、ChatGPTの活用方法や、私自身が実際に試してみた結果を紹介しました。最後までお読みいただきありがとうございました！