デザイン・ブランディングについて何も分からないCEOが60時間でやったこと
Jamm橋爪です。
「なにもできないCEO」シリーズ第二弾として、自分のデザインに関する取り組みについてご紹介いたします。（第一弾の「コードが一行も書けないCEO」編はこちらになりますhttps://note.com/sho_hashizume/n/n6d711226960d ）
自分はデザインについてド素人なので、取り組む前に「自分が起業する際に知ってたら助かった最低限のデザイン知識」というテーマで書いております。
Jammでは副業デザイナーの方にサポートいただきながら進めており、プロにサポートしてもらう金銭的余裕がある人はお願いしたほうがいいと思います。
ただお金が潤沢にない初期スタートアップの場合はデザイナーを雇えないこともあるかと思いますので、そんなCEOが「最低限切り抜けるためのガイド」として読んでいただけたらと思います。
（専門家ではないので、間違った情報も多分あるかと思います。ご了承ください。）
解きたい課題：日本のプロダクトのブランディングいまいち問題
日本で生活していてよく感じるのが「ブランディングいまいち問題」です。
もちろんGoさんやParkさんの手がけるような素晴らしいブランディング・デザインもあったりするのですが、「このブランディングいまいちだなー」と往々にして思うことがあります。
自分の中で「どのようなブランディング・デザインがいまいちなのか」の基準として、自分は「サービス名 隠し」を行って判断してます。
1. サービスページに行く
2. 片目を閉じて、サービス名を自分の手で見えないようにする
3. その会社の競合のサービス名が記載されていることを想像する
4. 競合のサービスのサイトでも違和感がなければ、アウト
ドン・キホーテさんのサイトですが、この一番上のロゴがマルエツとか成城石井に置き換わってたら、なんか違和感ありますよね。
「やりすぎだろ。成城石井の情熱価格」。想像するだけでも変です。
…ってことはドンキのサイトではブランディングがうまくできている、と自分は判断してます。
自分の会社が「ブランディングいまいち」というレッテルを貼られるのは避けたいので、今回色々取り組んでみました。
まずBrand Identityを作る (10~20時間くらい)
最初からFigmaを触ってはいけません。
創業期においてMission, Vision, Valuesは作ると思うのですが、Brand Identityも一緒に作る人は少数派な気がします。どんなプロダクト・ブランドにしていきたいか一度言語化することによって、今後のPRだったり、プロダクトデザインを担当する人と上手く連携することができるので、策定することをおすすめします。
書き出したのは以下です：
・Naming and Origins
・Brand Mission and Vision
・Target Audience
・Brand Personality
・Product Benefits
・Brand Attributes and Values
・Brand Proposition
・Brand Tone vs Competitors
・Brand Promise and Experience
量として、最低限それぞれ10ブレットずつ書き出せばいいと思います。多分急いだら二週末くらいでいけます。
特にやってよかったのは、競合の分析です。機能的なところは把握していたりするんですが、対外的なコミュニケーションだったり、プロダクトから受ける感覚的な部分について書き出してみると、面白い発見があったりします。
ロゴ作り（最低2~3週間、自分の時間はほぼ0）
生成AI等使ってサクッと作ってもいいかもしれません。
ここは自分でやるのは絶対無理なところなので、潔くプロにお任せしましょう。ただ、Brand Identityがない限り絶対しっくりくるロゴが作成できないので、先に書き出してから内容をデザイナーに共有することをおすすめします。
スタートアップは時間との勝負です。色んなデザイン案を作成してもらうと時間がかかってしまうので、方向性A, B, デザイナー自由におまかせ Cの三択くらいでスケッチを書いてもらって、その中から一つの方向性を選んで進めました。全部デジタルな形でドラフトを作成してもらうと時間がいくらあっても足りなくなります。
最低限のDesign Systemを作る（40~60時間くらい）
Figmaの操作方法を理解する
Udemyで10時間くらいのFigma入門コースを購入して、通勤中に見ることをおすすめします。通勤時間にもよりますが、2週間あれば見れるでしょう。1500円くらいでした。
Color Paletteの作成（20時間くらい）
ここからめちゃくちゃ辛いのですが、Color Paletteを作成します。「こんな色の会社にしたい！」みたいなイメージがあると進みやすいです。自分みたいにセンスがない人は潔くプロにお願いしましょう。
実は一番自分が迷ったのが「Color Paletteを作る際のアウトプットはなんなのか？」でした。どうやらいろんな流派があるらしく「メイン1色、サブ1色、アクセント1色、エラー1色、後はグレースケールだけ揃えたらOK」っていうMaterial Design(≒Google) と、Appleのように「使いそうな12色とりあえず色々取り揃えました！」みたいなタイプもあり。
結局自分はApple式に全色選びましたが、簡単に進めるならMaterial Designのテンプレをコピペして、3色選べばOKだと思います！
後はグレートーンを10色くらい設定して完了です。
ただグレーに関してもpure grayにせず、ちょっと別の色を混ぜる選択肢もありますが、エキスパートではない方の場合潔くpure grayにして、時間を短縮しましょう。
（各種参考資料はNote下部に添付してます）
Dark Modeの沼（設定する場合更に+10時間）
C向けのアプリを開発する人の場合、早めに「Dark Mode対応したい！」みたいなケースもあるかと思います。
Dark Modeで採用する色もこれまた流派があるみたいでして…
どうやらGoogleは彩度を下げて見やすくする、Appleはそれより見た目重視！みたいな感じに自分は解釈しました。
（詳しくはlinkを貼ったnoteに解説されています）
うちはDark Modeの色どうしよう… どの方向で行くべきか… って悩んでる内に5時間くらい経ってしまうので、ファウンダーの皆さんは気を付けてください。
フォント選び（10時間）
これまた沼 of 沼なので、ロゴの隣に置いたり、Mission/Visionをそのフォントで書いてみたりして、しっくりくるか確認するのを永遠に繰り返しました。
これまた成果物の正解が分からなかったのですが、とりあえずHeader 1~4, Body S/M/L/Micro, Buttonの9スタイルを定義しました。Header 5が必要になったら付け足せばいいので、「Done is better than perfect 」の精神でガンガン進めましょう。
多分なんか間違ってます。
ここでもいくつも流派がでてきて困りました。始める前に知りたかったことは以下です。
・HeaderとBodyのフォントを一緒にする派の人と、別にする人がいて、どっちが正解か分からない（どっちでもいいっぽい）
・Line Heightを設定すべき（2行になった時に行間が変になる。固定や%とかあるが、自分は固定で設定）
・Letter Spacingも設定すべき（fontによっては間隔があきすぎる）
・日本語フォントはMacとWindowsで入っているフォントが違うので困る（自分はWindowsを使っているので、デザインに向かない… Mac/Windows共通フォントってのがあるので、それを使えば一旦OK）
結論：めちゃくちゃ大変。でも大事。
副業デザイナーの方のサポートもいただきながらも、試行錯誤しながらググりつつ進めたので、かなり時間がかかってしまいました。
ただ自分でも少し時間を使った分、デザイナーの方にかなりロゴに時間を割いていただくことができたりもして、非常に満足の行くブランディングアセットができあがりつつあります。
餅は餅屋ですが、そうはいかないのも、スタートアップの醍醐味の一つではないでしょうか。
良く分かんなくてもガンガン進めましょう。
以上新米ファウンダーの橋爪でした。
各種参考資料
こちらMaterial Design (Google) とAppleの資料です。
Material DesignとAppleのFigmaはこちらに公開されてます。
Color Paletteがどんな雰囲気になるかイメージできる便利なサイト
Dark Modeに関して詳しく書いてあったnote
Dark Modeのグレースケールについて
他社フォント設定の参考資料
英語のFont選びに使ったサイト
Mac/Windows共通日本語フォントについて
この記事が気に入ったらサポートをしてみませんか？