TOP / テンプレート

30 DIRECTIONS / 5 MOODS

30の出発点から、
あなただけのサイトへ。

全30種類、どれもTOP・紹介・サービス詳細・利用案内の4ページで組んだテンプレートです。テーマごとの文章、料金例、写真、利用の流れ、FAQは、仕上がりを想像するための見本。ページを行き来して方向性を決めたら、ここからあなたの事業の言葉と写真に置き換え、あなただけのオリジナルに育てていけます。

カードを押すと、そのデザインの実物を全ページ見られます。見るだけの画面なので、押しても何も作られません。

全30件を5つの方向で分類しています。

01シンプル

情報を削ぎ、内容をまっすぐ届ける

余白、罫線、タイポグラフィを中心にした構成。士業、医療、採用、声明など、理解の速さを優先したいサイトに。

6
極細罫と余白読みもの型
SPACE / WORDS / FORM

少ないほど、 よく伝わる。

一つの言葉、一枚の写真。その間にある余白まで設計します。

極細罫と余白シンプル

極細罫と大きな余白で、言葉を静かに読ませる

AI PHOTO静かな左官壁とオークの椅子をしつらえた設計室

得意
思想・プロフィール
構成
宣言 → 背景 → 余韻 → 作品
読みもの型額縁リズム 静
白黒の極太文字読みもの型
WORDS BEFORE DECORATION

伝えるべきことを、 大きく。

色に頼らず、文字の強弱と配置だけで見せる。声明、企画、キャンペーンに。

白黒の極太文字シンプル

白黒・極太文字・角のある構成でコピーを主役に

AI PHOTO金属の活字とローラーを備えた活版印刷工房

得意
声明・採用
構成
全面写真 → 理念 → サービス4列 → 案内カード → お知らせ → バナー
読みもの型大型タイポリズム 強
青緑と大きな文字信頼獲得型
HERE TO HELP

困ったときに、 思い出せる場所へ。

受付時間、相談方法、アクセス。必要な情報が迷わず見つかります。

青緑と大きな文字シンプル

清潔な青緑と大きな文字で初めての不安を減らす

AI PHOTO木と淡い緑で整えた明るいクリニック受付

得意
初診案内
構成
キャッチ → 写真の帯 → 診療の一覧 → 案内の札 → よくある質問 → お知らせ → 来院のご案内
信頼獲得型額縁リズム 整
黄の紙と明朝読みもの型
ALMANAC

季節のはじまりに、 一本ずつ。

月に二度、この土地で起きたことを記録しています。

黄の紙と明朝シンプル

黄の紙に明朝。季節ごとの更新を読ませる

AI PHOTO季節の枝と写真プリントを置いた読みものの机

得意
記事回遊
構成
縦書きの開幕 → 一行ずつ現れる文 → 縦書きの紹介 → 核のカード → 枠 → 写真カード → 差し色の帯 → 全面写真 → 縦書きの見出しと写真 → 番号カード → ボタン
読みもの型額縁リズム 緩
生成りと緑の地図組み地域案内型
WALKABLE

歩いて、 七分。

駅から歩ける距離にあります。行き方と、目印になるものを先に書きました。

生成りと緑の地図組みシンプル

生成りと緑。歩いて回れる範囲を案内する

AI PHOTO緑に囲まれた歩道と小さな街の店

得意
来店案内
構成
道順 → 品物 → 続ける理由 → 営業 → 地図
地域案内型左右分割リズム 静
基本の4ページ基本の4ページ
A SMALL BEGINNING

はじめの一歩を、 一緒につくる。

小さな事業の言葉と形を整えるデザイン室です。

基本の4ページシンプル

紹介・サービス・相談までそろった、4ページの基本デザイン

AI PHOTO静かな左官壁とオークの椅子をしつらえた設計室

得意
事業紹介・相談受付
構成
紹介 → サービス → 進め方 → 相談
基本の4ページ左右分割リズム 整
02やわらか

人柄と手ざわりを近く見せる

丸い輪郭、温かな色、ゆったりした写真。サロン、工房、宿、ケア、暮らしに関わる仕事に。

6
温もり明朝とクリーム来店案内型
GOOD MORNING

今日の余白を、 このテーブルで。

焼きたての香りと、やわらかな朝の光。いつもの一日を少しだけ特別に。

温もり明朝とクリームやわらか

温かな明朝体とメニュー中心の、招き入れるデザイン

AI PHOTO朝日が差すカフェのクロワッサンとコーヒー

得意
来店・メニュー確認
構成
空気 → メニュー → 写真 → 営業案内
来店案内型左右分割リズム 緩
珈琲色とフィルム写真物語型
MADE BY HAND

手から生まれる、 小さな違い。

素材を選び、道具を整え、仕上がりを待つ。工程そのものが価値になる構成。

