エイチームが運営する「Qiita」では、2019年12月に綿貫が専任デザイナーとして加入して以降、デザインチームを中心に、サービスのブランド価値を高めることに注力しています。
2012年から長期間運営されているエンジニア向けのサービスということもあって、求められる当たり前の基準値は高く、その基準を超えたプロダクト・表現になるように、デザイナーとしてこだわりを持って取り組んできました。
歴史があるサービスということに加えて、ユーザーはエンジニア中心なので、求められる当たり前の品質基準は高い。
Qiitaにおけるブランド価値を、なぜ高める必要があると判断したのか。そして、どのように高めてきたのか。デザイナーとして取り組んできたことをまとめます。
エイチームのサービス全体にも関わる話ですが「そもそもこの事業においてブランドに注力することが有効かどうか？」という経営判断を必ず行うようにしています。
そして、Qiitaにおいては「エンジニアを最高に幸せにする」というミッションから考えて、ブランドに注力する必要があると判断しています。
Qiitaは、エンジニアに関する知識を記録・共有することができるサービスです。
サービスの対象がエンジニアだからこそ、当たり前に見られる品質の基準値は高く、だからこそブランドづくりに注力する必要がありました。
例えば、以下のような点は、Qiitaのブランドをつくるために投資すべき点だと考えています。
よくある見た目にならないよう、UIフレームワークではなく、内製でUIはつくる
エンジニアが関心を持ちやすい、コードの品質にまでこだわる
インフラとして見てもらえるよう、アクセシビリティにまでこだわる
エンジニアに受け入れられやすいクリエイティブ
ただ、Qiitaには、2019年12月までは専任のデザイナーがおらず、ブランドへの投資は必要だけどやれていない状態でした。そのため、綿貫が専任デザイナーとして加入したタイミングで、改めて注力することとなりました。
Qiitaでブランドづくりに注力する、と決まってからは、デザインチームを中心にできることは何でもやっていくように動いています。
あえて言語化すると、Qiitaのブランドづくりの範囲は、以下のようにまとめられます。
Qiitaにおけるブランドづくりの役割は、エンジニアの価値観から、品質の基準をつくり、接点に落とし込むことです。
クリエイティブなどの表現面はもちろん、プロダクト内のUIやコードなども、Qiitaにおいてはブランド価値を高めるために重要な要素だと位置付けています。
例えば、コードの品質や、アクセシビリティなども、ブランド価値を高めるためにカバーすべき範囲。
ブランドづくりは、デザイナーが中心となりながら、全社で取り組んでいます。
Qiitaのデザイナーの体制は、現在6名です。2019年12月に1人目の専任デザイナーとして綿貫が参画、2020年4月に2人目のデザイナーとして出口が加わり、以降も拡大しています。
ブランド価値を高めるために、Qiitaで一番重視しているのは「ユーザにとっての当たり前の基準を捉えていくこと」かもしれません。
例えば、綿貫がQiitaに参画してすぐに、Qiitaのデザイナーはこういうスタンスで動きます、というドキュメントをまとめました。
これは要は、「ユーザーに価値を提供できないものを作っていてはダメだよね」というのを言い直しているようなドキュメントです。
デザインデータ上の見た目にだけ責任を持ちます、というのではなく、ユーザーが実際に触れる画面や、その裏側にあるコード単位での品質にこだわっていくことが、特にエンジニアを相手にしたサービスでは必要だろう、という基準を宣言しています。
また、エンジニアの考え方を肌で分かっていくために、エンジニアがよくやる行動は積極的にやるようにしましょう、という考え方がチームに浸透しています。
例えば、エンジニアはよくドキュメントにナレッジをまとめているので、それは当たり前に自分たちもやっている方が良いだろう、ということで、コードレビューやUI制作フローなど、積極的にドキュメントに残しています。
エンジニアの価値観を理解するために、エンジニアがよく行うことは自分たちも積極的に行うようにしている。
さらに、デザイナーとしても、Qiitaでドキュメントをまとめて発信することを心がけています。
このような行動の積み重ねで、ユーザーが求めている当たり前の基準を肌で知ることができ、チームの中でも「それは当たり前に満たすべきでしょ」という雰囲気ができています。
Qiitaでは、ユーザーにとって受け入れられやすい基準をもとに、Qiitaらしい表現をデザイン原則としてまとめています。
特徴としては、「信頼」「ポップ」のような抽象的なイメージではなくて、「幾何図形」「集合・パターン」のようにできるだけ具体的に指針を示すようにしていることです。
原則の時点で、具体的な要素に落とし込んでいるので、制作において「これはQiitaらしいんだっけ？」というところで議論になる場面はあまり見られません。
また、これらの定義は、エンジニアに受け入れられる要素から逆算して考えています。
もう一つの特徴としては、あえて定義は文言に留めて、視覚的なアセットは用意していないことです。
これは、人数的にも過去の制作物などを見返すことができるので、あまり必要性を感じていないという面もあるのですが
文字だけでまとめることで、変にクリエイティブが固定化されずに、新しい表現ができる余白が生まれやすくなるというメリットもあります。
例えば、Qiita10周年記念の特設サイトをつくった時は、デザイン原則を踏まえつつ、新しい要素を追加したクリエイティブに落とし込みました。
10周年という特別なタイミングだったため、普段とは違うクリエイティブの要素を入れ込んでみたいと思い、まずは「Qiita」「10周年」にまつわるキーワードから発散を行いました。
結果として、「コミュニティ」「人が集まる」「つながり」など要素を組み込むことに。
デザイン原則の要素は必ず意識するようにしつつ、人やコミュニティがつながる、という新しい要素を入れたことで、今までのQiitaとは違うユニークな表現にすることができました。
特別な機会なので、デザイン原則を踏まえつつ、意図的に「街並み」などの新しい要素を加え、遊びを持たせるように
他にも、同じようなプロセスで、Qiitaらしさを良い意味で外したクリエイティブをつくっています。
あくまで幾何形態などはベースにしつつ「集合させてみる」「メタボール的な変形をさせてみる」など、少しだけエッセンスを追加
デザイン原則という土台がしっかりある上で、一要素だけを追加・変更する分には、同じブランドを感じてもらえて、かつ新しさを感じてもらえるだろうと判断しています。
Qiitaにおいて、世の中に公開されるクリエイティブなどの表現面だけでなく、プロダクトの中身(UI、コード、アクセシビリティ)なども品質として見られる部分です。
これらの品質を高めるため、デザイナーが中心となって、チームに対して働きかけています。
例えば、UIレビューはもちろん、コードの品質までレビューをしています。
ユーザーにとって分かりやすく、管理されているコードにするために、コードの品質までレビューをしている
他にも、Figmaデータを作る時点で、マークアップがほぼ完了するところまで意識してUIをつくっています。
マークアップ完了まで意識してUIをつくる
また、UIをつくる段階で、インタラクションやフロントエンドの仕様まで定義しています。
UI段階で、インタラクションや、フロントエンドの仕様まで定義
先日、ダークモード対応も行いました。費用対効果は正確には測りづらい施策ですが、多くのユーザーが強く求めていたことから、取り組む意思決定をしています。
エンジニアを対象にQiitaというブランドを築くためには、ここまでやらないと意味がないと思っています。
ブランドに投資すると決めた以上、もはや気づいてくれるかも分からないし、意味があるかも分からないことでも、やれることは何でもやる意識でやっていきたいと思っています。
ブランド価値を高めることに力を入れた結果として、「このカラーリングやテイストを見るだけでQiitaを思い出す」「イベントのサイトなどがかっこよくて、それも参加のモチベーションになる」といった声をユーザーの方からいただけるようになりました。
そして、Qiita社内からも、取り組みを通してブランドに関する意識が高まっています。
最後に、Qiitaに関わるデザイナーとしての目線をまとめます。
Qiitaにおけるブランド価値を高めるための取り組みは「矜持に近い領域までやる」と決めています。
Qiitaは、ユーザーが当たり前に求める基準値が高いサービスです。デザイナーはこの基準を超え続けられるよう、ユーザー像を捉え、クリエイティブの幅を超えて、品質を高め続けるような意識で常にいる必要があります。
ただ、Qiitaのデザインチームの中では、今回まとめたような取り組みは、意識しているというより、すでに「当たり前」になっています。
側から見て「そこまでやるの？」という、矜持に近い領域まで、とことんこだわる。その繰り返しがブランド価値を高めていくのだと信じています。
