← デモ一覧

Ken Creations / DEMO 02 — 活字

01句点は、扉。

アイデアが、動き出すまで。

活字は、“活きている字”と書きます。
このページの字と線は、スクロールにあわせて動きます。

最初は、問いの断片から。

まだ言葉になっていない構想でも構いません。話しながら、目的と前提をそろえていきます。

  • 誰のための事業?
  • なぜ、いまなのか。
  • いまの業務は、どう回っている?
  • 何が、いちばん困っている?
  • 成功している状態は?
  • 手作業のままでいいところは?
  • 例外は、どこにある?
  • 今は、作らないもの。
  • システムで解くこと/運用で解くこと

並べて、整える。

現行業務やユーザーの行動を伺い、業務フローとして可視化します。課題を分解し、システムで解くべきこと・運用で解くべきこと・今は手を付けないことを分けます。

構想から運用まで、一本の線で。

すべてを任せていただく必要はありません。
必要なフェーズだけでも支援します。

PHASE 01 / 07fig.4-1

誰の、どんな課題?

なぜ、いま?

うまくいった状態は?

企画・構想

アイデアと目的を具体化する

PHASE 02 / 07fig.4-2

課題・業務整理

今の業務と課題をほどく

PHASE 03 / 07fig.4-3

ユーザー体験 / 要件整理

誰が何をするかを決める

PHASE 04 / 07fig.4-4
  • 予約一覧
  • 顧客をさがす
  • 在庫の確認
  • 月次レポート
  • 権限の設定
  • CSV で書き出す

プロトタイプ

触れる画面で確かめる

PHASE 05 / 07fig.4-5
  • 最小の画面で試す
  • 使われ方を記録する
  • 続ける・直す・やめるを決める

PoC / MVP

小さく作って検証する

PHASE 06 / 07fig.4-6

本開発

使い続けられる形にする

PHASE 07 / 07fig.4-7
中央値
— ms
95%
— ms

このページの実測フレーム時間
(あなたの環境・リアルタイム)

運用・改善

数字を見て育てる

01企画・業務整理
02プロトタイプ・MVP
03プロダクト・システム開発
04運用・改善

組み上げる。

検証を経て残ったものを、
運用に耐えるプロダクトとして設計・開発します。

Nuxt · Vue · TypeScript · Laravel · AWS · Cloudflare

止まると、形に戻る。

作って、終わらない。

  1. 01事業背景を理解する
  2. 02課題・業務を整理する
  3. 03仮説をプロトタイプにする
  4. 04検証する
  5. 05プロダクトとして作る
  6. 06利用状況を見て改善する

次の構想が生まれたら、また 01 に戻ります。

  1. 01 事業背景を理解する — 何のための事業・業務なのかを伺います。
  2. 02 課題・業務を整理する — 今の業務を図にして、課題をほどきます。
  3. 03 仮説をプロトタイプにする — 整理した内容を、触れる画面にします。
  4. 04 検証する — 社内・顧客・使う人の反応を確かめます。
  5. 05 プロダクトとして作る — 検証で残ったものを、本番の形にします。
  6. 06 利用状況を見て改善する — 数字と声を見ながら、手を入れ続けます。

このページも、
同じ手順で作りました。

  1. 企画・構想
  2. 課題・業務整理
  3. ユーザー体験 / 要件整理
  4. プロトタイプ
  5. PoC / MVP
  6. 本開発
  7. 運用・改善
タイトル
活字 — アイデアが、動き出すまで。
制作
Ken Creations(早野 賢冴)
構成
Nuxt 3 · Vue 3 · TypeScript · GSAP(ScrollTrigger)· Lenis · three.js
書体
Shippori Mincho B1 · Noto Sans JP · Roboto Flex · JetBrains Mono(SIL Open Font License 1.1)
ライセンス
three.js MIT · Lenis MIT · webgl-noise MIT · GSAP Standard “No Charge” License
あなたの環境での実測
—(この端末での実測値。保存も送信もしていません)