UXデザイン 05 Web 制作への応用ワークとチェックリスト
更新日:
作り始める前のワーク(30分でできる)
- 誰が使う?: 主な利用者と、その周りの人(家族・上司・受け取る人)を書き出す
- どんな気持ちになってほしい?: 一文で(例: 「迷わず予約できて安心した」)
- 最初の体験は?: 初めて来た人が最初の30秒で見るもの・できることを決める
- 説明を減らせる?: 説明文で補っている箇所を、触れば分かる形にできないか
- 楽しさ・らしさは?: ブランドのキーワード3〜5個 → 色・形・文言・動きに
- 画面の外は?: 通知・メール・共有・会話でどう使われるか
→ 結果を DESIGN.md や CLAUDE.md / AGENTS.md に書いて、AI への指示に含める
AI への指示例
このサービスの利用者は[誰]。周りには[誰]もいる。
使った人に「[感情]」と感じてほしい。
初めて来た人が最初に[何]をできるように、トップページの優先順位を決めて作って。
長い説明文は避け、触れば分かる UI にして。状態(読み込み中・完了・エラー・空の状態)を必ず用意して。UX チェックリスト
分かりやすさ(ストレスを減らす)
- 3秒で「何のページか・何ができるか」が分かる
- 次にやることが1つに絞られている(主要ボタンは1つ)
- 読み込み中・完了・エラー・空の状態がある
- エラー文は「何が起きて、どうすればいいか」を書いている
- 取り消し・戻るができる、危険な操作には確認
- スマホで片手でも操作できる
- グレースケールでも情報が読める、コントラスト比 OK
初めての体験
- 登録前に価値を体験できる(デモ・サンプル・プレビュー)
- 初回の空の状態で「最初の一歩」を案内している
- 最初の成功体験までの手数が少ない
楽しさ・らしさ
- ブランドのキーワードが見た目・文言に反映されている
- 完了時など、感情が動く小さな工夫がある(やりすぎない)
- 待ち時間・面倒な操作を少しでも楽しくできないか考えた
関係する人
- 利用者以外(受け取る人・管理者・家族)の体験も考えた
- 評価・ラベルを押し付けていない
- 画面の外(通知・メール・共有)まで設計した
検証
- 自分で「ユーザーになって」最初から最後まで使った
- 実際の利用者(または近い人)に触ってもらった
- 早い段階で方向性を共有した