制作サンプル / シフトリー
シフトリー|SaaSのサービスサイト・LP
架空のシフト管理 SaaS を想定して制作したサンプルです。機能を並べる前に読み手が自分の業務を思い浮かべられるよう、「Excel と LINE の往復」という具体から入り、そこから機能へつなぐ順序で構成しました。
概要
- 種別
- サービスサイト / SaaS
- 想定した業種
- シフト管理 SaaS(多店舗の飲食・小売・介護向けを想定)
- 想定した対応範囲
- 構成設計 / ワイヤー / デザイン / 実装 / 計測設計
- 使用技術
- Next.js(App Router), TypeScript, Tailwind CSS, Vercel
- ページ構成
- トップ(LP) / 機能 / 料金 / よくある質問 / 資料請求
- 想定した制作期間
- 4週間
画面


想定した課題
- 機能一覧が先頭にあり、何を解決する製品なのかが伝わらない
- 料金が問い合わせ後にしか分からず、比較検討の段階で候補から外れてしまう
- 申し込みフォームの項目が多く、入力途中で離脱されやすい
コンセプト
機能より先に、自分の業務を思い浮かべてもらう
冒頭を「シフト作成の3時間を15分に」という結果の提示から始め、その根拠を課題 → 機能の順に並べる。管理画面のイメージを実寸に近い形で載せ、導入後の姿を文章より先に見せています。
社内で回覧されることを前提にする
BtoB の SaaS では、意思決定に複数の人が関わります。料金とセキュリティを独立して読めるセクションに置き、担当者が上司へそのまま転送できる形にしました。
掲載しているのはすべて、架空の企業・店舗を想定して制作したサンプルです。実際に受注・納品した案件ではありません。記載している課題・コンセプト・制作期間は、同じ規模のサイトをお受けする場合の想定です。
同じような構成のご相談
構成の考え方や費用感について、この画面をお見せしながらご説明します。まずはご連絡ください。
contact@soracodeworks.com