開発ログDev log

v0.1 のプロトタイプから今日まで。何を作ったかと、そこで踏んだ問題の記録。 From the v0.1 prototype to today — what got built, and what broke on the way.

18 entries · 2026-04-08 → 2026-07-27

v1.4+ · 順送りv1.4+ · Cycling 2026-07-27

1キーで順送り・モバイルの ⌘K・ドキュメントの自動生成Cycle with one key, ⌘K on mobile, generated docs

順送りを追加＝board next / grade / theme / drawmode / crumb next。ショートカットは1コマンドにしか付かないため。⚠️「選ぶもの」（align / export / gif / rec）には付けていない。Added cycling: board next / grade / theme / drawmode / crumb next, because a shortcut can only point at one command. ⚠️Not added to things you pick (align / export / gif / rec).
モバイルの上部バーに ⌘K ボタンを追加。スマホにはキーボードが無いので、全機能の入口が押せない状態だった。Added a ⌘K button to the mobile top bar. Phones have no keyboard, so the entrance to every feature was unpressable.
引数が必須のコマンドにキーを割り当てると「押しても入力待ちになるだけ」なので、設定の一覧で赤く伝えるようにした。Binding a key to a command that requires an argument only opens the palette and waits — the settings list now says so in red.
usage / commands / story を app.html から自動生成する方式に変更。手書きの一覧は必ず本体から遅れる（usage は2ヶ月、commands は2ヶ月半止まっていた）。CI でズレを検出する。usage / commands / story are now generated from app.html. A hand-written list always falls behind (usage was two months stale, commands two and a half). CI fails when the output drifts.
サイトの上部に全ページのナビを追加。孤立していた頁への導線を作った。Added a site-wide nav at the top — pages that nothing linked to are reachable again.

v1.4+ · サイトv1.4+ · Site 2026-07-26

サイトを作り直す — コンセプトとキービジュアルRebuilding the site — concept and key visual

コンセプトを1行に：手で書く。キーで動かす。／Write by hand. Move at speed.The concept became one line: Write by hand. Move at speed.
見出しを8〜12字に圧縮し、絵文字をゼロに。モバイルは 8.1画面 → 5.8画面に。Headings were cut to 8–12 characters and every emoji removed. Mobile went from 8.1 screens to 5.8.
重かった原因を特定してそれだけ消した（blur(90px)の巨大な円3つ＋全面 grain の mix-blend-mode）。42fps → 61fps。The slowness was traced and only that was removed (three blur(90px) circles plus a full-screen mix-blend-mode grain). 42fps → 61fps.
キービジュアルは木下作。⚠️透過PNGの縁に元の背景が焼き込まれる問題は、背景と立体を合成した1枚で根治した。The key visual is Kinoshita’s own. ⚠️The purple fringe baked into the transparent PNG was cured by compositing background and solid into one image.
外部フォントをやめてシステムフォントに戻した（前の方が Apple っぽい、という判断）。Web fonts were dropped for system fonts — the earlier version simply felt more like Apple.

v1.4+ · 入口の掃除v1.4+ · Reachability 2026-07-25

「完成しているのに入口が死んでいる」を一掃Clearing out "finished, but unreachable"

この日の不具合の大半が同じ型だった＝機能は完成しているのに、誰も押せない場所にあった。Most of the day’s bugs were the same shape: the feature was finished, but nobody could reach it.
Aa（フォント/太字/縦書き）が UI から到達不能（display:none を戻す処理が git 履歴上一度も無かった）。The text-style panel (font / bold / vertical writing) was unreachable — the display:none that hid it was never removed in the whole git history.
ポップオーバーが紙／ライトで白地に白文字。3モード×6ポップでコントラストを実測して固定。Popovers rendered white-on-white in paper and light themes. Contrast was measured across 3 modes × 6 popovers and fixed.
引数を取るコマンド21件の大半が ⌘K から実行できなかった（↵で引数待ちに戻るだけ）。サブコマンドを1行ずつ展開して解決。Most of the 21 argument-taking commands could not be run from ⌘K (Enter just returned to waiting for input). Expanding subcommands as their own rows fixed it.
設定をキーボードだけで操作できるように（↑↓で行移動・←→で即適用）。Settings became fully keyboard-operable (↑↓ to move, ←→ to apply).

