オファーとストーリー
提供するもの、ページの対象者、訪問者に伝えるべきことを一緒に整理します。それをもとに、コンテンツの順序と各セクションの目的を決めます。
サービスランディングページ
ランディングページ
1つのオファーと1つのアクションを軸に構成する1ページ。3つのプランはページの構築方法が異なり、実績のある標準ブロックを使うものから、状態やインタラクションまで個別に深く作り込むものまであります。
1つのオファー。
行動につながる明確な導線。
オファーと訪問者にとっての次のステップが明確になるよう、コンテンツとビジュアルを設計し、Reactでランディングページを企画・デザイン・構築します。
オファーを
専用ページで伝える。
サービス、商品、キャンペーンには、明確な紹介、役立つ詳細、次のステップが必要です。それらを一つにまとめ、訪問者がオファーを理解し、次の行動を選べるページを作ります。
ページ全体を一つの主な目的に沿って構成します。各セクションでオファーを説明し、関連する疑問に答え、合意したアクションへと導きます。
複数のサービス、独立した情報ページ、相互につながる訪問者の導線をお考えの場合は、Webサイト制作をご覧ください。
ランディングページに
含まれるもの。
ページに求める役割に合わせて、メッセージ、ビジュアルの方向性、動作するページを一体化します。
一貫したビジュアルの方向性
画像、書体、色、コンテンツを一つにまとめます。Liteでは実績のあるブロックを調整し、SKARRとSKARR.PROでは個別にデザインした構成を使用します。
動作するReactページ
デスクトップとモバイル向けにページを構築し、画面サイズに応じてレイアウトと動作を調整します。3つのプランすべてにReactでの開発が含まれます。
次のアクションを明確に
合意したボタン、フォーム、インタラクションを実装します。予約、決済、その他の外部サービスとの連携は、プロジェクトの作業範囲に応じて個別に定義します。
確認と公開準備
さまざまな画面サイズでページを確認し、合意した訪問者の導線を見直して、含まれる修正を完了します。公開に向けた準備について、お客様と取り決めます。
ページをたどる
興味からアクションまで。
EPILMOODのメインページでは、サービスの提案、補足情報、予約への導線がどのように連携するかをご覧いただけます。このページは、より大きなWebサイトの一部です。
EPILMOOD。
明確な流れのあるページ。
冒頭でサービスを説明し、予約へと案内します。ページを下に進むと、施術情報と段階的な流れが示され、訪問者は次に何があるかを理解できます。
構成、デザイン、Reactでの実装を担当しました。このページは大規模なWebサイトの一部です。ここでは、1ページで訪問者をサービスの提案から次のステップへ導く方法を紹介しています。
ページを見る動作するページ。
明確な次のステップ。
合意したコンテンツ、レスポンシブレイアウト、動作する機能を備えた、React製のランディングページをお届けします。
選択したプランによって、提供するデザイン素材が決まります。公開時のアクセス、インフラ、継続的な作業については、プロジェクトごとに取り決めます。
あなたの
サイト
サイト
- React
- レスポンシブ対応
- 最適化
- インタラクション
- SEOの基本
- デザイン
サービスの提案から
完成したページまで。
ビジネスの背景を共有し、重要な判断をしていただきます。 私たちはお客様とともにページを構成し、デザインして、実装します。
01
サービス内容を理解する
ターゲット、利用可能な素材、目指すアクションについて話し合い、コンテンツ、作業範囲、個別作業のレベルを決定します。
02
ページを構成する
コンテンツの流れとビジュアルの方向性を定めます。合意したデザインを開発する前に、ページでサービスの提案がどのように伝わるかをご確認いただきます。
03
Reactで実装する
合意したナビゲーション、フォーム、インタラクション、連携機能を含め、ページを動作するレスポンシブなインターフェースに仕上げます。
04
確認して公開準備を整える
訪問者の導線を一緒に確認し、含まれる修正を完了して、合意した公開に向けて完成したページを準備します。
完成ページは1つ。
作業の深さは3段階。
どのプランも、動作するReactページをお届けします。アプローチ、作業範囲、作業の深さを比較してください。
| 項目 |
Lite
テンプレートを活用したデザイン。コンテンツを支える確かな基盤。
$899
一括払い
Liteを購入
Stripeによる安全な決済 |
SKARR
オーダーメイドのページデザイン。独自のビジュアル言語。
$1,499
一括払い
SKARRを購入
Stripeによる安全な決済 |
SKARR.PRO
体験全体をより深く、細部まで設計。あらゆる接点で。
$1,899
一括払い
SKARR.PROを購入
Stripeによる安全な決済 |
|---|---|---|---|
| アプローチ | |||
| デザインの進め方 | デザインの進め方 実績あるブロックを、コンテンツ、色、選択したビジュアルの方向性に合わせて調整します。 | デザインの進め方 個別のスタイルと、サービスの提案に合わせたセクション構成。 | デザインの進め方 プロジェクトに必要なコンテンツ、構成、細部をさらに深く検討する個別デザイン。 |
| 構成とコンテンツ | 構成とコンテンツ 標準的なブロック構成を使った、明確なページ構成。 | 構成とコンテンツ お客様の目的に合わせて作成するコンテンツとセクションの順序。 | 構成とコンテンツ 合意した作業範囲内で、ストーリー、訪問者の導線、主要セクションをさらに深く検討します。 |
| ビジュアルの方向性 | ビジュアルの方向性 複数の方向性をご提示し、選ばれた案を発展させて調整します。 | ビジュアルの方向性 選択できるビジュアル案は3案です。それぞれの案に含まれる内容は、作業開始前に確認します。 | ビジュアルの方向性 3つのビジュアル案をさらに深く検討します。それぞれの案に含まれる内容は、作業開始前に確認します。 |
| 動作するページ | |||
| セクション数 | セクション数 7セクション。 | セクション数 12セクション。 | セクション数 合意したシナリオの範囲内で、セクション数は無制限。 |
| 実装と動作 | 実装と動作 レスポンシブ対応のReact実装、標準ブロックの動作、基本的なSEO、アクセス解析。 | 実装と動作 レスポンシブ対応のReact実装と、ページに必要なインタラクション。 | 実装と動作 レスポンシブ対応のReact実装。必要に応じて、より細かなカスタムインタラクションや状態を追加します。 |
| 連携 | 連携 選択したブロックに標準で用意されたアクション。必要な連携は作業開始前に確認します。 | 連携 複雑なシステムを伴わない、合意済みの連携。 | 連携 合意した作業範囲に含まれる連携と複雑なシナリオ。 |
| 成果物と修正 | |||
| 納品内容 | 納品内容 動作するWebサイト。Figmaファイル、ソースファイル、デザインシステムは別途納品しません。 | 納品内容 動作するWebサイトと、お客様独自のビジュアルスタイルを反映したFigmaファイル。 | 納品内容 動作するWebサイトと、必要に応じてさらに発展させたデザインシステム。 |
| 修正回数 | 修正回数 1 | 修正回数 2 | 修正回数 4 |
着手する
前に。
どのような素材を用意すればよいですか？
サービスの提案、ターゲット、ブランド素材、用意できるテキストや画像を共有してください。不足しているものを確認し、必要なライティング、編集、画像制作について合意します。
LiteにもReactは含まれますか？
はい。3つのプランすべてに、動作するReactページが含まれます。Liteでは標準ブロックを調整して使用し、SKARRとSKARR.PROでは、より個別性の高い構成と細部の作り込みが可能です。
Figmaファイルとソースファイルは受け取れますか？
Liteでは、別途のFigmaファイル、プロジェクトのソースファイル、デザインシステムを含まず、動作するサイトを納品します。SKARRにはFigmaファイルが含まれ、PROでは必要に応じて、より充実したシステムを提供します。正確な納品内容は合意のうえ決定します。
ページを予約や決済につなげられますか？
ページに必要な連携についてご相談いただけます。SKARRでは複雑なシステムを伴わない合意済みの連携に対応します。より複雑な連携には、PROで作業範囲を明確に定める必要があります。
ホスティングや公開後の変更はどのように扱いますか？
公開前に、ドメイン、ホスティングの担当範囲、アクセス権、公開準備について合意します。継続的なサポートや公開後の変更は、別途作業範囲を合意します。
まだご質問がありますか？
ランディングページについて相談する