LP制作実績紹介
手描き動画アニメーション講座LP
使用ツール
担当
制作時期
制作期間
：
：
：
：
Photoshop、HTML/CSS
LPデザイン、実装、広告用バナー作成
2024年8月
5日間
｜
制作概要
目的
事業内容
対象者
依頼概要
掲載／広告
：
：
：
：
：
手描き動画アニメーション無料5日間講座集客LP
オンライン講座
Webデザインスクール受講者向け（女性ターゲット）
※既存顧客向けの新規企画
やってみようと一歩踏み出したくなるサイト作成
広告なし／会員サイトに掲載募集
｜
依頼内容／ご要望
・
・
ターゲットである女性に響くデザイン・訴求
手描き動画アニメーションを連想できるようなイラストを使用したデザイン
｜
デザインの説明
「手描き動画アニメーション制作」と聞いて、イラスト等のイメージはつくかと思います。ですが、実際にこの講座を受けるとどんなことが得られるのか（サービス内容）を伝えるのは“文字”でしかない。だからこそ、イラストは配置しながらも、文字主体になるデザインで制作しました。
｜
デザインプロセス
1. ヒアリング／制作内容の確認
事前にランディングページに入れたいテキスト原稿をいただいたうえでの制作開始。前提条件である、Webサイトの目的やターゲットユーザーについて、また他確認事項もヒアリングしながら進めました。
2. 競合リサーチ／思考の深掘り
手描き動画アニメーションと同じような競合リサーチを行ったり、イラストを仕事にしている業種業界のサイトを調べたりしてみました。イラストをお仕事にしたい女性の気持ちを深掘りしたり、実際のアニメーションの効果を調べたりもすることで、リピートだからこそより一層改善したLP作成ができました。
3. ファーストビューの提案
ランディングページで最初に表示されるファーストビューは、手描き動画アニメーションを連想しやすい、且つ、ターゲットの女性にも気軽にチャレンジできるような明るい暖色で全体デザインを制作。
Webサイトに訪れたユーザーがそのページを読み進めてもらえるかどうかは、このファーストビューにかかっています。だからこそ密なヒアリングと思考の擦り合わせが重要になってきます。
4. ページ全体のデザイン制作
上記段階でデザインの方向性やコンセプトの擦り合わせを行うことで、それに基づき制作を進めていきました。サービス内容がじっくり理解しやすいような文字組を意識して制作。また実際に講師の先生にイラスト支給をしていただき、セクションのタイトル付近にイラストを挿入したりもできました＾＾
5. チェック＆修正
実際にクライアントにもチェックしていただき、ヒアリングを重ねることでより結果成果につながるLP制作に繋げることができました。
6. 実装
HTMLとCSSを用い、画像化コーディングをベースに実装。申込フォーム部分やフッター等に関してはテキストで実装を行いました。
7. 納品完了
HTMLファイル上のフォーム修正や細かい修正と最終調整を行ない、HTML /CSSファイルとして納品しました。
8. 納品後の対応
納品後も、広告運用の進捗の確認や集客結果などについてもヒアリングさせていただきました。また今回は、自身もこの無料セミナーに参加することで、ユーザーの目線でどう見えるのかも体感することができました！
｜
わたしの思い出制作ストーリー
私も所属しているスクールの講師募集ということもあり、実際に講師の先生方や卒業生ともたくさん関わらせていただく制作となりました。実際に原稿を読み進めると、講師の先生方がいかに私たち受講生のためにと奮闘してくださっているのかを感じることができました！！個人的に…このファーストビューデザインすごく気に入ってます♡笑
｜
依頼者様のご感想
制作を進めていただきありがとうございました。
最後まで読んでいただき、ありがとうございました！
そして、ご依頼してくださったクライアント様にも感謝感謝です！！今後も末長く事業のサポートやユーザーの方とのご縁を繋げられたら…と考えております！