Spectrum版 minneのブランドを反映したイラストができるまで
この記事は、Spectrum Tokyo Design Fest 2022 でお話しさせていただいた内容をふりかえり用にまとめたものです。 元ネタは以前公開した「minneのブランドを反映したイラストができるまで」の記事になりますが、「ブランドとは」「さらに具体的な検証内容」「何かを描写する際のコツ」など、過去記事では触れきれなかった内容を盛り込んでいますので、進化版としてお楽しみいただけると嬉しいです！
こんにちは。GMOペパボ株式会社の「minne」というサービスでデザイナーをしている sziaoreo です。minneのブランディングとアートディレクションを行っています。
minneとは？
minneは、国内最大級のハンドメイドマーケットです。
アクセサリーやファッションアイテム、インテリア雑貨などだけでなく、食品や時を超えた技術が詰まったヴィンテージのアイテム、さらなるものづくりを促す素材や、手作りキットなどが売り買いされています。
そして自分の手だけでつくることはもちろん、一部の工程で生産ラインを利用しても、ものづくりにこだわった背景や想いあれば、minneはそれを「ハンドメイド」と呼んでいます。
しかし、minneで行われていることは作品の売買だけではありません。
「好き」をわかりあったり、刺激を受けたりして、また新しい「好き」を見つける。多様なハンドメイドを通じて人と人の間にコミュニケーションが生まれています。
そこにいる人々がいつもよりもクリエイティブに、自分の好きなものに素直になれるような場所。それがminneの考える「ハンドメイドマーケット」で、常に新しいアイディアの発信や自己実現が行われる創造の場です。
「ブランド」について少しおさらい
ブランドとは、そのサービスや商品が、ユーザーや世間に対して「こんな体験や価値を提供しますよ」と宣言し、実現する約束。
そしてその約束を想起させるあらゆるデザイン・言葉などの記号と体験のこと、またそれらがリンクしている状態のことを言います。
またそのブランドを作り浸透させること、すなわちブランディングとは、記号と体験をリンクさせることを言います。
ブランディングはなぜ大切？
これには大きく分けて３つの理由があり、またステップになっています。
❶体験の一貫性を作ることができるから
ブランドをきちんと言語化すると、自分達が価値をどのように提供するべきか、どのような姿勢を見せ続けるべきなのかが見えてきます。それは企画や開発を行うときの道しるべとも言えるもので、「こういう時どうしたらいいんだっけ？」と迷うことが少なくなります。
つまり、ブランドがチームに浸透・活用されることで、より迅速に一貫性のある体験を提供できるようになります。
❷資産になるから
体験の一貫性が生まれると、そのブランドをきっかけに認知や理解が生まれます。味も値段も同じオレンジジュース、無名の会社のものと有名な会社のものだったらきっと後者を買う人が多いですよね。
よいブランドとして知られていることは、より選ばれやすくなるということなので、これは素晴らしい資産を持っていることと同じなんです。
❸複利をうむから
「複利」とは、「利益がさらに利益を生む」状態や仕組みのこと。
ブランディングによって生まれた資産は、その場での成果だけでなく、「今回このサービスを通してこんな体験ができたから、きっと次も同じ体験ができるはず」という期待を持ったリピート、長期的な成果にもつながります。
期待に応えることでユーザーの中に作られる「良い体験を約束してくれるサービス像」は、資産になるだけでなく、ユーザーの次のアクションを促す複利になります。
そしてブランドが資産であるなら、もちろん運用が必要です。
ブランドを資産として運用し複利とするためには、作ること、活用するサイクルが大切で、両方行って初めて「ブランディング」になります。
minneのブランド
minneはものづくりの可能性を広げることで、好きなものを作ったり、探したり、出会いを重ねて自分の人生をより自分らしく生きることを肯定しています。そして皆が創造的になれる世界を作ろうとしています。
しかし特に日本では、まだまだものづくりやハンドメイドという概念に対して「手芸っぽいアマチュアじみたものしかない」「女性らしいものしかない」「アクセサリーや雑貨のような小物しかない」といった偏ったイメージが根付いています。
本来ハンドメイドとは多様性に満ちたもので、自分の好きなものや自分らしい選択とは何かに気づける可能性があるはずなのに、世間の人々がそれを見出しづらい状況にあります。
その状況を変えるために、minneはハンドメイドの多様性ある姿をアピールしている最中です。
「minneの中にはあなたのこだわりにかなうものや活発で多様なハンドメイドの姿がたくさんありますよ！」「新しいアイディアやクリエイティビティに出会えますよ！」
minneという名前を聞いたとき、このようなイメージを想起してもらうために、ブランディングを行っています。
具体的にどのようなことをしていたかというと、
デザイナーが主体となってドキュメントを用意したり、説明会を行ったり、チームのマネージャーとともにminneのブランドについて理解を促す活動を行ってきました。
また、ブランドをより効率的に活用するためにデザインシステムを用意しています。カラーパレット、テキストを考える際に言葉の揺れを防ぐminneの言葉辞典、外注先にブランドを理解してもらうためのデザインガイドラインなど。
この大きなブランディングの流れの中で、以下のようなイラストアセットを制作し、現在minneのさまざまなタッチポイントで活用しています。
ではここから具体的にどのような課題に対して、どのような考え方でこのイラストにたどり着いたかをお話ししていきたいと思います。
元のイラストが抱えていた課題
以前まではこのようなイラストを使用していました。4年前、まだminneが今のブランディングを始める前に私が作ったものです。
このイラストが抱えていた課題は大きく分けると２つです。
1つ目は、minneのブランドに沿わないこと。
minneのマーケットは可愛らしいものだけの世界ではないはずなのに、幼さを感じる、可愛さに偏っています。また真面目すぎでお堅い印象があり、さらに顔はついているのに人間らしい感情を感じず、どこか人形っぽくもありますね。
たくさんの人の活気、自由な創造性で溢れているminneの姿を伝えることが難しい状態でした。
２つ目は、イラストとして使いづらいことです。
顔も体も正面を向いているため作れるポーズの幅が少なく、表現できるシーンに限界があります。シーンを演じているようなぎこちなさがあったり、必要以上に目が合う印象も与えます。
minneの中ではたくさんの人と人、人ともののコミュニケーションがあるはずですが、その様子を表現しづらい状態にありました。
ブランドを反映した４つの要素
これらの課題を改善すべく、人間のイラストを大きく分けて４つの要素に分け、ブランドを少しずつ反映していきました。
❶ 頭身のバランス
生き物は頭が大きい状態で生まれ、大人になるにつれて頭の割合が小さくなっていきます。
生き物を描くとき、頭身が少なくなれば幼く、可愛らしい印象になりますから、元のイラストの幼さにはまずこの頭の大きさのバランスにも要因があるのでは無いかと考えました。
ハンドメイドに対する「アマチュア、素人っぽい」などのイメージを払拭するために、minne自体が洗練された印象や多様なハンドメイドを表現していく必要がある中、「可愛い、幼い」に偏った元のイラストはブランディングと逆行していますよね。
そこで元のイラストを用いて足の長さや頭の大きさの検証を行い、7頭身のバランスで人間を描写することにしました。
❷ 顔の向き
顔も体も正面で固定してしまったのが「使いづらさ」の大きな要因でした。以下のようなオペレーターによる「お困りの際はこちらから」と、ユーザーに対して具体的にコミュニケーションを取りたいシーンでは、目を合わせて語りかけるような表現は有効です。
しかしminneの中ででイラストを使いたい時は、ユーザーに直接語りかけるというより、minneの中にあるシーンを想像させる役割を担う方が圧倒的に多かったんです。
顔を横にしたことで再現できるポーズの幅が広がり、その場にいる人間同士の関係性やオブジェクトへの興味関心を描きやすくなりました。
❸ 体の輪郭
元のイラストでは幾何学図形をベースにした直線的なボディラインにより、どこかお堅い印象を与えていました。しかしminneでのハンドメイドの世界はもっと自由で、ユーザーの新しいアイディアに満ちています。
その自由さや発想の柔軟さを、肉付きの緩急や関節の存在を抑えたしなやかな体のラインに落とし込んで表現しました。
以下は当時実際に書いていたラフですが、同じポーズで同じ仕上がりのラフでもラインの取り方だけで受ける印象が変わります。
以下は主に肩のラインについて検証していた時のラフです。
肩のラインが滑らかになるだけで、少し体の力が抜けたような、垢抜けた印象になります。
今回のイラスト制作では、ものづくりやハンドメイドそのものの姿の多様性を表現することが主な目的だったので、体型や大人子供の体の書き分けは行っていません。また男女で体のパーツを分けずに使えるよう、ユニセックスな姿になるように心がけています。
このように有機的でしなやかななラインをベースにしたことで、思わぬメリットがありました。
元のイラストでは制作の属人化を防ぐため、人間を全て幾何学図形で構成しようとしていました。パーツの組み合わせ方のルールを記載しておけば再現ができると思ったんです。
しかしそれに限定してしまった故に逆に制作の手間がかかり、アラやズレが目立ちやすい…パスを整えるのに精一杯でどんなシーンがふさわしいかという点にフォーカスしづらく、クオリティも上がらなくなってしまいました。
新しいイラストでは有機的な要素を多く取り入れたことで多少腕が伸びようが、顔が大きくなろうが、極端でなければ「人としての自然な個性」に見えます。「あそび」「少しのゆるさ」を許容できるイラストになったことで逆に属人化を防げるようになりました。
❹ 体の輪郭
新しいイラストでは表情は描かず、ポーズや周囲の状況設定でその人物の感情やアテンションを表現しています。
また「コントラポスト」の考え方をを少し取り入れています。
「コントラポスト」とは、体重の大部分を片脚にかけて立っている人を描いた視覚芸術を指す用語です。ダヴィデ像やミロのヴィーナスなどをみるとわかりやすいですね。片足に重心を大きくかけています。（左）
「コントラポスト」が生まれる前は「アルカイック美術」というものが存在し、この頃の立像は直立で真っ直ぐのものが主でした。（右）
また「アルカイックスマイル」と呼ばれる微笑んだ顔が特徴的でもあったのですが、これは直立でもどうにか人間味や生命感を出せないか...考えた結果、表情をつけることでそれを解決しようとしていたようです。
しかし、コントラポストの登場で体の重心やしなりで生命感や人間らしさを表現できるようになると、このアルカイックスマイルは不要になり消滅していきました。
minneのイラストは大昔の美術と同じ道を辿っていたんですね。
コントラポストでは重心の他に骨盤の傾きが大きなポイントです。
しかしそこまで描写するのは大変なので、重心の変化を感じさせるような足のパーツを多めに用意し、可能な限り「棒立ち」ポーズの人間が少なくなるようにしています。
この工夫によりダイナミズムが生まれ、表情がなくても活発な姿と感情を表現できるようになりました。
要素のマージと細部の検証
4つに分けて整理した要素を組み合わせたラフからパスを起こします。
7頭身で顔は横向き、曲線で滑らかなボディライン。この時点で重心が違う足のパターンをたくさん用意しています。
さらに物を持たせたりジェスチャーを可能にする腕を用意し、パソコンを使ったり、机に向かうことができるように座りのポーズも用意しました。
人間の形の大枠ができたところで、細かい調整を行いました。
ほっぺたやあごの少し膨らみ方によっては年齢や性別が偏って見えます。顎の位置によっては姿勢まで悪く見えたりもするので、顔のパーツは慎重に検証しました。
そしてハンドメイドマーケットであるminneでは「手」は重要な意味を持つので、手の指の長さやカーブなどの表現も厚めに検証しました。
さらに引き目では手袋、クローズアップでは５本指というように、スケール感によって手の解像度を描き分けるようにしています。
体の形が詰まってきたところで、イラストをたくさんのタッチポイントで使用する時の視覚的な重複を軽減するため、髪型・服・靴などのパーツをいくつか用意しました。
形のルール
ここまでで人のイラストの制作過程を網羅してきましたが、人を描くってとても難しいですよね。そこで、人のみならず何かを描写する時のコツについて少しご紹介します。
大学まで通っていた絵画教室で、人物クロッキーの機会が多くありました。クロッキーとは、モチーフを短時間で簡潔にスケッチすることです。
そして捉えた形に狂いがないかを確かめるための知識として、人の形のルールを学びました。
例えば、個人差はありますが、手を下ろした時、だいたい手首の高さは足の付け根になります。
腕を広げた長さはだいたいその人の身長になります。これはレオナルドダヴィンチのウィトルウィウス的人体図も同じことを言っていますね。
手の大きさは、だいたいその人の顔の大きさと同じくらいです。耳の付け根の高さと目の高さは大体揃っています。
また人の顔は目から下が伸びていくように成長します。つまり顔に対して目を低い位置に置くとそれだけで幼い印象になります。
人のみならず、多くのもの形はルールを持っています。そのルールを押さえることこそがコツで、「それらしく見える」ポイントを知ることでビジュアルコミュニケーションをよりスムーズにすることができます。
ぜひ皆さんも何かの描写に迷った時は試してみてください。
BEFORE & AFTER
イラストが出来上がったので、早速minneのプロダクト内にあるイラストを再制作したもので比較してみましょう。
イラストに持たせられるストーリーや情報の密度も向上した気がします。
またプロダクト内のいくつかのタッチポイントではこのようにイラストのテイスト自体も揺れていましたが、一貫性が生まれました。
minneが10周年を迎えた記念企画ではこのイラストアセットをメインビジュアルに使用しました。
とても賑やかで、多様かつ活発なものづくりの姿が伺えますね！
最後に
「ブランドをビジュアライズする」というと仰々しく聞こえますよね。
ただ実際に制作してみて、複雑に考える必要はなかったように思います。
「カチッとした印象と、柔軟な印象とどっちがよいかな？」「柔軟な印象にしたいなら、ラインも柔軟ぽく滑らかにしてみよう」くらいの、シンプルな判断を繰り返していくことで、おのずとサービスらしいイラストになっていきました。
minneはこのようなデザイン的なアプローチはもちろん、さまざまなアクションでブランドを浸透させてミッションを果たし、みんなが創造的になれる世界を作ること目指していきます！
本番では緊張と肺活量不足で息切れなど起こしていましたが、初めての外部登壇が Spectrum Tokyo Design Fest 2022 で本当によかったです！
応援してくれたペパボの仲間、イベントスタッフの方々、来場者の皆さま、ありがとうございました！🐧
きてきてペパボ！
minneを運営しているGMOペパボでは仲間を大募集しています！
ものづくりをする人やクリエイターを応援したい人、ぜひ一緒に働けたら嬉しいです！
この記事が気に入ったらサポートをしてみませんか？