3D WEBSITE / THREE.JS
3Dサイト制作中を歩ける、触れるホームページを
Three.js（WebGL）で、ブラウザの中に3Dの場所を作ります。
スマホでも軽く動き、検索にも載る作りで。
料金の目安 50万円〜（税別）
3Dのホームページで、できること
写真と文章のページでは伝わりにくいものを、中に入って見てもらえるようにします。
- 会場・施設を歩いて見せる
行く前に中を見られるサイト。展示・店舗・イベント会場の下見や案内に。
- 商品を回して見せる
写真では伝わらない形や大きさを、回したり近づいたりして見てもらえます。
- 世界観を体験してもらう
ブランドや作品の世界を、読むのではなく中に入って感じてもらうサイト。
- イベント・キャンペーンの特設サイト
期間限定の企画を、触って遊べるページに。SNSで話題にしやすい形です。
動いている3Dサイト
-
-
-
3Dの建物の中を歩いて回れるサイト（デモ）
光を焼き込んだ3Dの建物の中を、人を歩かせて回れるデモです。カメラは人の後ろからついていきます。光源を置かないので、スマホでも軽く動きます。
デモを見る → -
3Dサイトで気をつけていること
3Dのサイトは「重い」「検索に出ない」「スマホで使いにくい」になりがちです。作る前から、そこを先に決めています。
- 01検索に載る形で作る
3Dの中の文字だけに頼らず、同じ内容をページの文章と構造化データとしても置きます。検索エンジンやAIが読めるのは文章なので、3Dのサイトでも「何のページか」が伝わるようにします。
- 02スマホで重くしない
端末の速さを見て、動きが重いときは画質を自動で下げます。3Dの動物は1体110〜300KBにして、表示を重くしないようにしています。
- 03スマホの指で操作できる
1本指で移動、2本指で回転。マウスが無くても迷わない操作にしています。このサイトのトップでは車にも乗れます。
- 04見る人を酔わせない
画面が勝手に大きく動くと、見る人が気持ち悪くなります。カメラの動きは、見る人が動かしたときだけにしています。
3Dサイト制作の料金
50万円〜（税別）
内容によっては、100万円を超える場合があります。
基本は、おまかせに近い形でのご依頼になります。
目的や方向性、何を作るかは一緒に決めます。ただ、どこまで作り込むか、何をどう見せるかは、サイトの重さ・見た目の質・動く端末など、いくつもの条件で決まります。そこはこちらの判断にお任せいただく形でのみ、お受けしています。
置く物や動きを増やすほど、サイトは重くなり、スマホでは動かなくなります。写真や他のサイトの見た目を、そのまま同じように再現することもできません。軽く、どの端末でも気持ちよく動くことを、見た目より先に守るためです。
進め方
- 01ヒアリング
何を見せたいか、見た人に何をしてほしいかを伺います。
- 02方向を決める
目的と方向性、何を作るかを一緒に決めます。
- 03作って見せる
動く形でお見せしながら進めます。スマホでもその場で触れます。
- 04公開と見守り
公開後も、重くなっていないか、動かない端末が無いかを見ます。