2023.11.30

イベント

デザイン

【デザインの舞台裏】先日公開したLPのデザイン解説!

こんにちは、デザイナーのモリンガです。今回は制作を担当したLPのデザインについて解説をしていこうと思います!(初めてデザイナーらしい記事を書いているかもしれません!)

LPの概要

この度GMO hinataオフィスでは、クリエイター向けのインターンシップを開催することになりました!そこで概要をLPに集約し、バナー広告でLPへの入口を作ることが決まりました。このインターンシップの目玉企画は「現役クリエイターvsインターンシップ生」という異色のクリエイティブバトル!そこでこの目玉企画をアピールするため、対決をテーマとしたビジュアルの作成からインターンシップLPの制作がスタートしました。

制作メンバーは
企画・依頼:人事の皆様
デザイナー:モリンガ
フロントエンド:あまんちゅさん
です!

メインビジュアル制作

「対決」といえば
・戦国時代
・アメコミ
・格闘ゲーム
・西部劇…

まず「対決」という言葉から連想ゲームを繰り返し、戦国時代とアメコミの2案でメインビジュアルのたたき台を作ってみました。格闘ゲームを意識した案も作ってみたのですが、若い人に伝わるか微妙+身内ノリに走ってしまったのでボツにしました。南無…。

この2案から人事の方々に方向性を確認し、戦国のイメージで進めていくことに!

ビジュアルのポイント

このビジュアルは、中央に「軍配」を大きく配置し、背景色は赤と青で分けて対決感を強調しています。また、背景にはそれぞれ武将の姿が。青がGMO側のクリエイターで、手練れ感のあるシンプルな装備の侍。赤がインターンシップ生で、勢いがある猛々しい武者をイメージしています。

ページ全体のデザインへ

メインビジュアルが決まると、今度は原稿を元に情報整理情報の見せ方の検討が始まります。どの情報をどのセクションで伝えるか、言い回しは適しているか、話の流れは自然か、など…LPを上から下へ見る作業を繰り返しながら、自分なりに修正を重ねていきます。今回のLPに関してはセオリー通りのシンプルな見せ方で進めていきました。ここからはセクションごとのこだわりをご紹介します!

メインメニュー/ナビ

浮世絵などで描かれる「雲」をイメージ。メインビジュアルをダイナミックに見せるなどのWebデザインでは、ロゴのレギュレーション(背景の白色・余白の保持ルール)を守るのに毎回苦労します…。そんな折、この雲形メニューはかなり良いモチーフでした。LPのおかげで、ナビやメニュー周りの苦手意識が少し薄れたように感じます。

体験内容

このセクションの巻物が、このサイトで一番お気に入りの部分と言っても過言ではありません!あまんちゅさんにお願いして、巻物が開くようにしていただきました。本当にありがとうございました…!文字コンテンツのみのカードは見せ方のバリエーションが限られるので、そもそもカードの形で遊んでしまおうという案でした。

選考フロー

戦の地図をイメージしたビジュアルでまとめました。最初はもっと戦寄りで、①のフロー全部に旗を立てたり、配置がジグザグしていたり、筆で丸をつけていく動きがあったりとゴテゴテしておりましたが、削ぎ落としてシンプルに。ゴテゴテさせた後の削ぎ落とす作業は、結構時間が必要だなと改めて思いました。

ちなみにこのセクションとアクセスセクションに配置したイメージにもこだわりがあります。ひよこベアさんにいただいたアイデアなのですが、より宮崎感を強調するため②部分の山々の向こうに少しだけ海が見えるよう調整しました。宮崎の豊かな自然をぜひインターンシップに来た方々にも楽しんていただけたらと思います。

概要

一番概念に近い装飾になったのですが…お触れ書きと概要が似ているなと思い、立て札をモチーフにしたビジュアルにしました。応募している4職種は、それぞれ家紋風のアイコンを作っています。

苦戦したこと

情報の伝わり方と世界観の両立

今回のような自由度の高いLPはどうしても作り込みたくなりますが、情報が伝わることが最優先です。さらにLPだけではなくOGPやバナーなどの画像も担当させていただいたため、情報の伝わり方に気をつけました。設置される場所や画像がどのくらいの大きさで見えるかなどを考慮して画像たちを展開しました。

また、意図せずして色数が結構増えてしまったのですが、これは逆に賑やかさの演出に繋がったので良かったのかなと思います。怪我の功名ってやつでしょうか…!

文言の調整

依頼者からの原稿の文言をそのまま入れるのではなく、提案ベースで言い回しを変更したりしています。これが結構大変です。ご意見をいただいたり、アイデアに困った時にはAIに相談して案を出したり…世の中の制作物をご覧になる際は、ぜひ言い回しにも目を向けてみてください

今回のLP制作を通じて学んだこと

今回は結構タイトな制作時間だったのですが、そんな時に一番時間を食うのが「迷い」です。作りながら試す時間があまりないため、決め打ちな部分も多かったです。その「迷い」を打破してくれたのが、日頃のインプットでした。私はここ1ヶ月ほど「1日1サイトレビューする」という取り組みをこっそりしていたのですが、そのおかげでデザインの引き出しが少し増えていたように思います。高頻度でいろんなサイトをやデザインを拝見することや、日頃からいろいろな表現を試すことが大事だなと実感しました!

また「対決」から「軍配」というモチーフにたどり着けたことも迷いを打破してくれたように思います。デザイン以外の分野も幅広くかじっておくことで、意外なアイデアに繋がるのかもしれません。

一気に駆け抜けたLP制作でしたが、やり切れたことが自信に繋がりました!というわけで今までの小話を思い返しながら実際のLPをご覧ください!また次回お会いしましょう!

CREATORS CAMP | 25卒向けクリエイティブインターン

このインターンシップではクリエイターとして活躍するために必要な情報を社内の雰囲気を体験しながら経験できる内容です! コンテンツ内で現役クリ...

この記事を気に入ったら

モリンガ

モリンガ

2021年入社のデザイナーです。 絵と写真と焚き火が好きです。

この人が書いた記事を見る >>
カモメのアイコンTOP