ホームページ・LPの見本

Photo Studio / 1 Page Photo Studio / 飛び出す絵本のような写真館のサイト

ふちどり写真館

閉じたアルバムの表紙から始まり、スクロールで表紙が開いて本の中へ。紙の上に寝ていた人たちが、近づくと起き上がります。絵の線はいつも少しだけふるえていて、手描きの絵本のよう。区切りは全部、紙とアルバムのふちです。

• 開くアルバムの表紙
• 起き上がる人たち
• ふるえる線

開く Clinic / 6 Pages Clinic / 6ページの整体院のサイト

とも整体院

開くと、からまった線が描かれ、スクロールに合わせてほどけて、のびをする人に変わります。悩みを書いたシャボン玉が上がってはじけ、新芽が芽吹く流れで、各ページへご案内します。

• ほどける線画
• 悩みのシャボン玉
• 1文字ずつの縦書き

開く Recruit / LP Recruit / 介護事業所の採用ページ

訪問介護ステーション とも（採用ページ）

訪問介護の事業所が自分で出す「うちで働きませんか」のページ。スクロールに合わせて、町の地図の上を自転車が家から家へ進み、ヘルパーの1日が分かります。水彩の絵と写真で、やわらかい雰囲気にまとめました。

• 自転車で進む1日
• 水彩の町の地図
• スマホの下に応募ボタン

開く Cafe / 5 Pages Cafe / 5ページのお店サイト

コーヒーと焼き菓子 あさつゆ

最初に開くと、お店の扉がひらいてトップへ。お知らせ・季節のメニュー・営業時間は、お店の方がスプレッドシートを書き換えるだけで変わる作りです。30秒の広告動画も入っています。

• 入口の扉
• シートで更新
• 広告動画

開く Curry Stand / 5 Pages Restaurant / メニューが主役のお店サイト

CURRY STAND トモ

料理の写真をカタログのように並べ、ボタンで絞り込めるメニュー。台形の看板とひさしで、スタンドの雰囲気にそろえました。お知らせと営業時間は、スプレッドシートから更新できます。

• 写真のメニュー
• 台形の看板
• シートで更新

開く MIROX / MATERIAL & CARE MIROX / ブランドサイトの制作案

ミロックス — 素材から、心地よく。

淡いブルーグレーと白。美容の写真と広がる光から、素材の物語、商品紹介、正式ロゴ、重なるケアカードへつながる構成です。

• ブルーグレー
• 美容の導入
• ケアカード

開く MIROX / VERSION 01MIROXシリカブラックを、毎日のケアへ。 MIROX / ブランドサイトの制作案

ミロックス — バージョン1

黒とゴールドの落ち着いた構成。素材の説明から商品一覧・詳細を経て、公式ショップへ進む案です。

• 黒×ゴールド
• 素材紹介
• 商品一覧

開く MIROX / VERSION 02 WHITESilica black.
Everyday care. MIROX / ブランドサイトの制作案

ミロックス — バージョン2（白）

白背景と細い罫線。ロゴが中央から上部へ移動し、写真の上ではカーソル付近が拡大します。

• 白ベース
• ロゴ演出
• 部分拡大

開く MIROX / VERSION 02 BLACKSilica black.
Everyday care. MIROX / ブランドサイトの制作案

ミロックス — バージョン2（黒）

黒背景と白いロゴでまとめた版。中央から動くロゴ演出、細い罫線、大きな商品写真の構成です。

• 黒ベース
• ロゴ演出
• 写真スライド

開く Scroll Movie Ryokan / 高級和風旅館

宿 湖凪 — 玄関ムービー版

スクロールに合わせてカメラが暖簾をくぐり、行灯の廊下を抜けて湖へ進みます。画像生成 → 動画生成 → スクロール連動の組み込みまで通した一本。

• 動画スクラブ
• 縦書き
• AI生成素材

開く Ryokan Ryokan / 高級和風旅館

宿 湖凪

暗く静かな和の世界。全画面ヒーロー、縦書き見出し、ワイプで立ち上がる写真。落ち着いた商品・教室・サロン系のLPの土台にも。

• 縦書き
• 明朝
• ワイプ表示

開く City Hotel City Hotel / 都心のホテル

ホテル カナデ

左端がエレベーターのフロア表示になっていて、スクロールすると今いる「階」が光ります。余白の多い上質なサービス紹介に向く型。

• フロアレール
• 横スクロール
• 夜景描画

開く Business Hotel Business Hotel / 駅前の実用ホテル

ステイ・クロス 湊北口

駅の発車標そっくりのお知らせバーが流れます。空室ボックス・料金カード・設備・FAQと、情報量で勝負する型。料金表やFAQのあるページ全般に流用できます。

• 発車標バー
• 料金カード
• FAQ

開く Pension Pension / 海辺の家族経営

ペンション しおさい

海辺の宿の大きなビジュアルから、客室と朝ごはんへ。写真風の画像とゆったりした余白で、親しみやすさと上質さを伝える宿のサイトです。

• 大きな写真
• 海辺の宿
• 上質な余白

開く Scroll Cinema Course / AI講座の制作案

2DaysAI講座

仕事に使う自信、人と向き合う余裕、自分の時間。5つの写真風の画像がスクロールで切り替わり、受講後に目指す姿から2日間の学習内容へつなぐ構成です。

• 5つの場面
• ベネフィット訴求
• 方眼ノート

開く Corporate Corporate / B2B 企業サイト

ツバメリンク（忠実再現版）

参考サイトを1画面ずつ分析して構造を寄せた版。ページ全面に波打つドットメッシュが敷かれ、ロゴが透かしで浮かびます。

• 波メッシュ
• 極太見出し
• カルーセル

開く Corporate Corporate / B2B 企業サイト

ツバメリンク（独自解釈版）

同じ会社を別の方向で設計した版。ロゴがドット化して旗のように波打ち、実績の数字がスクロールでカウントアップします。

• ドット旗
• 黄色アクセント
• カウントアップ

開く