珈琲色とフィルム写真やわらか

珈琲色とフィルム写真で工程や素材を物語にする

AI PHOTO陶芸工房のろくろで器を成形する手元

得意
制作背景・販売
構成
縦書きの開幕 → 一行ずつ現れる文 → 縦書きの紹介 → 核のカード → 枠 → 3 つの円 → 写真カード → 差し色の帯 → 全面写真 → 縦書きの見出しと写真 → 番号カード → ボタン
物語型フルカバーリズム 緩
土色と不揃いな写真物語型
OBJECTS WITH A STORY

暮らしに残る、 手のしごと。

土、布、木、金属。素材が持つ表情を生かして、日々の道具をつくります。

土色と不揃いな写真やわらか

土色と不揃いな写真で、素材と制作風景を近く見せる

AI PHOTO赤土色の織物と素材見本を並べた工房

得意
工房・受注制作
構成
手触り → 工程 → 作例 → 相談
物語型左右分割リズム 緩
淡いピンクと丸い写真体験訴求型
A GENTLE PLACE

ほっとできる、 あなたの居場所。

初めてでも緊張しない。やさしい言葉と表情で迎えるサービスサイト。

淡いピンクと丸い写真やわらか

淡いピンクと丸い写真で安心感を先に届ける

AI PHOTO淡い桃色と青の丸い家具を置いた相談室

得意
初回相談・安心
構成
安心 → 流れ → 人柄 → 料金 → FAQ
体験訴求型左右分割リズム 緩
緑青と円い写真商品カタログ型
BOTANICAL SELECTION

植物のちからを、 暮らしのそばに。

香り、手ざわり、使い方。商品を選ぶ時間まで心地よく整えます。

緑青と円い写真やわらか

透明感のある緑青と円形写真で商品を柔らかく比較

AI PHOTO葉脈の美しい植物と種子を並べた植物スタジオ

得意
商品比較・注文
構成
気分 → 商品一覧 → 選び方 → 素材 → 注文
商品カタログ型額縁リズム 緩
丸い書体と広い余白学びの場型
SMALL CLASS

うまくなるより、 続くことを。

1クラス6名まで。自分の段階から始められる、少人数の教室です。

丸い書体と広い余白やわらか

丸い書体と余白で、通いはじめの不安をほどく

AI PHOTO木の学習机と本棚が並ぶ明るい小さな教室

得意
体験申し込み
構成
安心 → クラス → 料金 → 質問 → 体験
学びの場型左右分割リズム 緩
03シック

写真と空気で価値を感じさせる

深い色、明朝体、抑えた装飾。作品、空間、限定サービスなど、説明前の印象を大切にするサイトに。

6
侘び色の縦の間物語型
MA / LIGHT / CRAFT

静けさの中に、 確かな手を。

削ぎ落とした空間に、素材と技の存在感を置きます。

侘び色の縦の間シック

侘び色と縦の間合い。技と哲学をゆっくり語る

AI PHOTO障子の光と一枝の花がある現代和室

得意
世界観・指名予約
構成
間 → 由来 → 一品 → 予約
物語型縦ラベルリズム 静
淡いローズの明朝体験訴求型
PRIVATE SALON

自分をいたわる、 静かな時間。

一人ひとりのために整えた、予約制のプライベートな体験。

淡いローズの明朝シック

繊細な明朝と淡いローズ。予約までを優雅につなぐ

AI PHOTO淡いローズ色と曲面鏡で整えたプライベートサロン

得意
美容予約
構成
理想 → 体験 → 料金 → 声 → 予約
体験訴求型大型タイポリズム 緩
深紫と金来店案内型
BY APPOINTMENT ONLY

特別な時間を、 あなたのために。

限られた席、選び抜いたもの、細やかなサービス。予約前から始まる体験を。

深紫と金シック

深い紫と金色、限定感を演出する上質な予約導線

AI PHOTOプラム色のベルベットと真鍮で整えたラウンジ

得意
限定予約
構成
余韻 → 体験 → 空間 → 料金 → 予約
来店案内型フルカバーリズム 静
ワイン色の大胆な切り抜き作品主役型
NEW COLLECTION / 26

纏うものに、 意志を。

コレクションの世界観を大きな写真と短いコピーで伝えます。

ワイン色の大胆な切り抜きシック

深いワイン色と大胆なトリミングで商品を主役に

AI PHOTO深い赤のドレスが映えるファッションブティック

得意
商品閲覧・購入相談
構成
新作 → ルック → 素材 → 価格 → 相談
作品主役型ポスターリズム 強
墨と金の縦の間合い予約・滞在型
ONE GROUP A DAY

何もしない日を、 用意しました。

一日一組だけ。到着してから朝の見送りまで、他のお客様と顔を合わせません。

墨と金の縦の間合いシック

