まず台風19号によって被災された方へ、心よりお見舞い申し上げます。
台風19号により残念ながら中止となったVue Fes Japan2019ですがRaksulはスポンサーとしてブース参加予定でした。そして実はイベントを盛り上げるべく、ブースを含めて色々なアイテムの準備を社内のデザイナー達が進めておりました。せっかくなので、準備の様子をお伝えしようと思います！
ちなみにRubyKaigi2019でも社内デザイナーが協力してたくさんのアイテムをデザインしています。そちらはRubyKaigi2019クリエイティブ報告を見てみてください。
コミュニケーションコンセプト
スポンサーになることが決まった後、どんなブースにするかエンジニアサイドで話し合っていた中、弊社CTOの泉が次のようなコミュニケーションコンセプトを立てました。
Vue.js Connects You & Us
Vue.jsがラクスルと、世のフロントエンドエンジニアの皆さんをつなぐ、という思いを込めたコンセプト。こちらをベースに弊社フロントエンドエンジニアがタタキとなるアイディアをたくさん出しました。それからデザイナーも参加して、実際どんなことをやっていくかを決めていくことに。
部署を超えたコラボレーション
それぞれ多忙な通常業務がある中ではありますが、こうした機会は貴重です。いつもとは違ったクリエティブの力を発揮する機会ということで、部署を超え、デザイナーがスキマ時間をぬってコラボすることになりました。
いつだってコラボレーションしていくのに前向きなラクスルデザイナー達です。しかし弊社には目黒オフィスと五反田オフィスがあります。デザイナーの勤務地が離れており、毎回MTGのために行ったり来たりは、ちょっと時間がもったいない！そんなこともあって、最近はFigma x Wherebyを使ってリモートでもスムーズなコラボレーションを実現しております。
慣れれば意外にいけるものです。コツはMTGタイムに縛られすぎず、Slackなどのチャットも活用して継続的にコラボできるようにしておくこと。あとは音に気をつけること！音が小さいと何言ってるのかわからなくてツライです。リモートは準備が大切ですね。
とはいえ、初期のアイディア出しだけはリモートでやるのはちょっと難しいので、必要に合わせて物理的に集まるのも重要です。オススメは最初のキックオフ＆ブレストだけでも顔を合わせることです。
Figmaで情報を一箇所に集約
もう少しだけラクスルのリモートコラボレーションについて書いておきたいと思います。
弊社ではGoogle Slide, Slack, Notionなど色んなツールは使っていますが、情報の場所が散っていると、俯瞰しながらアイディアを出していくのが難しいという感覚があります。
そのため最近はFigmaを使っています。必要な情報を1ヶ所でみながら、アイディアをどんどん出していけるから。例えば、メンバー、要件、アイディア、スクラップ、ジャーニーマップ、デザイン案など本当に関連するモノ全てですね。1ファイルに集約できます。
（スキマ時間で、アイディアを出してプロジェクトをガンガン進めていくのが目的なので、そこまで綺麗にはなってないところにリアリティを感じてください！）
体験全体を考える
ツールを上手に活用するのは大事ですが、それ以上に大事なことがあります。それは体験を全体として考えること。イベントの始まる前から終わった後までEnd to Endで考える、というやつですね。
SNSでは、来てくれる前にどんなことを知ったらワクワクするだろう。来場者が会場に入った瞬間から、どんな気持ちになってほしいかな。そんなことを想像しながら進めます。最初のブレストで断片的なアイディアがたくさん集まってるので、時系列に合わせてマッピングをすればOK。
全体を捉えるために、こんなジャーニーマップを書き起こしました。
足りていない部分、TOO MUCHな部分などが自然と見えてきて、大事なことをうまく整理できたと思います。こうした全体感を踏まえて、個々のアイテムをつくったので、一つ一つ紹介します。
イベントロゴ
まずはたくさんのアイテムの起点になるロゴを作りました。Vue.jsとRaksulを掛け合わせた特別ロゴです。担当はノベルティECのプロダクトを担当している竹末です！
デザインの着想はVue.jsがリアクティブコンポーネントであることから得ています。Vue.jsのロゴはそのままに、アウトラインを引き、要素を分断する事によって、デザインがコンポーネントの組み合わせで出来ていることを浮かび上がらせる表現です。また、ラクスルの3つの事業を表すように3つの点をあしらいとして入れ込んでいます。
竹末 真紹 印刷事業部 プロダクトデザイナー
ブース
次に取り掛かったのはブースです。簡易的なイベントブースというと、どうしても長机にスタッフが座って待つ、といった形になりがち。でも、せっかくブースを出すのだから来場者ともっと話したいよね、という気持ちがありました。なにせ「つながる」というコンセプトだから。
そこで、目に止まりやすく、ラクスルのフロントエンドエンジニアと気軽に話すきっかけになるようなブース空間を考えていくことに。担当はテレビCMサービスのプロダクトを作ってる岩波です。
まず椅子は撤去。ライトに話せるように、ハイテーブルを配置してフラっと立ち寄りやすく、を重視しました。さらにVue.jsを普段から活用するラクスルにぴったりなブースにしたい！と思ったので、50cm角のダンボールをコンポーネントとして活用するコンポーネント指向ブース！というのを考案しました。
また業者に設営してもらう訳ではないので、運搬・設置・撤去などが自分たちでできることも考慮しています。
スタイリングとしては、まず基本となるボックスのパターングラフィックスをタイポグラフィで組み上げつつ、印刷ラクスルの主力商品の一つであるノベルティECを活用したオリジナルアイテムを配置。全体として繰り返しのリズムが感じられるコンポーネントデザインに。
弊社はリアル産業とインターネットと接続させる会社です。「つながる」というコンセプトを表現する意味でも、あえてリアルに手に取れる・触れる感を意識しました。
ユーザー体験、運用上の機能性、スタイルから作る印象。それら全てがコミュニケーションコンセプトを体現する形を目指したというわけです。
といったところで、大分長くなってきてしまいました。
次回、このブースに配置するアイテムとして作成したノベルティグッズをご紹介します！
ところでDesignship 2019とVue.js for 2020
イベントが続きます！最後に告知をさせてください。
デザインカンファレンスのDesignship2019 にブース出展をします！ ラクスルのデザイナーとぜひ話に来てください🙌
Designship2019
🗓2019年11月23日（土）〜 24日（日）@東京国際フォーラムB7 / B5
詳しくは https://raksul.design/articles/designship-2019-1/
またPLAIDさんと弊社の共催で、Vue.jsの今後に向けた勉強会を開催します！ ＊参加費は全額、台風19号の災害支援に寄付します
Vue.js for 2020
🗓2019年12月11日(水) 19:00 〜 22:00@PLAIDさん
