Opus 5.5 turns guesthouse photos into a clickable architectural-model site
Using Claude Code (Opus 5.5), the author turned guesthouse photos into architectural-model-style thumbnails that switch to the real photo on tap, with six languages and mobile support, in about an hour and a half.
【検証】Claude Code（Opus 5.5）と、民泊の写真を「建築模型」にしてサイトに実装してみた 実際の部屋の写真を、AIで建築模型みたいなミニチュアに。 模型をタップすると、元の写真に切り替わります。 動画は、模型を1つずつタップして実写に切り替えているところです。 これ、民泊の部屋でやったら絶対かわいいなと。 流れはこんな感じです。 1. 実写を4枚選ぶ（BBQテラス、リビング、板張りの和室、庭側の寝室） 2. Opusが部屋ごとにプロンプトを書き分ける 3. 画像を描くのはCodex（GPT Image 2）に任せる 4. 仕上がりをOpusがチェック 5. サイトに組み込んで、スマホ表示まで確認 一番おもしろかったのは4のチェックでした。 リビングの模型、パッと見は完璧だったんです。 でもOpusが画像を拡大して「照明が天井のないところで宙に浮いてます」と。 模型なので天井は外してあるんですよね。 それなのに、シャンデリアとペンダントライトだけ空中に残ってた。 しかもこれ、自分が見る前にOpusが見つけて、照明だけ消して作り直してくれてました笑 ほかは一切いじらずに。 クッションの色（黄色・白・幾何学柄・黒）や、丸いローテーブル2つの重なり方まで、ちゃんと実物どおりです。 サイト側の実装もOpus 5.5。 ・模型をタップすると実写に切り替わる（動画のやつ） ・6言語対応（日英仏西韓中） ・スマホは2列、PCは4列 ・画像は1枚60〜230KBまで圧縮 ・「写真をもとにAIで作ったイメージです」の注意書き 最後の注意書きは、個人的に一番こだわったところです。 ホテル業界でも、AIで作った画像をそのまま出してブランドを落としている、という声が出ています。 なので模型は実写の代わりにはしていません。 必ず実写とセットで見せて、お部屋選びの判断はあくまで実写と360°ビューで。 模型は「ちょっと楽しんでもらう入口」という位置づけです。 仕上げに、書いたコードをCodexにレビューさせたら 「スクリーンリーダーだと、見えていない方の画像まで読み上げてしまう」 と1件指摘が。 これもOpusがその場で直しました。 AIが書いたコードを別のAIにレビューさせるの、地味ですがかなり効きます。 かかったのは、いつものサブスクだけ。 Claude Code、ChatGPT（Codex）、X Premium+（Grok）の3つで、API代はゼロです。 画像1枚あたり、Codexの週の利用枠の1%くらいでした。 調べ始めてからサイトに組み込むまで、だいたい1時間半。 民泊やレンタルスペースをやっている方なら、手元の写真でそのまま試せます。 気になった方はぜひやってみてください！ 次はこの流れで「家まるごとの3D間取り」に挑戦します。 #ClaudeCode #民泊