• Web

株式会社ニューロベイス

制作領域:UI/UX|デザイン|イラスト|フロントエンド | 資料作成

株式会社ニューロベイス様の新規サービス「Cucom」の紹介用サイト・資材を制作しました。
「Cucom」はBtoBビジネスを行う企業様に向けた、“オリジナルの自社アプリを簡単に導入できる”というコンセプトのサービスです。

▼依頼内容
下記2つの案件をセットでご発注いただきました。
・サービス紹介用のLP制作
・営業用のPowerPoint資料制作

以下、まずはLPの制作内容からご紹介します。

▼WF
本案件で特に意識した点は、どのサイズでも崩れないレイアウトです。
BtoB営業の方がターゲットなので、様々な場所・端末で見る可能性を考慮し、タブレットなどの変則的なサイズでも美しく見えるように制作しました。

基本となるサイトの構成と文言案はクライアント様からご支給いただいたため、それらをベースにWFを組みました。
その際はただ流し込むだけではなく、より獲得を増やすという視点で、下記のようなご提案も行いました。
・ユーザー目線でわかりにくい文言をリライト
・要素の順番の入れ替え
・情報の区分けや強弱づけ

単純に並べると同じようなレイアウトが続いてしまうため、カラム数やテキスト量などを調整することで動きを出し、細かいところまで飽きずに読んでいただけるようなページを目指しました。

▼トンマナ
ご依頼時点ではまだサービス自体が開発中だったので、開発用の資料やブランドロゴのレギュレーション資料などをご支給いただき、そこからLP用のトンマナを作っていきました。

まずはいただいた参考サイトとこちらで集めた他社LPを分析し、大まかな方向性を策定。
その後デザインのラフを3パターン展開し、よりイメージに近いものをご選択いただきました。

選ばれたパターンから簡素なガイドラインを作成し、デザインを細かく作成していきました。

▼デザイン
LP全体のレイアウトなどを行うデザイナーと画像作成などを担当するデザイナーの二人体制で制作を行いました。
連携して効率よく制作できるように、作業にはXDの共同編集機能を使いました。

デザインの中で特に工夫した点は、FVのレスポンシブ対応です。
ユーザーの興味をひく大事な領域なので、各デバイス幅で綺麗に見えるかどうかを逐一確認しながらデザインいたしました。

▼実装
ブレークポイントを細かく設定し、サイズが縮まるときの挙動などを丁寧に擦り合わせたことで、実装上でもしっかり再現することができました。

今回は主にコーディングのみを行い、サーバーへの実装作業やフォームの繋ぎ込みなどはクライアント様の社内でご対応いただきました。

▼営業資料
LPの制作が終わった後、続いて営業用資料の制作に移りました。
こちらも叩きとなるスライドデータをご準備いただいたので、内容はそちらをベースにして、弊社では情報整理やビジュアルの磨き込みを行いました。

トンマナは先に作ったLPのものを転用し、ブランドとしての統一感を演出しています。
営業先の企業様に信頼感を持ってもらえるよう、整然として読みやすく、スタイリッシュな資料にすることを目指しました。


今後の更新運用のことも考慮し、基本的にはほぼ全てを可変テキストで組みました。
グラフなどの図表も画像化せずにPowerPointの機能を用いて作成しました。
やむなく画像化した一部イラストなどについては、aiデータをお渡しし、クライアント様の方でも修正できるようにフォローいたしました。

自社アプリ導入サービス「Cucom」紹介LP