DNAからデザインするブランディングとは？SHIFTBRAINさんとのオンライン勉強会「ZIDAMA NIGHT」開催レポート！

こんにちは、デザイナーのまべです。今年も折り返し地点に差しかかろうとしていますが、いかがお過ごしでしょうか。

僕はリモート＆自粛生活で淡々とした日々を過ごしています。毎日、仕事部屋への子どもの侵入をかわしながら、体調を崩すこともなく、わりかし元気にやっています。もう少し時間がたって、県をまたいで外出できるようになったら、自然のたくさんあるところへ行って滝壺にでもダイブしたいですね。

さて、去る5月14日にLIGのデザイナーユニットのクリエイティブ向上の一環として、クローズドのオンライン勉強会を行いました。今回はその模様をレポートします。

「ZIDAMA NIGHT」と名付けられた今回のオンライン勉強会では、以前から親交があり業界トップクラスの実績をもつSHIFTBRAIN（シフトブレイン）さんに、ブランディングや制作の進行の仕方などについてお話しいただきました。

本当は2月にLIG社内で開催予定だったのですが、言わずもがなの新型コロナウイルスの影響で延期。あらためて、オンラインでの開催になりました。

（ちなみにZIDAMA NIGHTという名前の由来は、今回のイベントを主催した二人の名前をもじったもの。LIGのディレクターZIMAさんとシフトブレインのアカウントプランナーDADAさんのニックネームをフュージョンさせています）

「ZIDAMA NIGHT」レポート

登壇者の紹介

今回登壇いただいたのは、アートディレクター/デザイナーの藤吉匡さん(左)と、同じくアートディレクター/デザイナーの宮本浩規（右）さんのお二人です。

（冒頭、今回のために制作された宮本さんの実績を紹介するリールビデオが流れ、そのかっこよさにメンバーのテンションも⤴️⤴️！）

案件について

勉強会では、5月に公開されたばかりの事例をご紹介いただきました。クリエイター（インフルエンサー）のプロダクションおよび広告・コンテンツ事業を展開する、BitStar社のリブランディング案件の裏側です。

BitStar（ビットスター）

コントラストの強いポップなイラストと、ロゴのロングドロップシャドウを落とし込んだ滑らかなアニメーションに思わず見惚れてしまう、こちらのWebサイト。
シフトブレインさんは、ロゴとタグライン開発から、Webサイトのリニューアルまでを担当されています。

コンセプトの設計

事前にLIGのデザイナーから集めた質問を「期間」「プロセス」「アニメーション」の項目に分け、案件を例に解説いただきました。

イベントの前半は、デザインに入る前準備から実際にデザインに落とし込むまでの流れを宮本さんにご説明いただき、藤吉さんには都度補足のコメントをいただく流れで進行。

個人的に印象に残ったのはデザインの前段の部分です。短期的な広告と違い、中長期的な視点が必要となるブランディング案件。制作する前に、じっくりと時間をかけ、いかにしてブレないコンセプトを作っていくかが、アウトプットのクオリティを大きく左右します。

シフトブレインさんの場合は、リサーチをしてからデザインに入る前に、DNA、PERSONALITY、PRINCIPLE、ESSENCEという4つの項目を決めていくそうです。

DNA（価値や強み）

まずDNAは、ヒアリングやリサーチから事業情報を整理し、ブランドの価値や強みを策定します。ここで決めた3つの要素が、すべてのアウトプットの軸になるそうです。今回の場合は「IMAGINATION」「RELIABILITY」「CHALLENGE」という3つのキーワードに決定しました。

PERSONALITY（人格）

次のPERSONALITYというフェーズでは、3つのワードを「人格に置き換えたらどういう行動を起こすか」を言語化していきます。

たとえば「IMAGINATION」であれば、「固定概念にとらわれない」「柔軟に物事を考える」というふうになります。

PRINCIPLE（デザイン原則）

そしてPRINCIPLEのフェーズでは、その3つのDNAをデザイン言語（ダイナミックやプレイフルなど）に置き換え、ムードボード（ビジュアルイメージを集めたボード）を作ります。

3つのDNAのバランスを検討した結果、これまで「RELIABILITY（信頼性）」だけが強く出ていたものを、今回のリニューアルではほかの2つをより前に出していく、という軸が決まりました。

ESSENCE（感じてもらいたい印象

さいごのESSENCEというフェーズでは、コピーライターさんが、ブランドを体験するときに感じてもらいたい印象を、包括する1ワードに落とし込みます。

これは「インフルエンサーファースト」というキーワードに決定。

まとめるとこのようになります。

