entry-header-eye-catch.html
entry-title-container.html

entry-header-author-info.html
Article by

#iOSDC Japan 2021 の公式ロゴ・サイトデザインができるまで

皆さんこんにちはFromAtomです。

さて、もうすぐiOSDC Japan 2021が開催されますね!iOSDC JapanはiOS関連技術をコアのテーマとした技術者のためのカンファレンスです。

https://iosdc.jp/2021/

ピクシブ株式会社は、iOSDC Japan 2021のデザインスポンサーを務めており、ロゴと公式サイトの制作を担当しました。「デザインスポンサー」はあまり聞き慣れないスポンサーだと思いますので、簡単に説明します。一般的なスポンサーでは、カンファレンス運営を金銭面で支援することが多いですが、デザインスポンサーでは次の作業を行うことでカンファレンス運営を支援します。

  • カンファレンスロゴのデザイン
  • カンファレンス公式サイトのデザイン
  • カンファレンス公式サイトの開発

この記事ではカンファレンスロゴとサイトのデザイン制作秘話について、弊社デザイナーのyukkiにインタビューしていきたいとおもいます。

―― 簡単に自己紹介をお願いします。

yukki:コミュニケーションデザイン部という、ロゴのデザインや、イベントのコミュニケーション設計や、様々なグラフィックデザインなどを担当している部署でデザイナーをしているyukkiです!

今年中旬に2人目の産休から復帰して早々、運良くiOSDCのデザインに2年連続で関わらせていただきました。よろしくお願いします。

―― よろしくおねがいします。2年連続でiOSDC Japanのデザインをすることになりましたが、難しさや悩みどころはありましたか?特に去年のロゴ実績がある中で、今年はどのように差別化などをしていったのか教えて下さい。

yukki:2年連続でのデザインは自分自身に課したチャレンジみたいなところもありました。個人的には去年とはがらりと変わったイメージ(ビジュアル)にしたかったので、コンセプトを決めるのに結構時間をかけました。

ただ逆に去年のような「かっこいい」&「動き」を感じさせるロゴにもしたいな、とどこか漠然と考えてましたね。

ここの塩梅がビジュアルに落とし込むときに苦労しました。

―― iOSDC Japan 2021のロゴを制作した際のコンセプトやテーマを教えて下さい。

yukki:今年のロゴコンセプトは「結ぶ」です。 常に進化を続けるiOSDCで、今年も新たなチャレンジに対しての成就が「結ぶ(び)」ますようにという意味合いを含んでいます。そしてこのイベントが人と人とを結び、新たな発見や出会いにワクワクしてもらいたいと考えました。

f:id:pxvpxv:20210910165321p:plain:w200
iOSDC Japan 2021 公式ロゴ

ロゴマークは上から見たときにプレゼントボックスのように見え、リボンを解いたら何が出てくるか、そんなイベントの楽しさ(ワクワク感)を表現しています。

―― 「結ぶ」というコンセプトから逸れないよう、気をつけた点やこだわった点などはありますか。

yukki:パッと見た時、読みにくかったり、意味が全く見えてこないようなロゴにするのは避けました。あとは可愛いくしすぎず、iOSDCのイメージに合うようにと心がけました。

ロゴマークの角度調整や、グラデーションで奥行きを出したり、など細部もこだわっています。

―― ロゴが完成するまでの制作過程を教えて下さい。

yukki:まずはコンセプトをひたすら練って考えていきます。 今回はなかなかコンセプトが定まらず、個人的には一番この時間が苦しかったですね。 コンセプトが固まれば、あとは形に落とし込んでいくだけなのですが、その前にリサーチを重ねインプットをします。

f:id:pxvpxv:20210910170210j:plain:w400
ラフスケッチの様子

プロトタイプに入る前に軽く手を動かすことが多いです。ただの落書きに見えるんですが、大真面目にやってます。 こうして何度も描いてると思考が整理されて、徐々にイメージが具現化されていきます。

ある程度イメージが取れたタイミングでイラストレーターで形にしていきます。 今回は最初にコンセプト違いを3案提案しました。

f:id:pxvpxv:20210910170233j:plain
最初に提案したロゴ案3つ

実行委員の方々にタイプCの方向性が気に入っていただけたので、そこから先方の意見を汲み取り微調整していきます。 今回は単色ではなくグラデーションを使用しているので、イメージ違いのカラーパターンなどもいくつか見せ、納品させていただきました。

f:id:pxvpxv:20210910170319j:plain
カラーパターンを提案

―― 次に、サイトデザインについてお聞きします。今回の公式サイトはどのようなコンセプトでデザインされましたか。

yukki:今年は動きを感じて、ファーストビューで気持ちいい印象を与えるサイトにしたいなと考えました。去年は直線的なイメージだったので、今年は柔らかさを意識してロゴにも使ってる曲線を中心に構成しました。

―― 確かに今年は曲線的で柔らかな印象をうけますね。他に、公式サイトデザインの際に気をつけた点やこだわった点はありますか。

yukki:まず去年のサイトと比較した際に、足りない要素を補おうと思いました。例えば「スポンサーさんの説明文が、別のスポンサーさんのロゴに被らないように」などですね。

大枠の部分では「サイト全体が見やすい」こと第一に考えていました。グラデーションがうるさくならないように、要素と余白のバランス、文字の大きさ、目線の流れなどに気をつけてデザインしていました。

細かいところだとスケジュールのピクトグラムも分かりやすいビジュアルに調整しました。

f:id:pxvpxv:20210910170813g:plain:w400
かわいいアニメーション

このピクトグラム動いててかわいいですよね。エンジニアさんがデザインのコンセプト汲み取って良い動きをつけてくれたので、最終的にかなりいいアクセントになっています。

―― このアニメーションは依頼していないのに「こういうのどうですか?」とエンジニアさんから提案してもらって、とても驚きました。すごくかわいいですよね。さて、さいごの質問になりますが、ロゴとサイトをデザインしていく中で難しかったところを教えて下さい。

yukki:一番難しかったのはやはりコンセプト設定ですね。去年よりいいものをと考えると余計に煮詰まってしまうところがありました。

かなり頼りになったのはエンジニアさんやマネージャーへの壁打ちです。本当今回は何度も何度もすみませんでした(笑)

多くのアドバイスやヒントをもらったので、結果いいものをつくることができました。

―― ありがとうございました。


このようにiOSDC Japan 2021のロゴとサイトはデザインされました。昨年に引き続き難しい社会情勢が続く中ですが、私達がデザインスポンサーとしてデザインしたロゴやサイトが、参加者の皆さまがiOSDCを楽しむ一助となり、新しい友人との出会いが結ばれるきっかけになると嬉しいです。

それでは皆様、今年もオンライン開催ではありますが会場でお会いしましょう。


合わせて読みたい

inside.pixiv.blog

inside.pixiv.blog

20191219010439
FromAtom
2015年にピクシブ株式会社に新卒入社。iOSアプリ分野テックリード。pixiv SketchのiOSアプリ開発を立ち上げから担当。
icon
yukki
2015年1月中途入社。コミュニケーションデザインチーム所属。印刷、グッズデザインからLPまで幅広く携わっています。プライベートでは4歳児と0歳児を育ててます。特技は夜泣き対応です。