墨と金、縦の間合いで一日一組の静けさを伝える

AI PHOTO庭園を望む旅館の畳の客室

得意
宿泊予約
構成
景色 → 過ごし方 → 献立 → 料金 → 予約
予約・滞在型フルカバーリズム 静
淡紅と明朝の一点並べ商品カタログ型
SELECTED OBJECTS

たくさん置くより、 説明できる物を。

誰が、どこで、どうやって作ったか。答えられる物だけを並べています。

淡紅と明朝の一点並べシック

淡紅と明朝で、一点ずつを丁寧に並べる

AI PHOTO生成りの布に並ぶ表情の異なる陶器

得意
商品を選ぶ
構成
気分 → 並び → 選び方 → 価格 → 相談
商品カタログ型額縁リズム 緩
04にぎやか

動きと熱量で参加を促す

強い色、大型文字、コラージュ。イベント、教室、コミュニティ、新しいプロジェクトの告知に。

6
原色コラージュ作品主役型
MAKE SOME NOISE

普通じゃない。 だから、覚えてる。

色も形も大きく使う。作品とアイデアを前面に出すポートフォリオ。

原色コラージュにぎやか

原色・図形・コラージュで視線を奪う大胆な一枚

AI PHOTO原色の立体作品を展示する現代アートスタジオ

得意
作品閲覧・依頼
構成
作品 → 実績 → 制作思想 → 依頼
作品主役型フルカバーリズム 強
赤と太罫のレトロ地域案内型
SINCE 1986

いつもの味を、 いつもの場所で。

変わらない安心と、今日のお知らせ。地元のお店に必要な情報を前へ。

赤と太罫のレトロにぎやか

懐かしい赤と太い罫線。営業案内がすぐ見つかる

AI PHOTO赤白の日よけと木の入口がある街の食堂

得意
地域来店
構成
営業状況 → 定番 → 店内 → 地図
地域案内型フルカバーリズム 動
ライムと特大文字告知・募集型
HELLO, NEW DAY

はじまる。 ここから変わる。

新規オープン、メンバー募集、新しい挑戦。今伝えるべきことを大きく。

ライムと特大文字にぎやか

ライムと特大文字で開業・募集・新企画を告知

AI PHOTO透明素材と明るい色で設えたポップアップストア

得意
新規告知・募集
構成
告知 → 日程 → 魅力 → 参加
告知・募集型ポスターリズム 動
黄色と巨大文字告知・募集型
SAT 10.24 / OPEN 10AM

食べる。聴く。 まちで遊ぶ。

一日限りのマーケットと音楽。日時、場所、参加方法を一気に伝えます。

黄色と巨大文字にぎやか

黄色と巨大文字、動く帯でイベントの熱量を届ける

AI PHOTO柑橘色の旗と花が彩る屋外マーケット

得意
イベント参加
構成
日時 → 出演 → 見どころ → 会場 → 参加
告知・募集型ポスターリズム 動
重なる形とコーラル活動・交流型
CREATE TOGETHER

一人では見えない、 景色をつくろう。

プロジェクト、ワークショップ、オープンデイ。活動の現在地が見えるサイトです。

重なる形とコーラルにぎやか

重なる形と活動ログで人が集まる空気をつくる

AI PHOTO珊瑚色の椅子を円形に並べた共同制作スタジオ

得意
活動参加
構成
現在地 → 募集 → 活動 → 日常 → 場所
活動・交流型フルカバーリズム 動
ネイビーと大きな写真枠活動・交流型
EVERY SECOND SATURDAY

第二土曜、 港に集まる。

出店16組、見学自由。はじめての人が入りやすい市をつくっています。

ネイビーと大きな写真枠にぎやか

白とネイビー、大きな写真枠で人の流れを見せる

AI PHOTO海辺の広場に並ぶ白いマーケットテント

得意
参加・出店
構成
開催日 → 参加 → 活動 → 会場 → 連絡
活動・交流型フルカバーリズム 動
05知的

複雑な情報を構造で信頼に変える

グリッド、数値、工程、読みもの。法人サービス、テクノロジー、専門家、メディアに。

6
漆黒とシアン信頼獲得型
SYSTEMS / DESIGN / DELIVERY

複雑を、 動く形へ。

戦略から実装まで。数字と成果で信頼をつくる、シャープなサービスサイト。

漆黒とシアン知的

漆黒にシアン、実績を強く見せるテクニカルな構成

AI PHOTO夜景に面したシアンの光が灯る技術スタジオ

得意
法人相談・信頼
構成
開幕 → 全面写真 → 章01(貼り付く見出しと重なる写真)→ 章02(貼り付く左帯と流れる写真)→ 章の行 → 全面写真の題名と重なるカード → お知らせ
信頼獲得型大型タイポリズム 整
白とネイビーの整列信頼獲得型
CLEAR & RELIABLE

