ご提案資料

はじめに

この度はご覧いただきありがとうございます。
LUMO WEB STUDIO（ルモ ウェブスタジオ）の窓口担当です。
牧野先生の「分かりやすい説明 × 司法書士法人としての複雑案件対応力 × 受付9時〜21時・土日対応 × オンライン面談対応 × 大阪／奈良／京都／神戸の広域対応 × 中古住宅登記33,000円〜の明朗会計」という強みを軸に、
司法書士法人あやめ池事務所様 専用のサンプルサイトを制作いたしました。

サイト設計の意図

• カラー：淡いラベンダー（#E7E0F5）×ペールピンク（#FBEAEE）×ディープバイオレット（#5B3F8E・メイン濃色）×ペーパーアイボリー（#FAF8F5）×アクセントゴールド（#B89A57）。「あやめ池」の地名にちなんだ菖蒲（あやめ）の紫を主体に、士業らしい落ち着きとSaaS系HPのモダンな柔らかさをハイブリッドさせました。
• ナビゲーション：士業ルールに従い、完全日本語横並び（ホーム／事務所案内／業務のご案内／相続・遺言／不動産登記／成年後見／料金／ご依頼の流れ／コラム／お問い合わせ）。CTAボタンはピル型のグラデーションで現代的に。
• フォント：Outfit 400-700（モダンgeometric sans・英）＋ Noto Sans JP 400-700（読みやすい和文）＋ Shippori Mincho 600（士業らしさを残すアクセントのみ・h1ロゴ／キャッチフレーズの一部）。SaaS系のモダンタイプセットを基本に、士業の硬さを限定的に残すバランスです。
• イントロアニメ：「菖蒲（あやめ）の花がふんわり浮上＋フェードイン」→「fadeOut」→「司法書士法人 あやめ池事務所」テキストの3段階・2.7秒構成。クライアント固有モチーフ（菖蒲）を使用。sessionStorage `lumo-intro-played-ayameike-shiho` で同一セッション内は初回のみ再生。SKIPボタン・prefers-reduced-motion 対応。
• SaaS系モダン要素：グラデーションHero（lavender→pink）／グラスモーフィズム カード（backdrop-filter: blur 18px）／Statsカウンターセクション／取扱業務10領域のロゴクラウド風グリッド／4カラム multi-column フッター／IntersectionObserver fade-up／ヘッダーshrink ─ SaaS／スタートアップHPで一般的な要素を、士業の信頼感を損なわない範囲で取り入れました。
• 過剰演出は排除：マウス追従blob／3D tilt／magnetic多用／巨大タイポ80px以上／横スクロール多用／カウントアップ多用 等は司法書士HPには不適と判断し全廃。Heroタイトルは最大54px、h2は最大38pxに抑えています。
• 構成：ホーム／事務所案内／業務のご案内／相続・遺言／不動産登記／成年後見／料金／ご依頼の流れ／コラム／お問い合わせ の10ページ＋本提案資料の構成。
• 業界配慮（司法書士・士業共通）：「絶対に通る」「必ず◯◯できる」等の効果断定を排除。「税務相談は税理士の専門領域」「遺産分割で対立が生じた場合は弁護士の関与が必要」を明記しています。
• 価格表記：本提案資料の他サービス料金はすべて税別表記で統一しています。
  ※価格はすべて税別表記です

LUMOの他サービス

※価格はすべて税別表記です

LUMO WEB STUDIOについて

士業・建築・クリニック・整骨院・教室・アーティストを中心に、
小規模事業者の Webサイト制作を専門に行うスタジオです。
Cloudflareのインフラを活用し、表示が速く・運用が軽い・修正にもすぐ対応できる
小回りの効く制作体制を整えています。