コンテンツにスキップ
Dev Classmethod Jp Articles Wthatsux9

UXってなんだろう⑨〜きれいなUIは後で。まず鉛筆と紙で画面を描く〜

  • URL: https://dev.classmethod.jp/articles/wthatsux9/
  • 日付: 2026-06-05
  • Tier: Tier 3
  • 要旨: USM(ユーザーストーリーマッピング)の次フェーズであるUI設計で、Figmaより先にペーパープロトタイプを描く理由と実践方法を解説。AIがUIを即生成できる時代に手書きの価値を問い直す。

詳細

  • なぜ紙から始めるか: 構造の問題(ボタン位置・画面の流れ)を解決する前に見た目を作り込むと、やり直しコストが高くつく
  • 手順: 白紙 + 鉛筆で複数バリエーションを素早く描き、指でタップ動作を擬似再現して操作感を検証
  • コツ: 1枚で完成させようとしない。参考UIを模写してから差分をアレンジする
  • AI時代の位置づけ: Claude・V0などのUIジェネレータは「作ること」を速くするが、「それっぽく見える」ため思考が停止しやすい。手書きの過程で生まれる疑問・修正がUX設計の本質的な思考を促す
  • 実体験: 2人で大きな紙に手書きで画面構造を描いたセッションで構造ミスをその場で発見
  • 評価: AI生成UIの補完としてペーパープロトを位置づけるフレームワークが実践的