KD Web制作 見本

サイトと、その裏で動く仕組み(フォーム・通知・台帳・更新・監視)を一式で作っています。 以下はすべて架空の店舗の見本で、実在の店舗・団体とは関係がありません。 写真は Pexels の素材です(実際の案件では現地撮影を工程に含みます)。

店舗サイト

船宿「海祐丸」千葉・南房総/世界観A 夜明けの深場(紺 × 黄)

出船中バナー、月カレンダー、釣果速報、乗船者名簿(遊漁船業法)。

民宿「汐見荘」千葉・千倉/世界観B 炭と生成り(明朝 × 生成り)

空室カレンダー、献立の投稿、宿泊者名簿(旅館業法・令和5年改正に対応)。

美容室「hair salon 凪」千葉市稲毛/世界観C 霧と真鍮(ゴシック細字 × 余白)

空き状況カレンダー、スタイル投稿、カウンセリングシート。 スクロールに合わせた動きを入れています(外部ライブラリなし・動きを減らす設定を尊重)。

動きは3段階から選べます(同じサイトのまま切り替わります): 標準 ・ 控えめ ・ 動かさない
選んだ設定はその端末に残ります。お使いの端末が「動きを減らす」設定のときは、指定に関わらず動きません。

SUP体験「海あそび舎 かぜまち」千葉・鋸南町/世界観E 朝凪と珊瑚(白 × 深い青緑 × 珊瑚)

本日の催行・中止の行、この先7日の空き、中止の基準(風と波の数字・判断する時刻)、参加者名簿と参加申込書。 丸い写真の入口と丸いボタンで、既存の4件と形でも見分けがつくようにしています。

採用サイト「ミナト事務パートナーズ」千葉市の事務代行会社/世界観D 紙と朱

求人媒体に頼らず、自社で応募を受けるための1枚。仕事の中身・一日の流れ・募集要項・応募フォームまで1ページに収めています。 応募は通知と台帳に流れ、求人検索に載るための構造化データ(JobPosting)付き。

裏で動く仕組み

KD DECK店主用の管理画面(スマホ)

今日の状況、2層カレンダー(空き ○△満休 / 営業・休業の確定)、 写真の投稿、予約台帳、名簿の印刷。保存すると自動でサイトに反映されます。 要 店舗キー店舗ごとに鍵が分かれています。

お客様が事前に書く申込書ログイン不要・印刷とPDF保存に対応

当日の受付を短くするための事前記入。郵便番号から住所が入ります。 店側は同じ内容を法定様式の名簿に自動で流し込めます。

フォーム → 通知 → 台帳標準部品

送信を受けると、店主へ即時通知が飛び、同時に台帳へ記録されます。 迷惑送信対策と送信元の制限が入っています。

参考庫(制作用・社内向け)

同業と隣接業種のサイトを巡回し、余白・文字サイズ・色を数値で実測したものです。 意匠の丸写しはせず、数値と構成の傾向だけを参考にしています。