— Story / 開発背景
木下スタジオ(木下貴博 / 滋賀・琵琶湖)による開発背景と設計思想
— 01
Reactは速い。でもHTMLより速くはない。
ブラウザは最強のランタイムだ。Canvas API、IndexedDB、Web Audio API、PointerEvents——これだけのAPIが標準で使える。フレームワークが何かをしてくれると思っていたが、実はブラウザがすでにやってくれていた。
「依存はいつか裏切る。だからゼロにした。」
npmのエコシステムは素晴らしい。でも、今日使っているパッケージが3年後もメンテされているかはわからない。BMBoardが依存しているのはブラウザAPIだけだ。W3Cが標準化した仕様——10年後も動く。
— 02
HTMLファイルひとつ。そこに全部入っている。
描画エンジン
Canvas 2D API
コーナー検出付きquad-midpoint smoothing
保存
IndexedDB
オフライン自動保存
Terminal Magic
$sakura / $scatter / $make-img
ClaudeでJSON生成→貼るだけ拡張
書き出し
PNG / SVG / PPTX / GIF
全てクライアントサイドで完結
— 03
テキストボックスに $sakura と打つと、キャンバスに桜が降り始める。$scatter で選択中のオブジェクトが爆発する。$make-img biwako 4 で琵琶湖の写真が4枚飛んでくる。
spellは1行のJSONだ。ClaudeやChatGPTに「こういう動きをするspellを作って」と依頼すると生成してくれる。それをターミナルに貼るだけで登録される。Enterも不要。
「コマンドラインとキャンバスが合体した感じ。デザイナーが呪文を唱えるイメージで作った。」
自分のツールをAIで育てていく体験——これがTerminal Magicの本質だ。
— 04
機能を削ることは、追加することより10倍難しい。「これも必要かも」という誘惑に負け続けると、いつの間にかファイルサイズが膨らむ。499KBというサイズは、削った結果だ。
制約は敵じゃない。「1ファイルで全部入れる」という制約が、依存を持ち込まない習慣、ランタイムコストへの敏感さ、APIの理解の深さ——これらを全部鍛えてくれた。
琵琶湖のそばで、このツールを毎日使いながら作り続けた。
— Studio
Black Mirror Board(BMBoard)は、木下スタジオ(木下貴博 / 滋賀・琵琶湖)による個人開発プロダクトです。UX/UIデザイン・アートディレクション・個人開発を一人で担う体験翻訳家・木下貴博が、「届けたい体験と届いている体験のズレを揃える」という思想のもとに開発しました。
木下スタジオ(kinoshita.studio)→