こんな人におすすめ

• Studioの標準機能にない「便利なツール」が欲しい

• 「Embed（埋め込み）ボックス」を使いこなしたい

• プログラミングはできないけれど、AI（Gemini）を活用してみたい

1. ホームページに「便利な機能」をプラスする

素敵なデザインのサイトができたら、次に欲しくなるのが「ユーザーが使える便利なツール」です。 例えば、商品を買う前の「見積もりシミュレーター」や、現場で役立つ「計算機」。 これまでは専門のエンジニアに数万円〜の費用を払って依頼するのが当たり前でしたが、今は「Studio × Gemini（AI）」で、誰でも数分で作れる時代になりました。

2. Studioの「Embedボックス」は魔法の窓

Studioには、外部のプログラムを呼び出すための「Embed（埋め込み）ボックス」というパーツがあります。 いわば、サイトの中に別の機能をはめ込むための「魔法の窓」。今回はこの窓を使って、「タイル・床材の必要枚数計算機」を実装しました。

3. 【実録】AIと作る3ステップ

「プログラミングなんて1行も書けない！」という私でも、以下の手順であっという間に完成しました。

ステップ1：Geminiに「お願い」するだけ

GoogleのAI「Gemini」に、こう指示を出しました。

「Studioの埋め込み枠で使いたいので、タイルの面積から必要枚数を算出する計算機のHTML/CSS/JSコードを1つにまとめて作って。デザインはモダンで、スマホでも使いやすくして。」

これだけで、一瞬でプロが書いたようなコードが生成されます。

ステップ2：Studioにコードを貼り付ける

Studioの編集画面で「埋め込み（Embed）」パーツを配置。Geminiが作ったコードをそのままペーストします。

ステップ3：完成！

プレビューを確認すると、もう計算機が動いています。 「もう少し色を明るくして」とGeminiに頼めば、デザインの微調整も一瞬です。

4. 実際に作ったツールを見てください

完成した計算機はこちらで公開しています。

タイル・床の必要枚数計算機

部屋の面積とタイルのサイズを入れるだけで、予備を含めた枚数が瞬時にわかります。この「かゆいところに手が届く」ツールが、たった5分で実装できてしまいました。

5. まとめ：NISTAが提案する「一歩先のWebサイト」

今回の試みで、Studioの可能性がさらに広がることがわかりました。 標準機能にないものでも、AIという強力なパートナーがいれば、お客様の「こんなことできないかな？」という想いをスピーディーに形にできます。

1967年から続く日広社の広告制作ノウハウと、最新のテクノロジー（Studio × AI）。これらを掛け合わせ、私たちは「コンセプトのバトン」をより遠く、より多くの方へとつないでいきます。

お客様が大切に育てていくサイトに、便利な「魔法の小窓」をつけてみませんか？ そのバトンを、ぜひNISTAと一緒に未来へ走らせましょう。