
カンファレンスの”体験”のデザイン -かりゆしウエアの舞台裏- | RubyKaigi 2024
めんそ〜れ!「B/43(ビーヨンサン)」を提供するスマートバンクでコミュニケーションデザイナーをしているゆっきー(@yuki930)です✋
2024年5月に沖縄で開催されたRubyの国際カンファレンス「RubyKaigi 2024」で、同僚のmmitoさんと共にRubyKaigi 2024カンファレンス全体のデザインを担当させていただきました。
沖縄らしさを表現した今回のビジュアルの制作過程については、せひmmitoさんの記事をご覧ください!
RubyKaigiでは、毎年デザイナーが入れ替わる方式が採用されており、RubyKaigi 2024ではmmitoさんと私の2名体制でデザインを担当しました。
歴史のあるカンファレンスなので、歴代デザイナーのみなさんのさまざまな試行錯誤がチームに経験として積み重ねられています。
私の記事では、カンファレンスの体験のデザインにフォーカスをあて、今年の制作時の工夫や裏話について紹介します。
また、今年デザイナーを担当して感じた、歴代デザイナー、Organizerのみなさんによって積み重ねられたRubyKaigiの体験デザインの工夫についてもご紹介したいと思います。
かりゆしウェアのデザイン
RubyKaigiでは例年、開催地にちなんだノベルティを用意しています。
ウェアに関しては、例年はTシャツとなることが多いRubyKaigiですが、今年は沖縄開催ということで、かりゆしウェアを公式ノベルティとすることになりました。

かりゆしウェアの定義
みなさんはどういうった服をかりゆしウェアと呼ぶかご存知ですか?
沖縄県のサイトによると、以下の2つの条件を満たしたものをかりゆしウェアと呼ぶそうです。
💡 かりゆしウェアには、次の2つの条件があります。
沖縄県産であること。
沖縄らしいデザインであること。
今回、こちらの定義を満たしたかりゆしウェアを制作するために、沖縄でかりゆしウェアの企画・提案業務を行っていらっしゃるアップデートの濱田さんのお力をお借りしてかりゆしウェアの制作を行いました。
時間との戦い
1000着を超える大量のかりゆしウェアを、沖縄県内で製造するためには、たくさんのスケジュール調整が必要で、たくさんのご調整を頂きました。
それらの調整の結果、RubyKaigi 2024に間に合わせるためには、12/22までにデザインをFIXさせる必要がある、ということがわかりました。
つまり、キービジュアルがFIXしてからかりゆしウェアのデザインをFIXさせるまでの期間は2週間ちょっとしか時間がありませんでした。

短期間で実現可能な素材や予算内でのデザインを決めるため、何度も調整を繰り返しました。


予算と納期と沖縄らしさと日常使いのしやすさと
当初、「1000枚以上となると、白しか生地が確保できないかも…」といったお話もあり、白地ベースのデザインも検討したりしていました。

イベント後の使いやすさを考えたらこのまま白地のほうがいいのかも…?と思ったり、いやいや、全体で沖縄の明るさを表現したいならここはベースに色があったほうがいいのでは…!など、最終的なデザインにたどり着くまでは本当に紆余曲折ありました。
最終的なデザインがこちら

デザインのコンセプトは、キービジュアルの参考にした伝統衣装の「琉装」
琉装での色の意味合いを参考にしながら、コミッターの皆様のウェアは黄色、スピーカーのみなさまのウェアはロイヤルブルー、参加者のみなさまのウェアはRubyの赤、そしてスタッフのウェアはグリーンという配色になりました。
今回、全体にプリントを施すのは納期的にもコスト的にも難しかったため、前身頃ではなく、襟立てや袖口のほうにプリントを施した生地を利用し、ポケット口にはミンサー柄のテープをあしらったデザインとなりました。


仕上がったかりゆしウェアはとてもサラッとしていて快適で、さすが沖縄の夏を快適に過ごすために作られたウェアだなと感動しました。
↓今回のデザインのヒントとなっている伝統衣装の琉装についてや、テーマカラーとなった最上位職である黄色(チールジー)、そしてミンサー織りについては、詳しくはmmitoさんの記事をぜひご覧ください!

ネックストラップのデザイン
ネックストラップは、今年いくつかの改良にトライしました。

写真OK / NGの区別
今回は2色のストラップを用意しました。これは単にお好きなものをどうぞということではなく、写真OK / NGを表してもらうために用意していました。

裏返らない2点吊り仕様に
そして、今回吊り方もアップデートされました! 名札が裏返らないように、今年は2点吊り仕様にしました。

例年までは、名札が回転してしまう対策として、台紙両面に名前をかけるようにして対応していたそうです。
ただ、RubyKaigiでは毎年ブースのスタンプラリーを行っており、名札の裏側にはスタンプラリーのカードを入れる方が多いので、裏返ってしまうとスタンプラリーの台紙が見えていて、結局名前は見えていない…という状況になることが多かったということで、根本的にはやはり名札が回転しないようにするのがよさそう、ということになりました。

そこで、今回は2点吊りのケースを使ってこの問題が解決できないかトライすることにしました。
これに伴って、台紙は片面のみ名前を書く仕様に変更されました。

