From 4a7137169a1ba7e28730508ee8ef71788d33f898 Mon Sep 17 00:00:00 2001
From: Yasutake Yohei <61961825+yasutakeyohei@users.noreply.github.com>
Date: Fri, 23 Oct 2026 10:17:15 +0900
Subject: bluebey/guide: 「ぶるべーを探せ」の例を追加し、説明を更新
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/bluebey-studio/guide.html | 23 ++++++++++++++---------
 public/bluebey-studio/index.html |  1 +
 2 files changed, 15 insertions(+), 9 deletions(-)

(limited to 'public/bluebey-studio')

diff --git a/public/bluebey-studio/guide.html b/public/bluebey-studio/guide.html
index 64d67d6..e63cd6c 100644
--- a/public/bluebey-studio/guide.html
+++ b/public/bluebey-studio/guide.html
@@ -74,6 +74,11 @@
   <img src="../bluebey/images/sagase-2.webp" alt="「ぶるべーを探せ！」の別の例" style="width:100%;border-radius:8px">
   <figcaption>別のジオラマを使った例</figcaption>
 </figure>
+<p>写真の中の物の裏にぶるべーを隠したいときは、背景に写真を読み込んで「隠すマスク」機能を使います。隠したい物（木・建物・おもちゃなど）を写真の上でタップすると、その形に合わせてぶるべーが隠れます。</p>
+<figure style="margin:1rem 0">
+  <img src="../bluebey/images/sagase-3.webp" alt="「ぶるべーを探せ！」の例。おもちゃの車が山積みになった中に、小さなぶるべーが顔を出している" style="width:100%;border-radius:8px">
+  <figcaption>おもちゃの車が山積みになった中に、ぶるべーが顔を出している例</figcaption>
+</figure>
 <h3>小平市の名所で一緒に写る例</h3>
 <p>小平市の名所を撮影し、その写真にぶるべーを一緒に写す、という使い方です。</p>
 <figure style="margin:1rem 0">
@@ -110,13 +115,13 @@
 </ol>
 <h3>パソコンでの操作</h3>
 <ul>
-  <li>ぶるべーをつかんでドラッグすると、ぶるべーを移動できます。</li>
-  <li>Shift を押しながら左右にドラッグすると、ぶるべーが影と一緒に左右に動きます。</li>
-  <li>Shift を押しながら上下にドラッグすると、カメラ（見ている基準点）を上下に動かせます。</li>
-  <li>回転の中心をぶるべーに合わせたいときは、ぶるべーをダブルクリックします（「シーン」タブの「画面・光」にある「中心をぶるべーに合わせる」でも同じです）。</li>
+  <li>ぶるべーをドラッグすると、カメラの中心が動いて、ぶるべーが画面の中を動きます（回転の中心はぶるべーのままなので、そのまま回転させてもぶるべーは画面から外れません）。</li>
+  <li>Shift を押しながらドラッグすると、ぶるべー本体を移動できます。</li>
+  <li>右ドラッグでもカメラを動かせます。</li>
+  <li>回転の中心をぶるべーに合わせ直したいときは、ぶるべーをダブルクリックします（「シーン」タブの「画面・光」にある「中心をぶるべーに合わせる」でも同じです）。</li>
   <li>向きは、全身とボーンのスライダーや回転ギズモで調整できます。</li>
   <li>モデルをクリックすると、その場所に近いボーンが選ばれます。</li>
-  <li>「元に戻す／やり直す（パネル上部の矢印アイコン）」「すべてをランダムに（？！アイコン）」は、どのタブでも使えます。</li>
+  <li>「元に戻す／やり直す（パネル上部の矢印アイコン）」は、どのタブでも使えます。</li>
 </ul>
 <h3>スマホでの操作</h3>
 <ul>
@@ -152,7 +157,7 @@
   <tr><td>口</td><td>口の形は「ふつうの口／丸く開く（O）」。曲げ・長さ・幅・太さ・開き・傾き・高さ、口角（角度・長さ）、舌（大きさ・位置）、色。</td></tr>
   <tr><td>眼鏡・サングラス</td><td>コスプレの一種として、眼鏡やサングラスをかけられます。フレームの太さ・色、レンズの色・濃さ、左右レンズの間隔、大きさ・高さ・傾き。</td></tr>
   <tr><td>鼻ちょうちん</td><td>鼻ちょうちんを出す／出さない。大きさ・よこ位置・高さ・おくゆき・色。</td></tr>
