画面設計指示書（ワイヤーフレーム）

プロジェクト: ラーメン首里城 店舗公式サイト（トップページ）

① ヘッダー

▼要件定義：UI機能

ナビゲーション固定（ハブ機能）
ユーザーがページを下部まで読み進めても、常に下層ページ（「メニュー詳細」や「アクセス」等）へスムーズに遷移できるよう、ヘッダーは画面上部に固定（Sticky）配置とする。
ロゴ画像
お知らせメニューアクセス問合せ
② ファーストビュー

▼要件定義：コンセプト

店舗ブランディング
「札幌の地に沖縄の風を運ぶ」というキャッチコピーと、シズル感のあるラーメン画像を重ねる。

※画像サイズが大きくなるため、WebP化とLazyLoadをシステム側で必須対応とする。
メインビジュアル画像 (スライダー)

札幌の地に沖縄の風を運ぶ

究極の塩ラーメン専門店

③ 当店のこだわり（強み）

▼情報設計：強みの提示

他店との差別化要因を3つの要素（スープ、麺、器）に因数分解し、視覚的に並べることで直感的な理解を促す。
テキストだけでなく、各工程の写真を配置して説得力を持たせる。
当店のこだわり
【その壱】碧のスープ
【その弐】特注ちぢれ麺
【その参】やちむんの器
④ お知らせ (CMS)

▼機能要件：CMS出力

WordPressの投稿（Post）データを最新3件のみ動的に表示。
リンク先は /news/ （投稿名パーマリンク）へ遷移させ、詳細情報への導線を確保する。
お知らせ 一覧を見る >
  • 2026.02.19 デリバリー始めました
  • 2026.02.19 【期間限定】エグゼクティブ塩
  • 2025.12.17 NEW OPEN!!
⑤ メニュー抜粋 & 下層誘導

▼UX要件：回遊性向上

全メニューを載せるとページが冗長になるため、主力商品3点のみを提示して興味を惹く。
その上で下層ページ（/menu/）への明確な誘導ボタン（CTA）を配置し、サイト内の回遊を促す。
メニュー
塩ラーメン
900円
塩チャーシュー
1,000円
塩ワンタン
1,000円
メニュー詳細を見る ＞
⑥ アクセス・店舗情報

▼要件定義：来店サポート

スマホでの閲覧を想定し、Google Mapの埋め込みを大きく配置。
テキスト情報（営業時間・定休日）も一覧化し、トップページを見るだけで即座に来店行動へ移せるよう情報を集約。
店舗ご案内
Google Map API 埋め込み領域

住所: 北海道札幌市北区麻生町〇-〇

TEL: 011-000-0000

営業時間: 11:00〜15:00 / 17:00〜20:00

定休日: 月曜日（不定休あり）

駐車場: 専用無料駐車場2台完備

トップ メニュー アクセス お問い合わせ

Copyright © ラーメン首里城(Demo Site) All Rights Reserved.