会場でもSNSでも、今年のこの改良に気づいてくださったかたがいて「回転しない!」と好評のお声をいただけて良かった反面、2点吊りのストラップでも万全ではなかったようで、中身の出し入れのしにくさがあったり、2点吊りでも名札が回転してしまっている方はいたとのことでした。
中身のサイズも一工夫
名札の台紙とスタンプラリーのカード共に、A6サイズのケースに対して、少し小さめの用紙を用意し、出し入れしやすくしました。

このタイプのケースは、ペタっとくっついてしまうので大きさがギリギリすぎると名札がケースにいれにくい…!ということが起こります。
そのため今回はA6サイズのケースに対して、用紙のサイズを少し縮めて制作しました。
台紙は100mm x 148mm スタンプカードは91mm x 148mm幅の折り
で作成しています。
気持ち小さめにしたことで、多少は出し入れのしにくさが解消されていたのではないかな…?と思います。
ロゴタイプのデザイン
今回、横組みと縦組みの2種類のロゴタイプを用意し、シンボルマークを織り交ぜました。

シンボルが強いので、シンプルなロゴでも良いかと思いましたが、以前別のカンファレンスでデザインを担当した際、ロゴタイプに少し特徴やアクセントがあるとグッズ展開したときにも印象が残ってよいなと感じたことがあり、ブラッシュアップの過程で、@mmitoさんが生み出してくれたとRubyのマークとミンサー織りを織り込んだロゴタイプを提案しました。
実際、Webサイトでキービジュアルと共に使うときには2段組みのもの、Keynoteや会場内の案内でシンプルに使いたいときは1段のものと使い分けることができたので良かったなと思っています。
個人的には、こういうカンファレンスの際はロゴタイプだけで使った際にもなにか少しフックがある方がなにかと使い勝手がいいのではと思っています。

Keynoteテンプレートのデザイン
RubyKaigiでは毎年、公式のKeynoteテンプレートが用意されており、今年も用意しました。

レイアウトパターンを追加
今年のバージョンでは、例年よりページレイアウトのバリエーションを増やしてしてみました。
RubyKaigi 2023の際のスピーカーの皆さんの登壇資料を見たりして、これもあると便利かも?と感じるレイアウトを追加してみました。

会期中もいろいろな方が使ってくださっているのが見られて嬉しかったです!
スポンサーパネルのデザイン
スポンサーパネルは例年、参加者のみなさんが自社のロゴのまわりにサインを書いたりすることがあると伺っていたため、ロゴは大きくしつつ、できるだけロゴ同士の間隔もあける形で作成しました。


広告のデザイン
那覇空港とゆいれーるの駅に広告を出しました。
2016年の京都以来、駅などへの広告掲載は毎年行っているそうです。
特に那覇空港の広告は多くの方に撮影、シェアされ、RubyKaigiがはじまる前のポジティブなムード作りに一役買ってくれていました。

Arrived. pic.twitter.com/OqVo93RkOZ
— Samuel Williams (@ioquatix) May 10, 2024
フロアマップのデザイン
会場内のフロアマップも、RubyKaigi専用にデザインしていました。
もともと会場で用意されていたフロアマップは日本語だったこと、そして 今回のイベントでは利用しない部屋などの記載があって複雑だったことから、英語で表記し、必要な情報に絞ったものを作成しました。

Webサイトのデザイン
RubyKaigiの運営では「できるときにできる人がやる」といったことが実現できるように、誰でも手伝えるような工夫があちこちに施されています。
Webサイトも例外ではなく、更新しやすくする工夫がいろいろと施されており、基本的にはどのページもYAMLを読み込んでコンテンツを表示するようになっています。2024年もこれを引き継ぎ、Webサイトを作成しました。

会場内の案内板のデザイン
会場内では、このようにいたるところに案内用の紙を配置していました。

Figmaで「誰でも追加編集」できるように

こちらも、最初はIllustratorでデータを作っていたのですが、文言の調整や確認、修正があったときの対応などを考えるとローカルファイルに閉じてしまうのはデメリットが大きく、最終的には関係者みんなで編集できるようFigmaで作るように変更しました。

作ったあとは、FigmaからPDFとして書き出して印刷する方法を採用しました。
前日準備や当日にも、新しい案内板を追加したり…ということがあったので、この方式にしておいて本当に良かったです。
最後に
以上、RubyKaigiのデザインの工夫についてご紹介しました。
これらは今年のデザイナーの私たちがやったというものではなく、何年もカンファレンスを運営されているOrganizerのみなさんの知見によるものがほとんどです。
この記事を読んでRubyKaigiのデザインに興味を持った方は、ぜひ、RubyKaigiの運営の皆さんとコンタクトを取ってみてください!新たな知見や発見が得られると思います!
そして、一緒にデザインさせてもらった @mmitoさん、2023年のデザイナーの@attsumiさん、そして@a_matsudaさん、@sora_hさんをはじめとするOrganizerのみなさん、本当にありがとうございました!
大変なこともあったはずなのですが、今となっては全部吹っ飛んでとにかく楽しかった記憶しかありません!
今回の1300人を超えるカンファレンスのデザインという経験は、私の人生において本当によい経験になりました。
このような機会をいただき、本当にありがとうございました!
RubyKaigi Organizerのみなさんとの思い出 & 会場フォト



そしてあの高橋メソッドの生みの親だと知って大感動しました…!!



