Content last updated 2026-06-15

AI の利用

デザイン業務で AI を使うタイミングを学びます: ベストプラクティス、避けるべきこと、ユーザーを中心に据え続ける方法。

このページでは、リサーチ、デザイン、プロトタイピング、ドキュメント作成など、Upstream Studios の業務で AI を使う方法を説明します。

AI エクスペリエンスに取り組む方法を知りたい場合は、こちらのリソースを参照してください。

始める前に

GitLab で AI ツールを使う前に、以下を読んでください:

承認済みツール

ツール	最適な用途
Claude	リサーチ、執筆、分析、一般的なタスク
Claude Design	ビジュアルデザイン、プロトタイプ、スライド、ワイヤーフレーム、モックアップ
Claude Code	コーディングタスク、エージェント型開発、MR レビュー
Dovetail	インタビューの文字起こし
FigJam	ホワイトボードと図表
Figma Design	コンテンツ、画像、デザイン、基本的なプロトタイプ
GitLab Duo	GitLab とソフトウェア開発のタスク
Rally	インタビューの文字起こし

注: Figma Make は、有料の Figma シートで利用できるプロトタイピングツールです。利用可能なクレジットを使い切らないよう、まず Claude Design または Claude Code を検討してください。私たちの Tech Stackには、利用できる AI 機能を持つ他のツールが記載されている場合があります。

AI が得意なこと

AI は、判断やユーザーリサーチの代替ではなく、創造的な補助役かつ批評者として使ってください。

フィードバック

Claude でドキュメント、画像、Figma リンクをレビューする
GitLab Duo Code Reviewにマージリクエストのレビューを依頼する
同僚に専門的なレビューを依頼する前に、AI を使ってすばやくフィードバックを得る

リサーチ

調査計画、インタビューガイド、アンケート質問、ユーザビリティテストのタスクを下書きする（Claude）
Dovetail または Rally でインタビューを文字起こしし、その後 Claude で分析する
背景情報を要約し、参考資料を見つける（GitLab に関する情報は GitLab Duo、Web リサーチは Claude）
データ内のパターンやテーマを見つける—主張を必ず検証し、出典を求める
ペルソナやプロトペルソナを下書きする—仮説上のものは明確に示し、実際のユーザーで検証する

デザイン

複数のデザインの方向性、エッジケース、エラー状態をすばやく探索する
エラーメッセージ、ツールチップ、空の状態、マイクロコピーなどの UI テキストを書き、イテレーションする
GitLab のブランドボイスに合うようにトーンを調整する
プレースホルダーコンテンツを実際の UI テキストに置き換える
ワイヤーフレームの出発点を生成する—最終デザインではなく、最初のドラフトとして扱う
色のコントラスト、フォーカス順序、ラベルの明確さなど、アクセシビリティ上の問題がないかデザインを確認する

プロトタイピング

Figma Design で基本的なプロトタイプを作成する
Figma Make（Pajamas コンポーネントをサポート）または Claude（汎用 UI）で機能するプロトタイプを作成する

図表とワークショップ

FigJam でホワイトボードや付箋の演習を準備する
図表、マインドマップ、フローチャートを作成する。Claude と GitLab Duo は GitLab Flavored Markdown diagramsをサポートしています

ドキュメント

Claude または GitLab Duo でドキュメントを下書き、改善、再構成する
GitLab ドキュメントに AI を使う方法を参照してください

リサーチ固有のプロンプトについては、UX Research Prompts（内部）も参照してください。

AI に向いていないこと

実際のユーザーの代替: AI は実際の行動、感情、文脈をシミュレートできません。ユーザーリサーチの代わりに AI のフィードバックを使わないでください。
レビューなしの最終デザイン: ユーザーに届く AI 生成デザインはすべて、人間がレビューし、磨き込み、責任を持つ必要があります。
機密性が高い、または重要度の高い意思決定: セキュリティ、プライバシー、アクセシビリティには、人間による慎重な監督が必要です。
Pajamas を省略すること: AI 生成のデザインパターンとコンポーネントが Pajamasに準拠していることを必ず確認してください。
確認なしのプロダクション出力: AI 生成コンテンツを人間のレビューなしで出荷しないでください。
手作業の方が速いタスク: プロンプトに 30 分費やしているなら、自分でやった方が速いかもしれません。

AI をうまく使う

良いプロンプトを書く

すべてのプロンプトに豊富な文脈を含めてください:

含めるもの	例
役割と対象者	“あなたは DevSecOps プラットフォームの UX デザイナーです。ユーザーは CI/CD パイプラインを管理するシニアエンジニアです。”
具体的なタスク	“マージリクエストのパイプライン中にセキュリティスキャンが失敗した場合のエラーメッセージを 3 つ書いてください。”
制約	“GitLab の Pajamas デザインシステムに従ってください。Sentence case を使い、80 文字未満にしてください。”
例	“私たちが使用している既存のメッセージは X です。このトーンと形式に合わせてください。”
成功基準	“何が失敗したのか、それがなぜ重要なのか、ユーザーが次に何をできるのかを説明してください。”

最初からやり直すのではなく、会話を通じてイテレーションしてください。3〜10 個のバリエーションを依頼し、最も良い部分を組み合わせます。

ペルソナ、デザイン原則、スタイルガイドのような永続的な文脈を保存するには、Claude projectsを使ってください。

すべてをレビューする

AI の出力を共有する前に:

自分のものにする。共有前にレビュー、編集し、責任を持つ
すべての主張、数値、統計をファクトチェックする
バイアスがないか確認する。どのグループかが誤って表現される可能性がないかを問う
アクセシビリティの提案を WCAG guidelinesに照らして検証し、支援技術でテストする
実際のユーザーでデザインを検証する。AI の出力は発見事項ではなく仮説です
AI の関与を開示する。成果物のどの部分で AI の支援を使ったかを記載する（開示要件）