v1.4 · 公開v1.4 · Ship 2026-07-24 — ship date

本番マージ — 98 commitMerged to production — 98 commits

main に早送りマージして bmboard.studio を更新。app.html は 11,426行/528KB → 15,924行/848KB。Fast-forward merged to main. app.html went from 11,426 lines / 528KB to 15,924 lines / 848KB.
戻り先タグを先に切ってから公開（prod-before-merge / v1.4-paper）＝いつでも1コマンドで戻せる状態にした。Rollback tags were cut before shipping (prod-before-merge / v1.4-paper) — one command returns to the old build.
ヘッドレスで全コマンド・プリセット・STORE・API を通し、エラーゼロを確認してから出した。Every command, preset, STORE flow and API was run headless with zero errors before release.

v1.4 · 魔法と STOREv1.4 · Spells & STORE 2026-07-24

自分の道具を作って、配れるようにするMake your own tools, and hand them to someone

選択を spell 名前 で保存＝宣言的なボードデータ（任意JS無し）。⌘K に🔮として並ぶ。Save a selection as a spell with spell name — declarative board data, no arbitrary JS. It appears in ⌘K.
コードで書く魔法（JS）も登録できる。安全は2階層＝ops型は白リストで完全安全／JS型は「コード実行」を明示して審査でキュレート。Spells written in code are supported too. Safety has two tiers: ops-type is a strict whitelist; JS-type is labeled "runs code" and curated by review.
STORE＝store/catalog.json を読むだけの静的な一覧。サーバー無し・費用0。The STORE is just store/catalog.json read over HTTP. No server, no cost.
提出 → GitHub Actions で自動一次審査（禁止API・BM API の実在チェック・ops白リスト・名前重複・構文）→ アプリ内の申請ボックスに届く。Submissions get an automatic first pass in GitHub Actions (banned APIs, whether each BM API actually exists, ops whitelist, name collisions, syntax), then land in an inbox inside the app.
スニペット・連鎖（既存コマンドを順に実行する自作マクロ）も追加。Snippets and chains (macros that run existing commands in order) were added as well.

v1.4 · ⌘Kv1.4 · ⌘K 2026-07-23 → 2026-07-24

ターミナルからコマンドパレットへFrom a terminal to a command palette

覚えるのは ⌘K ひとつに。打つと候補が出るランチャー型に作り替え、お気に入り／最近使った／自分でショートカットを割り当てを追加。One thing to remember: ⌘K. Rebuilt as a launcher that filters as you type, with favorites, recents, and your own key bindings.
設定パネルをタブ化（一般 / コマンド / 魔法）。全コマンドに好きなキーを割り当てられる一覧と、衝突の赤警告。Settings became tabbed (General / Commands / Spells), with a full command list you can bind keys in, and a red warning on collisions.
⌥キーは macOS で e.key が化ける（⌥B → ∫）ため、e.code（物理キー）基準に変更。On macOS, Option mangles e.key (⌥B → ∫), so binding now reads e.code — the physical key.
EN / JP 切替をパレット・設定・盤面ツールチップまで通した。EN / JP switching now reaches the palette, settings and the on-board tooltips.
サブコマンド（panel dock / board a4 …）を一覧に展開＝⌘K からしか触れなかったものに割り当て可能に。Subcommands (panel dock / board a4 …) were expanded into the list — previously they were only reachable from ⌘K and could not be bound.

v1.4 · 紙と鉛筆v1.4 · Paper & pencil 2026-07-22 → 2026-07-23

書きなぐれる黒板 — 黒鉛の粒・消しカス・紙の目A blackboard you can scribble on — graphite grains, crumbs, paper tooth

