44dat DESIGN GALLERY

科学館

宙(SORA)ドーム科学館

架空ブランドを立てて制作したデザインデモです(2026-07-02 公開)。

実際のサイトを見る 別タブで開きます

宙(SORA)ドーム科学館(科学館)のホームページデザイン

汐口臨海公園の中の、直径18mドームの科学館。すべての上映は今夜ほんとうに見える星空の生解説からはじまります。本日の星空・ドーム上映・学芸員の解説ルート・企画展のご案内。

全ページビュー

宙(SORA)ドーム科学館 — full page

このサイトの作られ方

実際の発注内容

ビルドの起点になった設計方針です。人が書いたものではなく、AI が毎朝生成した7案のうち選ばれた1案をそのまま載せています。

コンセプト 宙(SORA)ドーム科学館 — 遠い天体を、今日の自分の時間に引き寄せる科学館。3Dの太陽系を『今夜の星空・学芸員の解説ルート・ドーム上映の予告編』へ編集し、来館後に宇宙との距離感が変わる体験を約束する

スタイル
天文台の暗室を思わせる観測機器質感 + 全画面3Dを従属させたエディトリアル導線設計
レイアウト
非対称エディトリアル(全画面3Dを背景装置に退け、ファーストビューに『上映中/本日の星空/企画展/チケット』の4導線を固定オーバーレイ)
タイポグラフィ
人文系サンセリフ主体(見出し・案内文)+ mono を座標/日時/観測値だけに限定
モーション
3Dは巡回演出ではなく各導線の意味づけ装置として駆動。スクロールで惑星が上映予告・今夜の星空へフォーカス遷移し、prefers-reduced-motion で静止星図に退避
配色
ネオン非依存。天文台の暗室グレー地に、赤色灯と真鍮のアクセント、深宇宙写真由来の鈍い色域(褪せた琥珀・鉄錆・遠星の青)
狙い
全画面リアルタイム3D WebGL をヒーロー背景に据えつつ、初手で選べる4導線を最前面に固定し、mono を観測値だけに絞って人文系サンセリフで案内する『没入と情報設計の両立』構造
設計の勘所
全画面3Dを背景の意味づけ装置に退け、その上に『上映中/本日の星空/企画展/チケット』の固定4導線を重ね、mono を座標・日時・観測値だけに限定して人文系サンセリフで案内する、没入と行動導線を両立させたレイアウト

写真は生成 AI で作成した架空のイメージです。ブランド・実績・数値はすべて架空のもので、実在の企業とは関係ありません。

この業種・このテイストで、御社のサイトを制作します。

掲載デモと同じ品質のオリジナルサイトを、設計から公開まで一貫して承ります。「このデモの雰囲気で」の一言から始められます。