# シンプルスライド デザインの書式(生成 AI 向け)
この文書は、生成 AI が「シンプルスライド」(https://slide.sapp.jp)用のスライドのデザイン(背景と色)を作るための仕様です。
利用者は、この文書を最初に AI に渡してから、作りたいデザインの雰囲気(色、模様、ロゴなど)を伝えてください。
AI が出力した JSON をファイル(拡張子 `.json`)に保存し、アプリの配色の選択欄の「デザインを読み込む…」で取り込みます。
---
## AI への指示
あなたは「シンプルスライド」用のデザインを、JSON 1 個として書きます。以下の規則を必ず守ってください。
デザインで決められるのは、背景(表紙用とそれ以外用の 2 枚)と色だけです。文字の位置・大きさ・書体は決められません。
### 出力の形
- 出力するのは JSON だけです。前置きや説明文を JSON の中に混ぜないでください。説明が必要なら、JSON の外(前か後ろ)に短く書いてください。
- JSON にはコメントを書けません。末尾のカンマも使えません。
- ファイルの大きさの上限は 2 MB です。
- デザインを直すよう頼まれたときは、JSON 全体を出し直してください。
### スライドの大きさと文字の位置
スライドは横 1600、縦 900 です(座標は左上が原点、単位は px)。文字は次の範囲に載ります。位置は固定で、デザインでは変えられません。
| 部分 | 範囲 |
|---|---|
| 題名(`##`)の欄 | x 96〜1504、y 40〜136。下端の 3px が題名の下線 |
| 本文(題名があるスライド) | x 96〜1504、y 167〜828 |
| 表紙の文字(`#` で始まるスライド) | x 96〜1504、y 64〜828 の範囲で上下左右の中央に置かれる |
| ページ番号(「n / N」) | 右下。おおよそ x 1525〜1568、y 848〜880 |
背景の模様・帯・ロゴは、文字が載らない次の余白にだけ置いてください。文字の範囲に模様をかけると、文字が読みにくくなります。
| 余白 | 範囲 | 使えるスライド |
|---|---|---|
| 上端 | y 0〜40(全幅) | 表紙以外。表紙は y 0〜64 |
| 下端 | y 828〜900(全幅)。ただしページ番号の x 1510〜1580、y 840〜890 は空ける | 表紙・表紙以外 |
| 左右 | x 0〜96 と x 1504〜1600(全高。右下はページ番号を空ける) | 表紙・表紙以外 |
| 題名と本文の間 | y 136〜167(全幅、細い) | 表紙以外 |
表紙の文字は中央に寄るので、文字が少なければ上下も空きますが、文字の量は原稿次第です。ロゴは上の余白に置いてください。
文字の範囲の地は、無地か、ごく淡い一様な模様にしてください。文字の色(`colors.text`・`colors.title`)と地の色の明暗の差を十分に取ってください。
### JSON の形
```json
{
"format": "simple-slide-design",
"version": 1,
"name": "デザインの名前",
"base": "white",
"author": "作成者の名前(任意)",
"license": "ライセンスの表記(任意)",
"cover": { "background": "" },
"slide": { "background": "" },
"colors": {
"background": "#ffffff",
"text": "#1b1b1b",
"sub": "#5a5a5a",
"title": "#123c69",
"titleRule": "#123c69",
"rule": "#c9c9c4",
"box": "#123c69",
"link": "#0b57a4",
"code": "#f2f2ee",
"red": "#d42040",
"yellow": "#d08a00",
"blue": "#0066cc",
"pageNumber": "#5a5a5a"
}
}
```
| 項目 | 必須 | 内容 |
|---|---|---|
| `format` | 必須 | 文字列 `"simple-slide-design"` に固定 |
| `version` | 必須 | 数値 `1`(文字列の `"1"` は不可) |
| `name` | 必須 | 配色の選択欄に出る名前。1〜40 文字 |
| `base` | 任意 | `"white"`(既定)か `"board"`。明るい地なら `"white"`、暗い地なら `"board"`。`colors` で指定しなかった色、コードの色分け、囲み枠の見出しの帯の色、ペンの色は、この配色のものになる |
| `author` | 任意 | 作成者。100 文字まで |
| `license` | 任意 | ライセンスの表記。200 文字まで |
| `cover.background` | 任意 | 表紙(`#` で始まるスライド)の背景 |
| `slide.background` | 任意 | 表紙以外のスライドの背景 |
| `colors` | 任意 | 色。下の表のキーだけ。どれも省略できる |
上の表にないキーは使えません(取り込むときに無視され、利用者に知らされます)。
### 背景
- 背景は、SVG の文字列か、`data:image/png;base64,…`・`data:image/jpeg;base64,…`・`data:image/webp;base64,…`・`data:image/svg+xml;base64,…` の data URI です。あなた(AI)が作るときは SVG の文字列にしてください。
- SVG は `