【課題制作】LPデザイン制作(デザインカンプ・STUDIO実装)

OVERVIEW

SHElikesのデザイントレーニングプログラムの課題にて、AI議事録作成ツール「ラクギジ」のLPを制作しました。※課題に登場する企業、サービス、人物は全て架空のものです。 【制作期間:3週間/使用ツール:デザインカンプ→Photoshop・実装→STUDIO】

【制作物】

下記のURLより実際のサイトをご覧いただけます。

https://salmon303857.studio.site

【課題要件】

※課題に登場する企業、サービス、人物は全て架空のものです。 

◆サービスの概要
オンライン会議の音声を元にして、AIが会話内容を文字起こし・要約し、議事録を自動で作成してくれるサービス「ラクギジ」。簡単な設定で議事録作成の手間から解放し、仕事の生産性を大幅に向上させます。

◆目的
・サービスの特徴やメリットを伝え、サービスに関心を持ってもらい詳細資料をダウンロードしてもらう
・関心を持った人の情報(連絡先など)を入手して、個別に営業をかけられるようにする。

◆提供素材・情報
・サービスロゴ
・ワイヤーフレーム

【情報設計】

課題要件からサービスのターゲットと訴求ポイントを設定しました。

◆目的

  • LPを通じてラクギジを知ってもらい興味を持ってもらう
  • 資料をダウンロードしてもらう

◆このサイトを見にくる人物像

  • PCが得意な人、そこまで得意ではない人
  • AI議事録を導入したいと検討している人
  • AI議事録に興味はあるが使用した経験がなく不安感がある人

◆ターゲットに対して必要なアプローチ

  • あまり堅苦しいものではなくイラストなどを使って親近感を持ってもらう→不安感を取り除きラクギジに対してのハードルを少しでも下げてもらう

  • 瞬時に見たい情報が分かりやすくまとまっており閲覧するのにあまり時間がかからないもの→情報が箇条書きになっていて知りたいことがすぐ分かる


【デザインのポイント】

  • あまり堅くなりすぎず、かつ親しみやすさが表現できるようにアイソメトリック調のイラストを使用しラクギジに対してのハードルを少しでも下げてもらえるように意識しました。
  • メインカラーはビジネス感、信頼感が表現できるようにはっきりとした青色を選択し、ダウンロードのボタンや機能といった目立たせたい部分に青色の補色であるオレンジ色を使用しました。
  • 中間部分にあるCTAは、全てを読み終えた後にもう一度勧めることでダウンロードしてもらえる様に最後にもあえて配置しました。

【実装のポイント】

ノーコードツールSTUDIOにて実装しました。

  • FV部分は、ユーザーにまずは興味を持ってもらえるようにアニメーションを設定し動きのあるものにしました。あとはあまり多用せずそれぞれのタイトル部分のみに動きをつけ、読み進めても飽きが来ない流れを意識しました。
  • CTAボタンとフッター、ヘッダーのナビゲーション部分にはホバーを設定し、押せるボタンであると明確に伝えクリックへの意欲を高めて少しでも誘導できるよう工夫しました。

【スマホサイズのデザインカンプ】