消えたのは、どれ?
3Dの家を60秒歩いて覚え、目を閉じているあいだに消えた物を1つ、みんなで当てる間違い探し。家具と小物は本物そっくりの3Dモデル(Poly Haven・CC0)。1つの画面をみんなで見て遊ぶ。
所要時間4時間51分
制作メモ
- AIに任せた
- 着手前に、遊ぶ場面(1つの画面をみんなで見る)からユーザーストーリーとUX5階層を書いた。通した結果、実装が9件変わった(小物の置き場所を問題ごとに入れ替える・見えない物は消さない関門・押した場所まで歩く操作と見取り図・消えた物の当たり判定と影も消す など)/Poly Haven の3Dモデル61点・床と壁の質感6点・窓の外の実写パノラマ1点(すべてCC0)を公開APIから取り、三角形を間引いて画像を縮め、合計11MBに収めた。取得と加工は1本のスクリプトで作り直せる/間取りの表1つから、6つの部屋・壁・窓・扉・カーテン・幅木・天井との境の縁を組み立て、西日の日だまりと壁ぎわの陰りで本物の家らしい光にした/置き場所71か所のどれもが、同じ部屋の歩ける場所の25%以上から隠れずに見えることを計算で確かめる関門を作った。テレビ台の裏・ベッドの下・閉じた棚の中に置き場所を足すと落ちることも確かめた/別の担当(AI)が実際に遊んで採点する体験評価を2周(16点・操作の手応え0点で不合格→17点で合格)、画面の写真だけで採点する見た目の評価を3周(11点→13点→15点。合格線の16点には届かず、3周目の指摘は直したが採点し直していない)回し、指摘を裏取りしてから直した/実装、単体テスト53件とE2E 8件、デモ動画、プロモ動画(BGMはA案・B案)
- 自分でやった
- 題材(3Dの家を1分歩いて覚え、物を1つなくして、なくした物をみんなで当てる)の指定/着手前に、公開先(100日チャレンジの54日目)・遊び方(1つの画面をみんなで見る)・見た目(本物そっくりの家具)の3点を選んだ
- 失敗と修正
- 本番と同じ安全設定(CSP)で開くと、3Dモデルに埋め込まれた質感画像の読み込み(blob: のURLへの通信)が止められ、家具が真っ白になった → このDayだけ connect-src に blob: を足した。本番の設定から消えたらE2Eで落ちるようにした
体験評価の1周目で、見取り図の部屋ボタンの移動が34回中16回、出入口の角で止まった(操作の手応え0点) → 当たり判定を升目から壁や家具の形そのものに替え、角では横へ滑るようにした。道順は通路の真ん中を選び、止まったら引き直す。30通りの置き方×部屋の組み合わせで止まらないことを単体テストで確かめている
答えの画面で Esc を押すと、一時停止の画面が答えの画面の裏に隠れたまま止まり、「これにする」が効かなくなった → 時間の進まない答えの画面では一時停止をやめ、Esc を「選び直す」にした
候補が問ごとに増える作りにしたら、スマホで候補8つのとき「これにする」が画面の外に出た → 決定ボタンを札の下端に貼りつけ、候補が7つ以上なら写真を小さくして4段が1画面に収まるようにした
見た目の評価の1周目は11点。パソコンやテレビで2m離れると文字がスマホと同じ大きさのままで小さく、答え合わせで消えた物に目が行かなかった → 幅1100px以上では画面の部品をまとめて拡大し、答え合わせでは物に寄って真上に「ここ!」の札を出し、太い輪と光で示すようにした
窓の外が一枚の緑の板で、日の光も床に落ちず、家が作り物に見えた → 窓の外を実写の庭のパノラマにし、低い西日を強めて床に窓の形の日だまりを落とした。部屋全体を照らす光は控えめにした
鏡の模型は色画像の鏡の部分が暗く、黒い板にしか見えなかった。額のガラスも黒い金属に見えた → 鏡は同じ場所に掛ける風景画に替えた。ガラスは素材の jpg に透明の情報が無いため、読み込み時に半透明の材質へ作り直した
食卓の上の物を、卓布の面より5cm高く置いていて、ティーセットが浮いて見えた → 食卓の面の高さを模型から測り直した。天板の上の物が家具の面からはみ出さないことを単体テストで確かめるようにした(書斎の机の置き場所のはみ出しもこれで見つかった)
床と天井の壁ぎわに、溝のような硬い縁の暗い帯が出ていた。見た目の評価(3周目)は日差しのせいと見立てたが、原因は壁ぎわを暗くする帯の画像が上下逆に貼られていたことで、壁から34cmの所がいちばん濃く、そこで急に切れていた → 画像の向きを直し、部屋の隅だけがなめらかに暗くなるようにした。あわせて西日を弱め、影の縁のぼかしを狭めて、白く飛んだ光の塊と縁のざらつきを消した




















































