こんにちは。アプリ班リーダー、高橋文樹です。中国は成都から先週帰ってきました。麻婆豆腐発祥の店で麻婆豆腐を食べました。
さて、WordCamp Tokyo 2019では昨年の「受付がハチャメチャに混んだ」という反省を踏まえ、それをなんらかの方法で改善できないかという課題にかなり早い段階から取り組み始めました。
そして当日、出来上がったものがこちら!
VIDEO
撮影&編集 清野氏
ものすごくオシャレに編集したムービーなので「これは実態とかけ離れているのでは?」と疑う向きもあるかと思いますが、体感としても「受付で混んだ」と思った方はいなかったはずです。実際に参加された方からも……
といった声が寄せられています。1人あたり20秒、スマホ利用で5スロットという感じでしょうか。実際の入場ログをグラフにすると、こんな感じ。
Tableau Publicで画像化
この記事では、その仕組みと今後の展開について共有したいと思います。
WP-Checkinの裏側
さて、このシステムはWP-Checkinという名で、GitHubにも公開しています。
https://github.com/wct2019/wp-checkin
基本的にはWebアプリケーションです。以下、技術的詳細。
Slim というPHPフレームワークを使っています。ホスティングはAWSで、t2.nanoという激安サーバーを利用。 QRコード生成はGoogle Chart APIをfile_get_contentsするというワイルドな実装。 スタッフしか使わないので、認証はBasic認証のみ。 コーディング時間はたぶん24時間かかっていないはず(ログ )
要するに、ささっと作った業務用Webアプリなのですが、もちろん工夫したポイントもあります。
PHP+Firebaseの利用
WordCampサイトはREST API経由で個人情報(e.g. ログインしてチケット情報取得)を参照できる仕組みがないので、GoogleのBaasであるFirebaseを利用し、そこにデータをコピーするという若干めんどくさい方法をとりました。これはアプリ班のもう一つの重要プロジェクトであった、「モバイルアプリを提供する」からも利用したかったのでそのようなジャッジになっています。
が、PHPからFirebaseに接続するのは結構面倒で、まずPeclでPHP拡張 を入れる必要があります。今日日Peclって……と思ったのですが、なんでしょう、Goとかで実装してるからPHP拡張の方が楽なんですかね。とりあえずこの時点でレンタルサーバーはダメそうだなと判断し、AWSを使うことにしました。当日6時間ぐらいt2.largeに上げました。
Firebaseにデータをインポートする仕組み もアプリ班で作成。現在、500件のデータを一発で入れると怒られるので、そこが手付かずです。実際の運用ではCSVを分けてインポートしました。
QRコード配布の仕組み
QRコードを読み取ってチェックインを記録する仕組みがあっても、「どうやってそのQRコードを届けるのか」という問題がつきまといました。ここが結構難題で、WordPressコミュニティでも議題には上がっているのですが、たとえば1,000人の申し込みがあったイベントで1,000人に対して異なる情報を送る仕組みが存在しないのです。
一応、メール送信機能(Mailchimpみたいな機能)はWordCampサイトにあるのですが、チケットIDのような、固有の情報を外部から推測されにくいハッシュで送ることができません。
したがって、今回は「姓名+メアド」をクエリパラメータに含めて強引にQRコードを作成しました。WordCampでは同姓同名同メアドでチケットを複数枚買うことができてしまうのですが、それは後述するイレギュラーとして分類し、ことなきを得ました。
メールクライアントによってはimgタグのscr属性に日本語が含まれていることを許さず、QRコードが表示されなかったりしましたが、大半は大丈夫でした。
オペレーションの徹底
去年の反省をふまえると、当日スタッフ、つまり事前の打ち合わせをあまりやっていない人たちに対しての指示が少なかったのかなと判断し、事前にヒアリング(去年の何が問題だったと思う?)を行いました。その結果、次のようなtodoがリスト化されました。
来場者に対して、事前に自己認識を持ってもらう 。一般? スポンサー? スピーカー? これはエレベーターホールや行列で声がけをし、「スポンサーの方はこちらです」という具合に誘導してもらいました。WordCampサイトに登録されていない情報を把握する 。たとえば、スピーカーとスポンサーのTシャツサイズはFacebookグループやメールで収集してGoogleスプレッドシートに登録されていたので、WordCampサイトに登録されていませんでした。つまり、wp-checkinとしては知りようがない情報です。クライアントをスマートフォンにする 。QRコードの偉大なところは、スマホ一台あれば済むところです。去年までは受付にボランティアの持ち寄ったラップトップを並べていたのですが、OS古すぎ、Wi-Fiに繋がらない、バッテリーが30分で切れるなど、問題が頻出しました。しかし、スマホであればそれなりに質の揃った端末を多くの人が持っているので、問題も発生しません。ユーザーシナリオを徹底する 。今回は「すごくうまくいった場合」と「それ以外」にわけました。受付が混む原因はいわゆる「ATM待ち行列 」です。2台しかATMがない銀行支店で数十件の振込をする経理の人が2人いたら、ものすごい行列ができてしまいますよね。したがって、「すごくうまくいった場合」以外の全てのイレギュラーは熟練スタッフ(僕)によるヘルプデスクが対応することにし、当日スタッフの皆さんにもそのように周知しました。
QRコードによるチェックインシステムを作ったということがあたかも問題解決の主因のように見えてしまいますが、実際はこうしたシナリオ分岐とオペレーション徹底によって当日スタッフたちの力を引き出したことが大きかったのでは、と思います。
うまくいかない場合あるある
さて、上記でさらっと触れた「すごくうまいった場合」以外 はなにがあるのでしょうか? これは長年WordCampの運営に携わらないとわからないところがあると思うので、シェアしておきます。
誰かに買ってもらっている
制作会社の方に多いのですが、自分以外の誰かにWordCampのチケットを買ってもらっている場合 があります。部下はWordPressアカウントではなく会社の名義のメアド(e.g. boss@example.co.jp)で買っているにも関わらず、上司はWordPressアカウント(e.g. me@example.com)で買ったと思い込んでいるケースです。受付で「買ったはずだけど」といっても、メアドが違うのでチケットリストを検索しても「虚無」 です。
名前が違う
筆者は「SNSすべて本名で通す」という若干クレイジーな生き方を貫いているのですが、世の中の人はハンドルネームなどを使い分けています。WordPress.orgとtwitterとinstgramとgmailの@マークの前がすべて異なったりします。なんでtwitterアカウント何個も持ってるの? また、異常な数のgmailアカウントを持っている人、すべてのサービスに+をつけて運用する人(e.g. example+wordcamptokyo2019@gmail.com)も世の中に存在するので、捜索に時間がかかります。
チケットを買っていない
散々メールを検索した挙句、「そういえばチケット買ってないわ」という人がいます。本当にいます。これは悪魔の証明 です。そういう人がいるのは別にいいのですが、時間がすごくかかります。行列のできるラーメン屋で席に座る前にチケットを回収する意味はキッチンの仕事を前倒しするだけでないのでは、と個人的に思っています。ちなみに、ある程度経験を踏むと、顔を見ただけで「あ、この人チケット買ってないな」とわかります。
総じていうと、「イレギュラーを見分ける」というのがものすごく大事なスキルになります。
WP-Checkinの今後
さて、「2019年の東京ではうまくいったぜ、俺たちすごいだろ?」というだけでは芸がないので、ぜひこの機能を他でも使ってもらいたいとWordCamp 2019 Osaka にバトンタッチしました。
うまく動くかなとやきもきしていたところ……
やったぜ! この仕組みはWordCamp Asia 2020 でも使ってもらえるよう調整中です。困ったことがあったらいつでもいってね(業務連絡)
コミュニティ全体への取り込み
さて、今回Firebaseを利用しましたが、本来であればWordCampサイトに入っているデータを外部から利用できれば済む話です。実際、今月開催されるWordCamp Taipei でも同様の仕組みを開発したと聞きますし、別々の場所で似たような機能が開発されるのは無駄な気もします。
WordPressコミュニティでも同様の問題は認識されており、すでに関連する提案 “Proposal: QR code for WordCamp badges ” もされています。
今回作成された仕組みはコミュニティに提案し、形を変えて採用してもらえればと嬉しいですね。まだ英語でのプロポーザルを書く時間は取れていないのですが、もし採用されたら、「そういえば2019年に東京でそんなことがあったなぁ」と思い出してもらえれば幸いです。