描き味を 黒鉛の粒を arc-length で連打する方式に転換。1本の太い帯＋ノイズは炭やマーカーであって鉛筆ではない、という判断。The stroke became graphite grains stamped along arc-length. One thick band with noise reads as charcoal or marker — not pencil.
紙の目（tooth）＝キャンバス座標に固定した決定論ノイズ。粒ごとに乱数を振るとスプレーになる。Paper tooth is deterministic noise pinned to canvas coordinates. Randomizing per grain turns it into spray.
grain は線を描いてから destination-out で紙の目を削り取る（線側をざらつかせるのは間違い）。Grain is made by drawing the line first, then carving the tooth out with destination-out — roughening the stroke itself is wrong.
消しゴムが消しカスを出す。払わないと残る（sweep）。芯の濃さ 2H〜6B で出る量が変わる。The eraser leaves crumbs, and they stay until you sweep them. How many depends on the pencil grade (2H–6B).
紙をひっくり返す（flip）＝canvas 側で X 反転し、入力・pan・zoom も同じ反転に統一。裏面から表の線は選べない。裏写りは2パスの紙色ウォッシュ。Flip the sheet — the canvas mirrors on X, and input, pan and zoom mirror with it. Front strokes cannot be selected from the back; the bleed-through is a two-pass paper-color wash.

v1.3 · 音声入力v1.3 · VOICE INPUT 2026-06-15

音声入力 — マイクボタンでターミナルにコマンドを発話Voice input — speak a command into the terminal

マイクボタン — ターミナル入力行右端に SVG マイクアイコンを追加。Web Speech API (SpeechRecognition / webkitSpeechRecognition) 非対応ブラウザでは display:none のまま自動非表示。Mic button — an SVG mic icon at the right end of the terminal input. Hidden automatically where the Web Speech API is unavailable.
音声→コマンド実行 — クリックで認識開始、発話終了後にトランスクリプトを #ti に挿入し自動 runCommand()。再クリックでキャンセル（cancelled フラグ）。Speech → command — click to listen; the transcript is inserted and run automatically. Click again to cancel.
listening アニメ — 認識中は .listening クラスを付与、0.7s のパルス (opacity 1 → 0.25) でフィードバック。Listening feedback — a 0.7s pulse while recognition is active.
エラー処理 — no-speech / aborted はサイレント。それ以外は mic: <error> をターミナルに赤ログ。Errors — no-speech and aborted stay silent; anything else is logged in red.
動作確認 — Playwright headless Chromium でボタン表示・listening クラス付け外し・キャンセルフロー検証済み。Mac 実機での動作確認は pending。Verified headless — button visibility, the listening class and the cancel flow. Real-device check still pending.

v1.2+ · ドメインと入口v1.2+ · DOMAIN + ICONS + DOCS 2026-05-01

独自ドメイン・アイコン一式・OGP・入口の書き直しCustom domain · favicon set · OGP png · onboarding rewrite

