WORKS DETAILランディングページ&サイト制作実績の詳細
「ランティングページ 成果を上げる100のメソッド」の書籍紹介用ページを制作
ランディングページ制作・改善の専門書「ランティングページ 成果を上げる100のメソッド(株式会社ポストスケイプ著/MdN発行)」を紹介するランディングページを制作いたしました。
![「ランティングページ 成果を上げる100のメソッド」の書籍紹介用ページを制作](https://conversion-labo.jp/wp-content/uploads/2018/03/book2_works2.jpg)
ランディングページのテーマ
書籍のコンセプト/テーマをシンプルに伝える
主にランディングページ改善の専門書として執筆したため、「本を読むことで得られる知識」を簡潔に伝えることを意識しました。本書のコンセプト説明から各章の内容へと繋げる形でシナリオを設計しています。実際の書面の一部を大きく配置することで、本書の具体的なコンテンツのイメージが湧くようにしています。
ランディングページのデザインコンセプト
- 書籍のイメージとリンクするメインビジュアルの策定
- フラットデザインを採用
- 5つのLPOプロセスをモチーフに5角形のパーツデザインで表現
- フォントサイズにメリハリをつけ、インパクトのある見出しデザイン
- 各章のイメージカラーと合わせた5つの配色設計
ランディングページのコーディング
- 高解像度ディスプレイで見ても要素が荒れて見えないコーディング
- 現在のスクロール量が分かるプログレスバーを画面上部に実装
- CSSのmix-blend-modeを使用したデザイン
- スクロールに応じて要素がフェードイン
- SVGを使用
カテゴリー | ランディングページ |
---|
ランディングページ&サイト制作実績
![ネット炎上・SNSリスクモニタリングサービスのランディングページを制作](https://conversion-labo.jp/wp-content/themes/conversion_lab_v3/images/common/works_loader.gif)
ネット炎上・SNSリスクモニタリングサービスのランディングページを制作
株式会社エルテスさまが提供する、ネット炎上・SNSリスクモニタリングサービスのレスポンシブランディングページをデザイン制作いたしました。
![中学生、高校生のためのITキャンプ「Life is Tech!」のサービスサイトを制作](https://conversion-labo.jp/wp-content/themes/conversion_lab_v3/images/common/works_loader.gif)
中学生、高校生のためのITキャンプ「Life is Tech!」のサービスサイトを制作
ライフイズテック株式会社さまが手掛けるシリコンバレーの教育法で学ぶ、中高生のためのIT教育プログラム“”Life is Tech!”のサイトを、サマーキャンプのLPに続き、デザイン制作いたしました。