INTERNAL / 案の比較
DCTgate サイト デザイン案
会社のサイトと、店のサイトを別々に立てています。見る人も目的も違うためです。
店のサイトは 2 ブランドで正反対の方向に振っています。
店のサイト
会社のサイト（DCTgate）
どの案も中身は同じで、見せ方だけが違います。2 ブランドともスクロールなしで見えます。
案A 門・かっこよく紹介 黒の門＋写真の下に大きく太いブランド名（雑誌の表紙のような横組み）
おすすめ
【採用】キャッチコピーが出たあと、Dreams Come True を右から来た gate が薙ぎ払い、D・C・T だけが残って DCTgate になります。そのまま帯が縮んで固定ヘッダーになり、扉が現れます（約3秒）。扉は写真の下に大きく太いブランド名を横組みで置く、雑誌の表紙のような見せ方。開いた瞬間、写真がわずかにズームアウトしながら現れる演出も足しています。ラーメン辻は実店舗のロゴを大きく出します。
- 強み
- ブランド名の存在感が段違いに強くなり、初見のインパクトを出せます。hoverで現れる「詳しく見る→」で、作り込まれた印象も出ます。
- 弱み
- 毎回3秒の入場演出があります（公開時は初回だけに絞る想定）。文字が大きく主張するぶん、写真とのバランス次第で「うるさく」見えるリスクもあります。
案B 墨 白ベース＋写真スライドショー＋理念は直書き＋ブランドは白カード2枚
上部バー・入場演出は案Aと同じ仕組み（GateIntroHeader）ですが、白地・黒文字の反転版。本文は総入れ替えし、1画面で完結する「理念＋ブランド紹介」のヒーローにしました。額のすぐ下、PHILOSOPHYより上には、ブランドを問わず写真を巡回させるスライドショー（7秒に1枚、切り替わり直後にゆっくりズームアウト）を追加。下端は白グラデーションでPHILOSOPHY以降へ継ぎ目なくつなげています。左に理念をカードにせず直書きし、右にラーメン辻・中華そば辻を白いカード（写真＋ブランド名、影で浮かせる）で並べています。
- 強み
- 写真の訴求力と、白カード＋影というAppleの製品ページのような上質さを両取りできます。FC加盟・お問い合わせは軽いリンクにとどめ、長い説明文を持たせていません。
- 弱み
- スライドショーぶん、初期読み込みの画像が増えます。案Aに比べると主張が控えめなので、ブランドごとの個性（写真の力）に見た目がより左右されます。
案C 墨（バックアップ） 白ベース＋理念は直書き＋ブランドは白カード2枚（スライドショー無し）
案Bに写真スライドショーを足す前の状態をそのまま残したバックアップ。中身は案Bと同一で、額のすぐ下がスライドショーではなくPHILOSOPHYから始まる点だけが違います。
- 強み
- 案Bとの見比べ用。画像の追加読み込みが無いぶん軽く、より静かな第一印象です。
- 弱み
- 比較用のバックアップなので、単独で採用する想定ではありません。
案によらず同じページ