独自ドメイン — bmboard.studio を取得。DNSはレジストリ側のネームサーバーが古いままで一度ハマった。HTTPS強制で https://bmboard.studio/ が本番に。Custom domain — bmboard.studio acquired via お名前.com, registry NS pointed at 01-04.dnsv.jp after a detour where records were saved on dnsv.jp but the registry was still dns1/dns2.onamae.com. Live at https://bmboard.studio/ with Enforce HTTPS on. Old blackmirrorboard.github.io/bmboard/ still resolves but all OGP / canonical URLs migrated.
アイコン一式 — 丸いにこちゃんをタブの顔にした。1024²から favicon.ico / 16 / 32 / apple-touch / 192 / 512 を生成し、manifest.json も追加。Favicon set from logo.png — the round black smiley logo became the brand mark in the tab. Generated favicon.ico (16/32/48), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180), icon-192.png, icon-512.png from a 1024² source. Added manifest.json for PWA / iOS home-screen.
OGP画像を差し替え — 黒地に白抜きのにこちゃん＋タイトル＋バージョン。6つのHTML全部を新しいものに。OGP og-image.png (1200×630) — black ground, white inverted smiley left, BMBOARD title + tagline + version strip on the right. Replaces the old og-image.svg across all 6 HTML files. Twitter Card validator now picks up the new card.
タイトルの重複を解消 — <title> 先頭の絵文字を全部落とした。ファビコン（にこちゃん）がブランドなので、並ぶと同じ記号が2つ見える。Title de-duplication — every <title> dropped its leading ⬛ / ◼ emoji glyph; the favicon (smiley) is the brand now and two glyphs side-by-side in the tab read as a duplicate logo. The applyTabBrand() dynamic favicon SVG-swap logic was retired with the static smiley taking over.
URLの整理 — /app.html から拡張子なしの /app へ。旧URLもそのまま開くのでブックマークは生き残る。URL cleanup — /app over /app.html — internal hrefs and OGP og:url migrated to the cleaner extensionless form. /app.html still serves the same content (GitHub Pages auto-resolution), so all existing bookmarks survive. index.html's splash-transition endsWith intercept widened to recognize both forms.
安全性の強化 — 取り込んだログの innerHTML を <span class="t-*"> だけ許すように制限（細工したJSONでXSSが通る状態だった）。カメラは離脱時に解放。保存の失敗も握り潰さない。Security / reliability hardening — terminal log innerHTML on import is now sanitized to allow only <span class="t-*"> elements (was XSS-able via crafted JSON). Camera MediaStream tracks are now released on beforeunload + pagehide. Share-URL decode failures surface in the terminal with a hash strip so reload doesn't loop. saveCmds() IndexedDB / localStorage write errors no longer get swallowed.
リポジトリ整備 — projects/black_mirror/ を blackmirrorboard/bmboard に接続し、Webアップロード運用から GitHub Desktop に移した。Repo wiring — local projects/black_mirror/ connected to github.com/blackmirrorboard/bmboard via git init + git remote add + git fetch + git reset origin/main (working tree preserved). GitHub Desktop now manages BMBoard alongside Atelier, replacing the previous web-UI-upload workflow. kinoshitastudio added as collaborator on blackmirrorboard/bmboard for push access.
入口の書き直し — commands.html の頭に「◯◯したい → これを打つ」の早見表と、最初の魔法を書くまでの5手を置いた。作者自身が久しぶりに開いて迷ったのが理由。Onboarding rewrite — commands.html — added a Quick Start categorized "I want to → type X" lookup grid at the top (Draw / Edit / Terminal / Save-Share / Spell / Easter eggs), plus a Write Your First Spell section with a 5-step walkthrough (try preset → register your own → BM API cheat sheet → share → ask AI to write one). The studio's own author had reopened BMBoard after a break and needed a "what can I do here?" reorientation; this is the cure.
導線 — トップのナビからコマンド一覧へ直接。フッターからも2クリックで魔法の書き方に届くように。Cross-linking — index.html nav now points to commands.html directly; the footer adds deep links to #quickstart and #first-spell so the spell-authoring path is reachable in two clicks from the landing.
マニュアルの表記統一 — 日英22ファイルの「99letters studio」を「kinoshita studio」に。Manual rebrand — every "99letters studio" reference in the EN + JA v1.2 manuals (22 files) corrected to "kinoshita studio".

v1.2+ · 公開後v1.2+ · POST-RELEASE EVOLUTION 2026-04-20 → 2026-04-22 (ongoing)

ドメイン移行・機能一覧・レスポンシブ・OGPBrand routing · capabilities grid · responsive chrome · OGP

