超大規模システム経験者が考える、攻めの開発を続けるために大切なこと

<html><head></head><body><p>みなさま初めまして！<br>
PLAID Engineer Blog初投稿の韓 徹（<a href="https://twitter.com/sskt0809" target="_blank" rel="noreferrer">@sskt0809</a> ）です。</p>
<p>プレイドは、2018/11/3(土)に秋葉原UDXで開催された<a href="https://vuefes.jp/" target="_blank" rel="noreferrer">Vue Fes Japan 2018</a>にプラチナスポンサーとして協賛しました。<br>
私はスポンサーセッションで参加者全員の前で登壇する機会もいただき、Vue Fes Japan参加者の皆さんに<a href="https://karte.io/" target="_blank" rel="noreferrer">KARTE</a>について伝えることができました。</p>
<p>今回のブログでは、Vue Fes Japanの様子や、スポンサー参加の裏話などをお伝えします。</p>
<h2 id="会場の様子">会場の様子</h2>
<p>自分が会場入りした午前9:00の時点でPLAID以外の各スポンサー企業さんも準備が整っていて、すでに会場はほぼ完成していました。</p>
<p>ヘイ株式会社さんはトイレットペーパーをノベルティに、株式会社リブセンスさんはガチャガチャを用意したりと、ユニークなブースもあり、見るだけで楽しいブースもいくつかありました。</p>
<p>私たちはKARTEのバナーや50インチのディスプレイに公式動画を写し、ノベルティは弊社デザイナーが用意してくれたPLAIDとKARTEのステッカーとメッセージカードを同梱した渾身のステッカーセットを用意しました。<br>
（結果ステッカーセットを渡すと「こんなにステッカーもらえるの？！」って反応がもらえて、大成功でした。）</p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/b9e49923-c8ae-483e-b779-4add5e8163be/45B2B854-035A-48D4-B649-5C62402E9464-2.JPEG.jpg" alt="45B2B854-035A-48D4-B649-5C62402E9464-2"><br>
<em>ブースの準備は整った！の様子。</em></p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/b5999bcf-07d2-4d4c-b631-d90023827bd0/IMG_0875.JPG.jpg" alt="IMG_0875"><br>
<em>ノベルティのステッカーセット。来場者の皆様に好評でよかったです！</em></p>
<h2 id="そして開幕">そして開幕</h2>
<p>会場には続々と参加者が入場し、キーノート開始までに約300人の方が集まり会場は熱気に溢れていました。（会場スタッフやスポンサーの方を含むと400人強はいました。）<br>
そして、10:20にVue Fes Japan 2018主催のkazuponさんの開会の挨拶でイベントが開催されました。<br>
まず一発目のプレゼンはVue.jsクリエイターのEvan Youさんのキーノートです。Vue.js 3.0が登場する話、どこが2.x系と変わるかをプレゼンしていました。</p>
<p>そのEvanさんのプレゼンの次がお待ちかねのプラチナスポンサーセッションで弊社PLAIDの登壇です。登壇前はEvanさんの登壇の後であるのと会場の人数の多さのプレッシャーがありましたが、いっぱい練習したんだから大丈夫！大きい声で伝えたいことは強くゆっくり話す！って自分に言い聞かせてましたw</p>
<h2 id="登壇内容">登壇内容</h2>
<p>今回は「KARTEが1,000サイト以上でVue.jsを動かしている話」という内容で発表しました。以下がスライドです。</p>
<script async="" class="speakerdeck-embed" data-id="98c6724ce2c94580aa22383431fd7ba3" data-ratio="1.77777777777778" src="//speakerdeck.com/assets/embed.js"></script>
<p>主な内容は以下です。</p>
<ul>
<li>プレイドでは、Vue.jsがリリースされた2014年からVue.jsをKARTEの開発で使用している</li>
<li>お客様がKARTEの管理画面で作成したアクション（エンドユーザーに出すポップアップなどのコンテンツのこと）もVue.jsで作られている
<ul>
<li>それらがお客様のWebサイト上（1,000サイト以上！）で動いている</li>
</ul>
</li>
</ul>
<p>プレゼンする前は緊張しましたが、話し始めるとちゃんと練習した甲斐があり、プレゼン自体は大きなミスなく話せたと思います。ただし、最後に言い間違って「ちゃいます、ちゃいます」というお茶目な関西弁が出てしまいました...。その関西弁についてのツイートが2ツイートくらいありました。今やいい思い出です！</p>
<p>発表後はツイートを見ると「KARTEの管理画面すごい！触ってみたい！」「650コンポーネントもあるんだ！」「2014年から使ってるんだ！」「関西弁に安心感を感じる」といったポジティブなツイートばかりだったので、安心と嬉しさがこみ上げました。</p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/7f2096f0-68a7-4413-84d9-343d334e7d25/04AA081E-AF0A-4C38-9D07-CFAC5F1F162F.JPEG.jpg" alt="04AA081E-AF0A-4C38-9D07-CFAC5F1F162F"><br>
<em>登壇時の様子。我ながら顔が硬いですね...。</em></p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/3837230f-2643-47f6-8a33-e817229ae73f/Image-from-iOS.jpg" alt="Image-from-iOS"><br>
<em>聞いていただいた方々ありがとうございました！</em></p>
<h2 id="PLAIDのブースの様子">PLAIDのブースの様子</h2>
<p>プレゼンが終わったからと安心してはいけません。本当に会場の皆さんに魅力を伝えるのは発表の合間合間のブース対応なのです。<br>
発表見てブース来ていただいた人も多数いました。（弊社エンジニアであり、<a href="https://shiganai.org/" target="_blank" rel="noreferrer">しがないラジオ</a>パーソナリティの池上に会いに来た方も多数いました。）</p>
<p>Vue.jsをどのように使われているかという質問はもちろん、KARTEがどういうことができるのか、サービス自身に興味を持っている方も多い印象を受けました。<br>
改めまして、ブースに来ていただいた方ありがとうございました。</p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/78c2e7b4-783a-43a7-b933-9035f9acf530/Image-from-iOS--1-.jpg" alt="Image-from-iOS--1-"><br>
<em>ブースに多数の方々が来てくれました！</em></p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/bc056c5d-6cb1-49cd-85c0-3fa9d8367276/FC51D036-7939-4D81-9EA0-604039015FBD.JPEG.jpg" alt="FC51D036-7939-4D81-9EA0-604039015FBD"><br>
<em>エンジニアの民谷（タミー）もブース対応に参戦。ありがとう！</em></p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/2f677bec-23b4-44b6-946a-f71836d3a550/18C158A2-317C-48BC-BAD6-67730DD67073.JPEG.jpg" alt="18C158A2-317C-48BC-BAD6-67730DD67073"><br>
<em>エンジニアの野田(@positiveflat)はVue Fes Japanのスタッフとして大活躍していました！</em></p>
<h2 id="プレゼンで割愛した内容を一部紹介">プレゼンで割愛した内容を一部紹介</h2>
<p>今回の発表はアクションの配信する箇所をメインに話しましたが、この内容にfixするまでにプレゼン内容に紆余曲折あり、説明したくても残念ながら割愛した部分を紹介したいと思います。</p>
<h3 id="Vue.jsをなぜ採用したか">Vue.jsをなぜ採用したか</h3>
<p>KARTE ではVue.jsがバージョン0系で登場した2014年から採用しています。当時、様々なフレームワークと比較しましたが、軽量でシンプルなフレームワークであること、状態管理のしやすさなどを理由にVue.jsに決めました。</p>
<p>実際には、学習ハードルが低く一部のデザイナーやフロント経験の浅いエンジニアでも直感的に使えるという特徴から、スピード感を持った開発を続けられています。また、ドキュメントやライブラリの充実など、Vue.jsコミュニティが活発である点もメリットを感じるところです。</p>
<h3 id="デザインシステムの導入">デザインシステムの導入</h3>
<p>PLAIDでは今年の頭からデザインシステム「BAISU（バイス）」の構築プロジェクトが始まりました。BAISUプロジェクトはKARTEのユーザー体験を良くし強いプロダクトを作るのが目的です。内部的にはデザイナーとエンジニアがよりスピード感を持って協業するために、デザイン原則、スタイルガイド、パターンライブラリを用意しました。</p>
<p>実際に一部の画面ではBAISUのガイドラインに沿ったリニューアルしたりと積極的にアップデートしています。弊社ではデザイナーもVue.jsを書くのでBAISUによりスピードを上げて開発できます。BAISUの詳細は後日、弊社デザイナーが書いてくれることを期待。</p>
<h2 id="最後に">最後に</h2>
<p>今回はVue Fes Japanの運営の方々、会場に来ていただいた皆さん、準備を手伝ってくれた弊社スタッフには本当に感謝しています。<br>
自分はこのような大規模なテックカンファレンスに登壇することは初めてで、新しい学びも多く、そして精神面でも色々鍛えられました！<br>
またこのような機会があれば、どんどん積極的に手を上げていこうと思います。</p>
<p>あと、Vue Fes Japanのアフターパーティは非常に豪華でEvan Youさんとも2ショット撮れたので最後まで大満足のカンファレンスでした！</p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/5877741e-8196-4d88-a823-4f732167fc71/34C704BC-FFA2-4E37-8F73-5FAF34B4A683.JPEG.jpg" alt="34C704BC-FFA2-4E37-8F73-5FAF34B4A683"><br>
<em>アフターパーティの料理めちゃくちゃ豪華でした。とても美味しかったです。</em></p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/3bd4258d-5878-48df-8317-b5dc7ea6cce8/IMG_1339.JPG.jpg" alt="IMG_1339"><br>
<em>Evanさんとの2ショット！寿司トークも盛り上がり、楽しかったです。</em></p>
<h2 id="仲間を募集しています">仲間を募集しています</h2>
<p>CX（顧客体験）プラットフォーム「<a href="https://karte.io/" target="_blank" rel="noreferrer">KARTE</a>」を運営するプレイドでは、KARTEを使ってこんなアプリケーションが作りたい！ KARTE自体の開発に興味がある！というエンジニア（インターンも！）を募集しています。<br>
詳しくは<a href="https://plaid.co.jp/recruit/engineer.html" target="_blank" rel="noreferrer">弊社採用ページ</a>または<a href="https://www.wantedly.com/companies/plaid/projects" target="_blank" rel="noreferrer">Wantedly</a>をご覧ください。 もしくはお気軽に、下記の「話を聞きに行きたい」ボタンを押してください！</p>
<div class="wantedly-visit-button" data-visit-button-id="lyE_IgY4VF5ukBo_EUKZLg" data-width="300" data-height="60"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "https://platform.wantedly.com/visit_buttons/script.js";
  fjs.parentNode.insertBefore(js, fjs);
}(document, "script", "wantedly-visit-buttons-wjs"));
</script>
</body></html>

プレイドは、2018/11/3(土)に秋葉原UDXで開催されたVue Fes Japan 2018にプラチナスポンサーとして協賛しました。
Vue Fes Japanの様子や、スポンサー参加の裏話などをお伝えします。

Vue Fes Japan 2018に登壇してきました！#vuefes