リブランディング案件の場合、社長さんなどの経営層に直接説明をすることが想定されます。そういった経営層の方々は直感的な人が多く、言葉に対して鋭い感性を持っているので、言葉で詰めてコミュニケーションをしていくことが重要だ、と藤吉さんがおっしゃっていたのが印象的でした。

我々LIGでも、キーワードへの落とし込みはワークショップなどをとおして行なっていますが、それぞれのキーワードをどういったバランスで打ち出していくかというアプローチははじめてだったので、とても勉強になりました。

クリエイティブへの落とし込み

先述したフローを経て決まったキーワードをもとに、「ロゴ」「ビジュアル」「フォント」「写真」「Web」などのクリエイティブに落とし込んでいきます。

いくつか抜粋してご紹介いたします。

ロゴ

旧ロゴは社名（BitStar）から星の形をもとにしたデザインでした。新ロゴは、「スターってステージでスポットライトを浴びているイメージじゃない？」という意見から、テキストに光が当たっているロングシャドウデザイン採用。まだ見ぬスター（インフルエンサー）にスポットライトを当てていくという、会社の事業を見事に体現したロゴになっていますね。

※ CIやVIのコンセプトなどは、こちらにも詳しく載っています。
https://corp.bitstar.tokyo/hello_new_bitstar

ビジュアル

メインのビジュアルには、イラストレーターUtomaruさんを起用しています。「インフルエンサーファースト」というキーワードをもとに、さまざまなインフルエンサーが集まり、そこにスポットライトが当たっているビジュアルを作成。ロゴのデザインと連動させて、かなり強めの影がかかっているイラストに仕上がっています。ここにも一貫したコンセプトの強さを感じます。

フォント

今回はGothamという既存のフォントが使用されていますが、案件によってはフォントから制作することもあるそうです。

※ 実際こちらのFREAK’S HOUSEのWebサイトでは、FREAK’S HOUSE BOLDという、オリジナルのフォントを作られています。

アニメーション

 
ページの切り替えやマウスオーバーでロングシャドウが伸びていく演出がとても綺麗です。最初に作ったものと比較して見せてもらったのですが、最終形では真新しさやコンセプトとの連動性という点において格段にブラッシュアップされていて、とても興奮しました。

フロントエンドを担当された西山さんは、宮本さんから「光と影」というキーワードだけを聞いて、そのなかでいろいろとトライアンドエラーを重ねたそうです。その結果、とあるアニメからインスピレーションを受けて、このロングシャドウが伸びていくアニメーションを思いつき、実装に至ったそうです。すごい信頼関係ですね。。

ビジュアルにUtomaruさんをアサインできたとしても、このアニメーションを融合できるのはシフトブレインさんならでは。意匠を感じた瞬間でした。

裏話として、このサイトには隠しコマンドがあるそうです。トップページの一番下までスクロールし背景にうっすら出現するコマンドを打つと、また違うアニメーションが出てきますのでぜひお試しください。

もともとネタとして持っていたものを提案して採用されたのだそうです。尖ったアイデアだけでなく、技術力を使って柔らかい遊びができるのも、トップを走り続けられる理由なのだろうなと思いました。

質問タイム

後半の質問タイムでは、予定時間を超えていろいろな質問が飛び交いました。

「どういう要件で仕事が来るのか」「好みで選択されないようにするにはどういうコミュニケーションが必要か」「アニメーションの期待値を調整するには」など、ふだんデザイナーが抱える悩みに関する質問から、 「コストとスケジュールのバランスをどう取っているのか」「デザインチームとしてどういった方向を目指しているのか」のような、シフトブレインさんのカルチャーに関するものまで、さまざまな内容にお答えいただけました。

登壇したお二方以外のデザイナーさんからもお話が聞けたりと、とても有意義な時間になりました。

▲バックエンドのリョウタくんのマイクがすごい。

まとめ

個人的にブランディングにはとても興味があり、本を読んだりセミナーにも参加したりしていました。今回のシフトブレインさんとの勉強会も、独自のフローを知れたりしてとても興味深く聞かせていただきました。

我々クライアントワークを生業としているデザイナーにとって、アウトプットのクオリティがなによりの提供価値だと思っています。予算や時間という制約との戦いは常にあります。藤吉さんと宮本さんの言葉には、クライアントの期待値を超えるためベストを追求する、クラフトマンシップを感じました。

クリエイティブなカルチャー作りなど、社内でやるべきことはたくさんあると感じています。今回共有いただいたことをまずは小さいところから実践していき、より太い筋の通ったクリエイティブを作っていきたいと思います。

登壇いただいたお二方をはじめ、運営のみなさん、本当にありがとうございました！

今回もまったくユーモアがなくお送りしましたが、またお付き合いいただけますと幸いです！

LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。