URL移行 — 99letters.github.io/projects/black_mirror/ から bmboard.studio/ へ。相対リンクは絶対URLに直して、新しい場所からでも開発ログに届くようにした。URL migration — moved from 99letters.github.io/projects/black_mirror/ to the canonical bmboard.studio/. All ../../md.html / ../../history.html references absolutized to https://99letters.github.io/… so the new origin still reaches the dev log.
名前の統一 — 「99letters studio」→「kinoshita studio」をマニュアル22ファイル・README・app.html まで全部直した。99letters は GitHub のIDとしてだけ残す。Rebrand — studio name corrected everywhere: "99letters studio" → "kinoshita studio" across 22 manual files, README.md, usage docs, app.html footer, terminal ghost lines (Playing: kinoshita studio / Black Mirror Board), and INDEX frontmatter tags. The 99letters domain remains as the GitHub identity only.
ASCIIアートの表示崩れ — █ がフォントによってセルより低く描かれ、縦に隙間が空いていた。等幅フォントを指定し、行間と字間を固定して直した。ASCII-art render fix — the BM pixel logo in README/overview collapsed because Courier New / SF Mono render █ (U+2588) shorter than the cell, leaving vertical gaps. Loaded JetBrains Mono via Google Fonts and force-applied font-size: 14px; line-height: 1; letter-spacing: 0; word-spacing: 0 to the logo <pre> with !important.
index.html に機能一覧 — 16:9 の作例SVG付きのカードを6枚追加（SVG書き出し／透過PNG／画像ブレスト／自作の魔法／共有／カメラ）。index.html — CAPABILITIES section — six new feature cards ship below the Dual Perspective section, each with a 16:9 demo-frame SVG illustration: SVG Export / Transparent PNG / Image Brainstorm / Custom Spells / SNS Share / Camera + YouTube Live. Monochrome 1-bit aesthetic preserved.
index.html にライト/ダーク — 全色をCSS変数に通し、初回は prefers-color-scheme を尊重、選択は保存。描画前に適用して一瞬の色化けを防ぐ。index.html — light / dark theme — a 1-bit inversion toggle (● · ○) next to the EN/JA switch. All colors run through CSS variables (--ink / --void / --scan-color / --glow-halo / --checker-fill / --header-bg); hard-coded whites and blacks were removed. prefers-color-scheme is honored on first visit; choice persists via bmboard.theme in localStorage. An inline head script applies the saved theme before paint to defeat flash-of-wrong-theme. Dark-ink logo.png is inverted via CSS filter: invert(1) in dark mode only, left as-is in light mode.
app.html のテーマ拡張 — dark / gray がヘッダーの色まで変えるようにした。色は既存のトークンから読む。app.html — theme extension — dark and gray commands now also theme the header (background, border, .hbtn, .hlink, .zoom-label, .logo*). All colors read from the existing --bm-tb-* / --bm-fg / --bm-fg-dim tokens. Logo PNG inverted only in dark mode.
app.html のモバイルヘッダー — ロゴを左に固定し、狭い画面では使わないボタンを隠して、アイコンとラベルを縦積みに。app.html — mobile header — logo pinned to the left, right-side chrome optimized for narrow viewports: FLUSH + CLEAR hidden (still reachable via terminal), icon+label stacked vertically inside each .hbtn (36px square), OVERVIEW split across two lines as OVER / VIEW with the arrow removed. All buttons' icons centered in their box via inline-flex; justify-content: center.
ヘッダーのレイアウト — margin-left:auto をやめて2カラムのグリッドに。どの画面幅でも崩れない。app.html — header grid — replaced the old margin-left: auto trick with an explicit 2-column grid (grid-template-columns: auto 1fr), logo in column 1, right buttons in column 2 with justify-self: end. Predictable on every viewport.
OGP画像 — 1200×630 を作成。黒地・走査線・ロゴ・タイトル・バージョン表記。OGP image — og-image.svg (1200×630) authored for both index.html and app.html: black ground with scanline texture, corner brackets, top-right ● REC ON AIR, 400-px logo (base64-embedded, SVG feColorMatrix inverted to white), title stack BLACK MIRROR / BOARD, subtitle DRAW · SPEAK · CAST, version strip.
Overview の README タブ — 等幅指定と合字オフで、ピクセルロゴがどのブラウザでも崩れないようにした。Overview README tab — BM pixel ASCII now renders crisply in Courier-deprived browsers via the JetBrains Mono fix + font-feature-settings: "liga" 0, "calt" 0.

v1.2 · 魔法書v1.2 · SPELLBOOK RELEASE 2026-04-19 — ship date

SVG書き出し・カメラ・共有URL・自作の魔法SVG export · camera wipe · share URL · custom spells

