口コミ検索フォーム
（他のページと同様のアンケートページの下に「口コミ検索」を追加したページです。そのため上部のコンテンツは割愛しております。スクロールしてご覧ください。）
-
初めての定期便は不安ですよね…
まずは一足お先にご使用の皆さんの声を聞いてみてください！
全体のスクリーンショットと説明文はこちらです
このページについて
口コミ検索風機能付きLPです。
LPの最後に、口コミ検索フォームを追加したページです。
＊実際のページは以下の理由のため掲載することができないため、ポートフォリオ用に再制作したものです。
- SNS広告からのクッションページで、期間限定である
- ローカルデータを派遣先会社へ納品し、サーバーへのアップは社内の方が行うため、URLがわからない
- 社内規定により、クローズドなポートフォリオであっても社外に制作物を公開することが禁止されているため
制作時間：約18時間（コーディングのみ。実際は約25000px長ほどのLPです。）
CTA部分の最後に、不安払拭を目的として、この口コミ検索風コンテンツがある形のページです。
そのため、この部分の正確な制作時間ではな（CSS(Sass)でのスタイリングも含みます）
制作経緯：
派遣先のディレクターさんから、オファー画像の後にユーザーの不安を払拭する目的で、
簡易的なアットコスメのような口コミ検索を入れたいとのことで、ディレクターさんの構成案を元に制作いたしました。
実際にユーザーが投稿してデータベースから抽出するようなものではなく、
あくまでLP上で、ディレクターさんが構成したいくつかの口コミを掲載する、というものです。
ポイント：
・イラスト部は、ファイル名に付けた枝番によって、奇数/偶数で2種類の画像を表示するようにしました。
・星（★）の部分は、JavaScriptで自動生成するようにしました。JSONファイルでは整数で記載し、
その数値の分だけ、「★」マークを生成するコードです。
・HTMLファイルが冗長で複雑になってしまうことと、リリース前にクライアント様からの修正や、
リリース後にもディレクターさんがPDCAを回してテキストを修正することも多いことから、
該当箇所を探さずすぐに修正ができるよう、口コミのデータ（ユーザー名、評価（星の数）、
コメント内容）をJSONデータにし、JavaScriptで呼び出す形で制作しました。
（後に、このページをWordPressに移植したいということになり、その際は、JSONが使えない（サーバーへのアップが権限上できないため）ため、
配列にしたJSファイルを作成して対応いたしました。）