tsugigami(継ぎ紙)
iPad + Apple Pencil で使う手書きノート。A4 縦の紙が下へ一続きに継がれていき、横幅が足りない箇所だけ紙を右へ継ぎ足せます。起動時の案内や勧誘は出ません。
使う: https://nishio.github.io/tsugigami/ を iPad の Safari で開き、共有メニューから「ホーム画面に追加」。以後はホーム画面のアイコンから起動します(オフラインでも動きます)。
道具と操作
| 操作 | やり方 |
|---|
| 書く | ペン(黒・赤・青・緑・橙、太さ 3 段階、太さは一定) |
| 塗る | マーカー(6 色、重なりは掛け合わせた色、文字の下に塗られる) |
| 消す | 消しゴム。触れた線を線ごと消す |
| 選ぶ | 投げ縄。囲んだ線を、枠の中を掴んで移動、四隅で拡大縮小、上の丸で回転。メニューからコピー・切り取り・複製・削除。選択中に色を押すと色が変わる |
| 貼る | 道具バーの貼り付けボタン(コピーした後に出る)。別のノートにも貼れる |
| スクロール / ズーム | 指 1 本 / 指 2 本。長いノートは右端のつまみを掴むと、ページ番号を見ながら素早く移動できる |
| 取り消し / やり直し | 2 本指タップ / 3 本指タップ(道具バーのボタンでも) |
| 方眼 / 無地 | 道具バー右端の方眼ボタン(ノートごと) |
| 紙を右へ継ぐ | 各ページ右の「+」。継いだ紙が白紙なら「−」で外せる |
| ノートの切り替え・作成・ゴミ箱 | 左上のメニュー |
指では描きません。ペンが画面の近くにあるときや離した直後のタッチは、手のひらとみなして無視します。
データとバックアップ
ノートはまず iPad のブラウザの中(IndexedDB)に、線を 1 本書くたびに保存されます。保存に失敗したときは、成功するまで自動でやり直し、その間は赤い帯で知らせます。
GitHub への自動バックアップ(おすすめ): ノート一覧の「GitHub への自動バックアップ」→「設定」に、非公開の repo(owner/name)と fine-grained token(その repo だけ、Contents の Read and write)を入れると、書いて手を止めるたびに repo へ commit されます。履歴が残るので、どの時点にも戻せます。iPad を替えたときは、同じ設定をして「GitHub から読み込む」で戻ります。手元に無いノートを repo から消すことはありません(消すのは「完全に削除」したノートだけ)。
ファイルへの書き出し: 「書き出す」で全ノートを 1 つのファイルにし、「読み込む」で戻せます。GitHub を設定していないときは、7 日以上書き出していないとメニューに赤い点が付きます。
開発
npm install
npm run dev # 開発サーバ
npm test # 単体テスト(Vitest)
npm run e2e # ブラウザテスト(Playwright、WebKit と Chromium)
npm run build # 型検査とビルド
main に push すると GitHub Actions が GitHub Pages に公開します。開発の経緯と知見は wiki/ にあります(LLM が書いている開発 wiki)。