ピクセルモード
さらに単一フレームのピクセル画モードもあります:縦横自由なキャンバス、引き上げた色数上限、そして専用の図案書き出し——アイロンビーズや編み図のために設計されています。
アニメーションは Tauri 専用ピクセル画は両方の版にあります。デバイスアニメーション(Clawdmeter に書き込むほう)は Tauri(有料版)専用で、無料版はピクセル画のみです。
編集モード
描画、プレビュー、フレーム、色、読み込みと書き出し。下のいずれかにマウスを乗せると、対応する領域が図の上で光ります。
色とフレームは最も頻繁に行き来する二つなので、隣り合わせに置いています。実機プレビューを左カラムに固定して畳まないのは、フレームを調整するあいだ、いつでも見たいからです。
4 つのツール、2 つのアクション、1 つのスイッチ
描く、消す、選ぶ、色を採る——といった基礎に加え、反転ツールで対になるもう半分を手早く複製できます。オニオンスキンは、前のコマとの動きの差を見えるようにします。
✏ペン既定
1 マスをクリック、または押しながらドラッグして、現在選択している色で塗ります。
▱消しゴム
マスを透明に戻します——つまり 0 番のインデックスです。透明はデバイス上では「点灯しない」であって、「黒く塗る」ではありません。
⬚選択
一塊を囲んで、移動・反転・別のフレームへコピーできます。
選択中は方向キーで1 マスずつ動かし、選択がないときの方向キーはフレームの切り替えになります——同じキーでも、手に何かを持っているかどうかで変わります。
◍スポイト
1 マスをクリックして、その色のインデックスを取り出します。空のマスをクリックすると透明を取ります。
⇋左右反転 / 上下反転
反転するのは選択範囲です。選択がないときは、キャンバス全体を反転します。
この二つはツールではなくアクションです——押すと一度だけ実行され、「選択中」の状態にとどまりません。
◨オニオンスキン既定でオン
前のコマを薄く現在のコマの下に敷き、前のコマの手がどこで止まったかを分かるようにします。最初のコマの下に敷かれるのは最後のコマです——アニメは循環しているので、最初のコマの「前のコマ」はもともと最後のコマだからです。
オニオンスキンを描くのはキャンバスだけです。実機プレビューはあえて描きません。そこで見せるのは、デバイスが実際に点灯する姿だからです。
フレームとミリ秒
右カラムの上半分がフレーム列です。各コマにはそれぞれの表示時間(ミリ秒)があります——アニメ全体でひとつの速度を共有するのではなく、コマごとに値を与えます。あるコマだけ半拍長く止めたければ、そのコマだけを変えます。
- + 現在のコマの後ろに空白のコマを挿入します。
- ⧉ 現在のコマの後ろに複製を挿入します——微調整型のアニメは、たいていこうして育っていきます。
- 🗑 現在のコマを削除します。残り 1 コマのときは無効:アニメにフレームがないわけにはいきません。
- ← / → 前のコマ/後ろのコマと位置を入れ替えます。端に達すると自動的に無効になります。
選択範囲がないときは、キーボードの ← → でそのままフレームを切り替えます——動きが読み取れるかを判断する一番速い方法です。行ったり来たり押して、動いて見えるか確かめます。
色:36 の枠、256 の候補
「このアニメの色」は、このアニメが実際に使っている色見本で、上限 36 色です。この数字はデザインの好みではなく、デバイスファームウェアのパレットサイズです——超えた分はあちらに置く場所がないので、エディターはここで止めます。
下の「色を選ぶ」は内蔵の 256 色パレットです。16 段階のグレーに、24 の色相 × 10 のバリエーション(濁 5・鮮 5、それぞれ 5 段階の明度)。明度はあえて両端を取りません——暗すぎる色は真っ黒の画面では見えず、純白はすでにグレースケール列にあるからです。
+追加
この色を「このアニメの色」に追加して選択します。すでに使っている色はクリックするとそのまま選択され、枠を重複して占有しません。
⇄置換
どちらの端からでも始められる2段階のモードです。カラーコード欄にすでに新しい色があるときは、まず「置換」を押してから、消したい色をクリック——キャンバスのマスでも色見本の列でも構いません。まだ何も選んでいないときは、先に古い色見本を選んでから「置換」を押し、パレット・グラデーション・カラーコードの直接入力のいずれかで新しい色を与えます。
画面全体でその色を使っているマスがまとめて変わります。枠が埋まったとき、または全体の色調を変えたいときに使います。途中でやめたくなったら Esc で取消。
0 番は透明で、色に置き換えることはできません。
⚠️ デバイスの画面は真っ黒です。編集中に白いインターフェース上でちょうど良く見える暗い色は、デバイスに載せると消えてしまいます——だからアニメ全体で、明るい側から色を選んでください。
対応するキャンバス仕様
デバイスアニメーションは今のところ 20×20/40×40/60×60 の 3 サイズ。オープンソースのデバイスファームウェアが対応するサイズに合わせています。ビーズや編み図のようにデバイスへ入らない用途は、もうひとつの文書種——ピクセル画を使い、マス数は自分で打ち込みます。
実機プレビューと 20 秒のアニメーション制限
同じアニメはデバイス上で二つの場所に現れるので、ここでは二つのプレビューサイズを同時に見せます:
- 全画面スプラッシュ——起動時や待機時に画面いっぱいを占めます。
- 隅のバッジ——画面左上に縮んだ小さなアイコンも、動かせます。40×40 のアニメはここでは 1 マスがわずか 2 px で、ディテールはすっかり潰れます。描いているときに見えるので、書き込んでから気づく必要はありません。
プレビューで見えるものが、そのままデバイスの結果です。
読み取り数値の見方
デバイスが各アニメをループする時間は 20 秒に固定されています。エディターは「1 コマのミリ秒 × コマ数」を、20 秒で何周できるかに換算し、切れてしまうかどうかを教えます。上の図は 2 コマ、1 コマ 125 ms、1 周 250 ms、20 秒でちょうど 80 周——なので、下の最初の状態を表示しています。
切れるかどうかは正しさではなく、取捨です。途中で切れても構わないアニメもあれば(たとえば雨のシーン)、切れたら台無しになるものもあります(たとえば半ばまで上がった花火)——だからエディターは事実だけを伝え、あなたの代わりに決めません。
ピクセル画:ビーズと編み図
ここまでの章はすべてデバイスアニメーションの話——ホワイトリストのサイズ、36 色、20 秒のスロット。どの制限もデバイスファームウェアの能力の写しです。けれどピクセルの格子には別の用途があります:アイロンビーズ、クロスステッチ、編み図が欲しいのは一枚の画像。デバイスには入らず、動く必要もなく、マス数は紙と材料が決めます。
だからピクセルモードには二つめの文書種があります:ピクセル画。ツールバーの「新規キャンバス」のプリセットから「フリーピクセル(マス数を自由に指定)」を選び、幅と高さを自分で打ち込みます。長方形でも構いません。エディター・色票・ツールはデバイスアニメーションと同じで、制限だけが入れ替わります——デバイスに入ることを約束していないからです。
同じエディターですが、ひと列ぶん足りません:フレーム列なし、オニオンスキンなし、実機プレビューなし、アニメーション名と分類もなし。一枚の文書には要らないもので、残しておくと「何か設定を忘れたのでは」と思わせるだけです。
- マス数は自由——一辺 1〜512 マス、長方形も可。50×80 の編み図なら 50×80 と打つだけ。
- 色上限は 255——36 ではありません。ビーズの色番号は多く、36 の席では足りない。パレットは内蔵の 256 色のまま。足りないときは下のグラデーションをクリックして自分の色を取り込みます。
- 下地は常に透明——背景色の行がありません。空のマスは空のまま、意味は「ここにはビーズを置かない/針を通さない」。
- キャンバス上で行と列を増減——方眼の右端と下端に + / −。描きながらマス数を変えられ、左上は動きません。増えたマスは空、削った列はその場で消え、⌘Z で戻ります。
- 行列ルーラー——方眼の上端と左端に行番号・列番号。カーソルを置いたマスの行と列が光るので、指で数えなくて済みます。
- ステータスの読み——「W × H マス · N 描画」が常に出ていて、一マス塗るたびに更新されます。
図案の書き出し:印刷して数えるための一枚
ビーズや編み物が本当に必要とするのは画面上の画像ではなく、印刷して数えられる図案です。だからピクセル画の保存ウィンドウには「図案」という形式がひとつ増えます(デバイスアニメーションにはありません——その出口は GIF と JSON)。押すと PNG が一枚:
| 色見本 | カラーコード | 数量 | % |
|---|
- グリッドと行列ルーラー——黒字。白い紙の上で読めます。
- マスの中に色番号——1 から始まり、実際に使った色だけに番号が付きます。数字の黒白はコントラストで自動選択、印刷して見えない番号は出ません。
- 空のマスは空白のまま——何も刷りません。
- 材料表——色見本・番号・カラーコード(hex)・マス数・割合。ビーズや糸を買うときはこの表を見ます。
- タイトル——保存時に打ったファイル名。空なら既定の
VAS_pixel。 - レイアウトは自動——A4 基準:横長なら横向きで図の下に情報、縦長なら縦向きで図の下に情報、正方形なら横向きで右に図・左に情報。
「N 描画」は実際に塗ったマス数で、紙の面積ではありません——用意すべき材料の総量です。
図案のほかに、ピクセル画は普通の画像としても保存できます:PNG/WebP/TIFF は拡大したマス目画像で空のマスは透明、JPG は白で埋めます。倍率は GIF と同じサイズ設定を使います。一枚の文書を GIF で保存すると、グリッド線のないピクセル画像になります——アニメーションではありません。
機械可読なファイルインターフェース:JSON
ピクセルアニメの保存する機械可読な形式は、画像ではなく JSON です。貼り付けで既存のアニメを読み込み、コピーでアニメ全体をクリップボードへ、保存でファイルに書き出します。読み込みも書き出しも手軽です。
◎アニメ名必須
デバイスは名前でアニメを探すので、名前は一意でなければならず、保存前に空だと止められます。
ただし書き出し=表示、ではありません。名前をさらにデバイスファームウェアのグループ一覧に追加して初めて、そのアニメがループに乗ります。グループ分けを忘れないでください。
▤カテゴリ
Idle/Work/Dance/Expressions。この 4 つの値はフォーマット定数で、4 言語のインターフェースでも英語の原文のまま表示されます——デバイス側が受け取るのが、まさにこの語だからです。
読み込んだファイルが一覧外のカテゴリを持ち込んだときは、エディターはそれをそのまま保持して書き出します。そのまま入って、そのまま出す——これがリストの潔癖より優先されます。
書き出した JSON は、オープンソースのデバイスのアニメ形式に流し込めます——たとえば ESP32 上で動く Clawdmeter などのデスクトップ小型デバイスです。VAS 側で JSON ソースをコピーし、あちら側で貼り付けて AI に処理させるだけで、変換ツールは要りません。
ピクセル画は同じ出入口を通りますが、文書種は別です
ピクセル画の貼り付け/コピー/保存はデバイスアニメーションと同じ三つのボタンで、書き出されるのも JSON です——ただしファイルの先頭に固有の文書種マーカーとバージョンを持っています。だからエディターは手元のファイルがどちらの種かを一目で判別し、推測しません。保存したファイルはマスも色もそのまま読み戻せます:途中でやめて別のことをして、戻ってきて続けられます。
二つの種が取り違えられることはありません:ピクセル画のファイルをデバイスアニメーションのキャンバスに貼る(あるいはその逆)と、エディターは「これは別の種のファイルです、対応するキャンバスを開いてください」と声に出します。黙って飲み込んで崩れた画像にはなりません——誤判定の症状は静かなので、形から推測せず明示のマーカーで判別しています。
そして「JSON はただのテキスト」はピクセル画にも成り立ちます——次の節の AI との協作は、ビーズ図や編み図にもそのまま使えます。
AI と一緒に描く
ここがピクセルモードと他の章の最も違うところです:その保存データは、対話できるテキストなのです。
フレームは二次元配列で、各値は色のインデックス、0 は透明です。この構造は人にも読め、AI にも読めます——だからアニメ全体を AI に貼り付けて、「まばたきするように 3 コマ足して」と言い、返ってきた JSON をエディターに貼り戻せます。
{ "name": "vas", "category": "Idle",
"palette": ["transparent", "#F4ECE0", "#C471F5", "#4A9EFF"],
"frames": [ { "hold": 125, "grid": [ [0,0,1,1,0,0], … ] }, … ] }
AI があなたの意図を完璧に描けるとは限りませんが、同じ言語を話すインターフェースを通じて、あなたの意図を見せることはできます。