SVG書き出し — ターミナルで svg。選択（無ければ全体）をそのままベクターで書き出す。円→ellipse、四角→rect、三角→polygon、線→path と、全てのプリミティブが対応する。Figma / Illustrator でそのまま編集できる。SVG export — typing svg in the terminal writes a native SVG of the current selection (or the whole canvas). Every primitive translates: circle→<ellipse>, square→<rect>, triangle→<polygon>, arrow→<line>+<polygon>, text→<text dominant-baseline="hanging">, pen stroke→<path M…Q…>, image→<image>. Rotation wraps as <g transform="rotate()">. Colors resolved via resolveFill(). Opens in Figma / Illustrator / Inkscape editable.
カメラ — Black Mirror と打つとカメラが入り、右上に小窓が出る。ドラッグで好きな位置へ。Black Mirror off でトラックも解放する。Black Mirror camera wipe — the phrase Black Mirror flips on getUserMedia and docks a 220×165 PIP in the top-right (128×170 on mobile). Red REC dot, ◼ BLACK MIRROR label in mix-blend-mode: difference, selfie-mirrored with a faint grayscale + contrast filter for the CRT look. Hover exposes an × close; Black Mirror off also releases all tracks. The wipe is draggable — place it anywhere on screen.
共有URL — share でキャンバスとログを CompressionStream で圧縮してURLに載せる。開けばどの端末でも同じ板が復元される。Share URL — share with no args gzips the canvas + terminal state via native CompressionStream, base64-urls it, and copies a self-contained link. Opening the URL on any device restores the full board. share vs share url selects between file download and clipboard.
自作の魔法 — JSONをターミナルに貼るとスキーマ検査を通り、IndexedDB に登録されて名前付きコマンドになる。機能が文字列として持ち運べる。Custom spells — pasting a JSON payload into the terminal runs a schema check, binds it to IndexedDB, and exposes it as a named command. Features travel as text, one line at a time. BM API + natural language prompts to Claude / ChatGPT produce runnable spells.
内蔵の魔法 — scatter / grid-3x3 / biwako-blue / monoclo / svg などを同じJSON形式で同梱。書き出して作り替えて配れる。Preset library — scatter, grid-3x3, biwako-blue, fetch-img, monoclo, svg ship with the app, each as JSON-portable spells that can be dumped, remixed, and re-shared.
画像でブレスト — fetch-img <キーワード> で公開画像を集め、回転と余白を付けて撒く。板が勝手にムードボードになる。Image brainstorm — fetch-img <keyword> pulls public images for the word, scatters them on the canvas with rotation + margin, turning the board into a self-writing mood-board.
Del / Backspace の修正 — テキスト編集中でないのに入力欄がキーを飲んでいた。選択を正しく消せるようにし、テキスト編集中の例外だけ残した。Del / Backspace fix — the delete key was swallowed by inputs outside text-edit mode; now correctly removes the selection, with the text-edit exception restored.
フィードバック — ロゴを押すと、件名にバージョンが入った状態のフォームが開く。FEEDBACK modal — tap the logo → prefilled feedback form with subject auto-stamped per version; studio email + Instagram + X links consolidated.
マニュアル — v1.2 のマニュアルを日英で書き、v1.2_manual_ja/ と v1.2_manual_en/ に出した。Manual split — v1.2 manual authored in Obsidian (JP + EN), exported as markdown files under v1.2_manual_ja/ and v1.2_manual_en/.

v1.1 · 手触りの調整v1.1 · INTERIM POLISH 2026-04-17 → 2026-04-18

修飾キーの信頼性・カーソルの言語・逃げ道Modifier reliability · Cursor language · Escape routes

修飾キーの経路 — Shift / Alt を window 側の S.modifiers から読む。ドラッグ途中で押しても即反映され、ウィンドウが blur したら台帳をリセットして「タブを戻すと Shift が押しっぱなし」を潰した。Modifier pipeline — Shift / Alt read from a window-level S.modifiers ledger so holding a key mid-drag updates geometry instantly; window blur resets the ledger to defeat the classic "stuck Shift after tab-swap" bug.
方向を示すカーソル — 角・辺・回転の各ハンドルが、その方向に合ったOSカーソルを出す。Directional cursors — corner / edge / rotate handles expose OS cursors matching their drag axis; dashed directional glyphs on hover.
逃げ道 — Esc でドラッグ・範囲選択・回転・拡縮・テキスト編集のどれからも中立に戻れる。Escape routes — Esc abandons any in-flight gesture (drag, marquee, rotate, resize, text edit) back to neutral; double-click exits text mode cleanly.
テキスト編集の作法 — フォーカスを外すか Enter で確定、Esc で取り消し。外をクリックしてもオブジェクトは消えない。Text editing rigour — commit on blur or Enter, cancel on Esc; click outside drops focus without losing the object.

v1.0 · 公開v1.0 · STUDIO RELEASE 2026-04-16 — ship date

グレーモード・当たり判定2.0・Shift固定リサイズGray mode · Hit-test 2.0 · Shift-lock resize