-  <tr><td>帽子</td><td>なし／シルクハット／キャップ／コック帽／消防士。大きさ・位置・前後の傾き・左右の傾き。</td></tr>
+  <tr><td>帽子</td><td>なし／シルクハット／キャップ／コック帽／消防士。横位置・奥行き・高さ・前後の傾き・左右の傾き。線画にも対応。</td></tr>
   <tr><td>タブ最下部</td><td>顔をランダムに／顔をリセット</td></tr>
 </table>
 
@@ -166,7 +171,7 @@
 <h3>シーン</h3>
 <table>
   <tr><th>メニュー</th><th>できること</th></tr>
-  <tr><td>背景</td><td>背景の色、自分の画像、単色、透明、写真背景（倉庫・広間・空と雲・秋の公園・学校・社長室・砂漠・海岸・無人島・土管のある空き地・宇宙船の中・廃工場の食堂・地下室のリング・自動車工場・路地）、効果線（集中線・楕円集中線など）。「この背景で写真を撮る」。</td></tr>
+  <tr><td>背景</td><td>背景の色、自分の画像、単色、透明、写真背景（倉庫・広間・空と雲・秋の公園・学校・社長室・砂漠・海岸・無人島・土管のある空き地・宇宙船の中・廃工場の食堂・地下室のリング・自動車工場・路地）、効果線（集中線・楕円集中線など）。写真を読み込んだときは「隠すマスク」機能で、写真の中の物の形に合わせてぶるべーを隠せます。「この背景で写真を撮る」。</td></tr>
   <tr><td>小物</td><td>演台・机・マイク・看板・観葉植物・段ボール箱・空いた缶詰・ベッド・布団・コップ・鉛筆・ノート・消しゴムを追加。看板には文字を入れられます。大きさ・位置・回転（X/Y/Z）。</td></tr>
   <tr><td>擬音（マンガのオノマトペ）</td><td>画像から四角く切り出した擬音のスタンプを画面に貼れます。この機能は未実装ですが、想定しているオノマトペは、「グーグー」「zzz」「シーン」「ゴゴゴ」などです。ぶるべーがしゃべっていると思われるような擬音は作りません。</td></tr>
   <tr><td>見えない壁</td><td>見えない板（有限の壁1・壁2）を置くと、その向こう側が隠れます。ぶるべーを壁に埋め込むと、体の一部だけが見えます。</td></tr>
@@ -183,7 +188,7 @@
   <tr><td>設定</td><td>設定を保存（JSON）／設定を読み込む。</td></tr>
 </table>
 <p class="note">画像の保存は現在PNGのみですが、JPG形式での保存にも対応する予定です。</p>
-<p class="note">「元に戻す」「やり直す」「すべてをランダムに（？！）」は、どのタブを選んでいてもパネル上部に表示されます。</p>
+<p class="note">「元に戻す」「やり直す」は、どのタブを選んでいてもパネル上部に表示されます。</p>
 
 <h2>5. もし問題がある場合</h2>
 <p>上記の使い方や機能のうち、「これは避けてほしい」「この機能は外してほしい」というものがあれば、お知らせください。こちらで、その機能の削除や調整などの対応をします。</p>
@@ -195,7 +200,7 @@
   <li>帽子（シルクハット・キャップ・コック帽・消防士）</li>
   <li>鼻ちょうちん、倒れるポーズ（こてん・ねている）</li>
   <li>小物（ベッド・布団など）</li>
-  <li>背景、擬音（マンガのオノマトペ）、見えない壁、まんが</li>
+  <li>背景（写真の中の物の裏にぶるべーを隠すマスクを含む）、擬音（マンガのオノマトペ）、見えない壁、まんが</li>
 </ul>
 
 <footer>
diff --git a/public/bluebey-studio/index.html b/public/bluebey-studio/index.html
index 59e8b74..f47a7d1 100644
--- a/public/bluebey-studio/index.html
+++ b/public/bluebey-studio/index.html
@@ -167,6 +167,7 @@ if (window.matchMedia('(max-width: 768px), (max-height: 500px) and (pointer: coa
       <li>線画は輪郭線＋白ぬり。線の太さと色、紙の色を変えられます。</li>
       <li>「シーン」タブの「画面・光」で「正投影」にすると遠近のゆがみがなくなり、図面のような絵になります。</li>
       <li>背景は、「シーン」タブの「背景」で透明・単色・写真などから選べます。<code>PNG保存</code>は透明のまま保存できます。</li>
+      <li>自分の写真を背景にしたときは、「隠すマスクを作る」で写真の中の物（木・建物など）をタップすると、その物の裏にぶるべーを隠せます。</li>
     </ul>
 
     <h3>キーボード</h3>
-- 
cgit v1.3.1