わかることから、 安心は始まる。

専門的な内容を、短い言葉と明快な順序で。初めての相談を迷わせません。

白とネイビーの整列知的

白とネイビーで、説明・実績・FAQを整理する

AI PHOTO白い船縁から望む澄んだ海と島々

得意
サービス理解
構成
約束 → 支援内容 → 実績 → FAQ
信頼獲得型左右分割リズム 整
ライラックの誌面読みもの型
JOURNAL / ISSUE 01

問いから、 仕事を始める。

結論を急がず、観察し、考え、言葉にする。読みものとして届くプロフィール。

ライラックの誌面知的

雑誌のような間と引用で、考えや活動を深く伝える

AI PHOTOラベンダー色の紙と写真プリントが並ぶ編集机

得意
記事回遊・購読
構成
全面写真の開幕 → 散らした写真と文 → 導入と目次 → 項目ごとの紹介 → FAQ → お問い合わせの帯 → コラム → 大きな英字の帯 → About → News
読みもの型左右分割リズム 整
コバルトのグリッド信頼獲得型
PLAN / BUILD / SCALE

構想を、 前に進める。

複雑なプロジェクトを整理し、判断できる形に。BtoBの信頼を明快に伝えます。

コバルトのグリッド知的

強い青と構造的なグリッドで企画やサービスを端正に

AI PHOTO青いガラスの立体模型が並ぶ白いデスク

得意
B2B問い合わせ
構成
成果 → 機能 → 方法 → 不安解消
信頼獲得型左右分割リズム 整
黒と蛍光の速度帯告知・募集型
BUILDING THE NEXT

未来は、 待たずにつくる。

新しいプロダクト、研究、コミュニティ。動いている熱量をそのまま伝えます。

黒と蛍光の速度帯知的

黒と蛍光色、速度感のある帯で先端性を押し出す

AI PHOTOアシッドグリーンの光が差す光学研究室

得意
プロダクト参加
構成
状態 → 指標 → 仕組み → 更新 → 参加
告知・募集型フルカバーリズム 強
青焼きの線と方眼チーム紹介型
PLAN / BUILD / HAND OVER

決めた理由まで、 渡す。

誰が何をするか、何を選ばなかったか。進め方そのものを見せるチームのサイト。

青焼きの線と方眼知的

青焼きの線と方眼で、計画そのものを見せる

AI PHOTO白い建築模型と青い図面を広げた設計スタジオ

得意
制作の依頼
構成
進め方 → 実績 → 体制 → 相談
チーム紹介型ポスターリズム 整
§01
WHAT CHANGES

構図と情報の順番まで、
一つずつ設計しました。

見本の下に「得意」「構成」「AI写真の方向」を明記しました。各写真は業種、色温度、文字を置く余白まで個別にディレクションし、編集画面の最初から利用できます。

VISUAL世界観に合わせた構図と写真

雑誌、映画、台帳、献立、展示、診療案内など、主役になる情報から写真と誌面を変えました。

STRUCTURETOPから下層ページまで

紹介で背景を知り、詳細で内容と料金を比べ、利用案内で次の行動を決められる構成です。

SYSTEM作り込むための土台

構造は固有でも部品は共通です。文章、写真、順番、配色を編集画面で入れ替え、ページもブロックも足していけます。

START30種類すべて、4ページの見本つき

基本デザインにも本文と写真を用意。選んだあとは、見本の文章と写真を自分の事業の内容に置き換えるところから始めます。

YOHAKU OS / DESIGN KNOWLEDGE 02

選ぶときも、つくるときも、
5つの軸で品質を保つ。

01目的

第一画面で、予約・相談・閲覧・参加のどれへ導くかを一つ決める。

02構造

業種に必要な証拠を先回りし、セクションの順番そのものを変える。

03構図

写真、文字、数値、一覧の主役をテンプレートごとに変える。

04編集

完成形は差し替えて使え、全ブロックは公開前に再編集できる。

05品質

スマートフォンで読み順を保ち、色以外の形とラベルでも意味を伝える。

YOHAKU OS / AI PHOTO DIRECTION

01用途が一目で伝わる被写体

02見出しを置ける意図的な余白

03テンプレート配色とつながる色温度

04実在感のある素材と自然な光

§02
PAGES

選んだあとも、
育てていけます。

追加用のページ型は7種類。必要な情報を、必要になった時点で足せます。公開したあとは、表示・速度・安全・検索をAIが見守り、気づいたことを修正案と一緒にお知らせします。

私たちについてメニュー・料金お知らせアクセス・連絡先ブログ一覧ブログ記事空白ページ
つくりかたの手順を読む AIによる管理・監視を見る

NEXT

選んで、1行だけ変えてみる。

保存も公開もしなくて大丈夫です。まずは編集の感触を確かめてください。