グレーモード — 地 #DCDBD5／インク #1600A2。light/dark と並ぶ独立テーマとして gray で切替。Gray mode — pebble ground #DCDBD5 / cobalt ink #1600A2. Dedicated CSS-variable theme alongside light/dark, triggered by gray command.
当たり判定2.0 — 線はセグメントとの距離で判定。見た目より8px広く取り、ホバー時に光らせて方向カーソルを出す。Hit-test 2.0 — segment-distance hit testing on strokes; 8px invisible padding; hover glow + directional cursors.
Shift固定リサイズ — 角のハンドルで比率を保つ。Alt で中心固定。画像は既定で比率固定。Shift-lock resize — aspect-ratio preserved on corner handles; Alt anchors to center; images lock by default.
スナップ — Shiftリサイズ中、×0.5 / ×1 / ×1.5 / ×2 に磁石で吸い付く。Snap scale — ×0.5 / ×1 / ×1.5 / ×2 magnet windows during Shift-resize.
テーマ連動の選択表示 — 選択枠と範囲選択が、各モードで一番見える色に自動反転する。Theme-aware selection — selection box and marquee auto-invert for max contrast in each mode.

v0.9 · 暗転v0.9 · VOID THEME 2026-04-14

ダークモードと塗りのテーマ化Dark mode + fill-swatch theming

ターミナルの dark mode / light mode でグリッチ風に切り替わる。Terminal command dark mode / light mode engages a glitch-flash mode transition.
モード切替で全オブジェクトの塗りが反転する（resolveFill() のチャンネル反転）。All object fills invert on mode switch (resolveFill() channel inversion).
スウォッチSVGをクラス＋CSS変数にして、ツールバーも同時に反転するようにした。Swatch SVGs refactored to class-based CSS variables so the toolbar flips in lockstep.
真っ黒の上でツールバーが沈むので、影を足して浮かせた。Toolbar elevated off pure-black canvas with a subtle shadow for contrast.

v0.7 · 書き出しv0.7 · EXPORT 2026-04-13

JSON保存と透過PNG書き出しJSON persistence + transparent PNG

キャンバスとターミナルのログを丸ごと1つの JSON に書き出す。Export entire project (canvas + terminal log) as a single JSON blob.
PNGはオフスクリーンキャンバスで——余白を詰めた透過画像。PNG export on offscreen canvas — tight bbox + transparent background.
選択中があればそれだけを書き出す。Selection-aware export: exports only selected objects when present.
高解像度で書き出す時のメモリ暴走を防ぐため DPR は3倍で頭打ち。3× DPR cap to prevent memory spikes on high-resolution exports.

v0.5 · ベクター編集v0.5 · VECTOR EDIT 2026-04-12

Illustrator 風のアンカー編集Illustrator-style anchor system

ペンの線と三角形は頂点ごとにアンカーを掴める。Per-vertex anchor handles on pen strokes & triangles.
四角・画像・テキストは8ハンドルで拡縮。8-handle bbox resize on squares / images / text.
円は上下左右のハンドルで半径を変える。Cardinal handles on circles (single-radius edits).
フリーハンドは RDP で単純化してから、編集できる数のアンカーにする。RDP simplification on freehand strokes → editable anchor count.

v0.3 · 操作v0.3 · INTERACTION 2026-04-10

選択・ドラッグ・回転・ズームSelection, drag, rotation, zoom

マウス／タッチ／ペンを Pointer Event 1本に統一。Unified Pointer Event handling for mouse / touch / pen.
スペースキーでパン＋ピンチズーム（タブレットでも同じ操作に）。Space-key pan + pinch-zoom for tablet parity.
バウンディングボックスの上に回転ハンドル。Rotation handle above the bounding box.
範囲ドラッグで複数選択、まとめて移動・拡縮・回転。Multi-select via marquee drag; group move / resize / rotate.

v0.1 · 試作v0.1 · PROTOTYPE 2026-04-08 — initial commit

ターミナル＋キャンバスの骨格Terminal + canvas skeleton

左にキャンバス／右にターミナルの2分割。Split pane layout: canvas (left) + terminal (right).
基本図形——円・四角・三角・矢印・テキスト。Basic shapes — circle / square / triangle / arrow / text.
フリーハンドで線を取るペン。Pen tool with freehand stroke capture.
UIはASCIIのみ、色はグレースケールまで。ASCII-only UI chrome, no colors beyond greyscale.

今どうなっているかWhere it is now

記録より、動いているものの方が速い。ブラウザで開いて確かめてほしい。 The running thing is faster than the log. Open it and see.

ブラウザで開く →Open in browser → 使い方How to use つくった理由Story