あらすじ
3/18(土)と3/19(日)に人生初のハッカソンに行ってきました。
http://courrierjapon024.peatix.com/courrierjapon024.peatix.com
初日
初日は以下のスケジュールで進行しました。
初日午前: アイデアソン
最初に仮チームへの振り分けがされます。進行にしたがってチーム内で簡単なゲームをこなして行きます。ゲームが進むうちにだんだんとクーリエの課題をどうにかしようというブレーンストーミングになってきて、いつのまにやらアイデアソンが開始されていました。
最終的にはクーリエジャポンが抱えている問題点を参加者全員が共有して、各自で気になる問題点に対して改善案を考えてA4用紙に書き出して行きます。
参加者全員が個人としてプレゼンを行います。
初日午前: 個人のプレゼンタイム
先ほど考えたA4の企画書を全員で見回って良いと思った改善案に対して☆印をつけて行きます。☆が多いほど優先的にプレゼンを行う権利を得られます。このプレゼンをする側はこの時にチームに欲しい人物像(エンジニアだったら企画が得意な人、デザイナーだったらエンジニア募集など)と一緒に発表するので、プレゼンを聞いている側は自分にマッチするチームに各自で加わっていきます。
私は改善案として3つほど書き出したのですが「あとで読む機能を追加する」という改善案に星が5個ついただけだったのプレゼンせず。他にも類似した改善案でインターフェースを工夫した案があったのでそのチームに参加しました。
ここからハッカソンが開始されます。
初日午後: ハッカソン
軽く打ち合わせして早速手を動かすことにしました。どういうわけかこのチーム4人中4人サーバーサイドエンジニアが集まりました。私はとにかく手を動かしたかったので実装を担当させてもらいました。率先する人から役割が決まります。
今回は実装メインだったので次回は違う役割でチームに貢献したいと思います。
中間発表ができる段階まで画面をつくります。あとは画面をインタラクティブにするなりデザインを考える作業を翌日に行う予定でこの日は実装終了
初日午後: 中間発表
用事があったので私は早退しました。経過報告については翌日他のメンバーに聞く事にし会場を後に。
2日目
2日目は以下のスケジュールで進行しました。
私は前日の中間発表を聞いていなかったのでチームメイトからヒアリング ほとんどのチームが実装ができてないという報告を受けたのですが、1チームだけTinder のようにクーリエの写真を見て見たい記事を選別するといったアプリを作ったチームがいたそうで、かなりキャッチーなものだったそうです。
中間発表に参加したメンバーから現時点の実装ではプレゼン力が弱いという事で画面の動線を追加してほしいという依頼があったので、この日はその作業を起こってから画面をかっこよくする作業をする事にしました。
2日目午後
午前中で画面を追加する作業が完了したのであとはデザインを何とかしたいです。なんですがこのチームは全員サーバーサイドエンジニア。デザインについて詳しいメンバーが一人もいません。そのことを運営側に相談し、クーリエジャポンのデザイナーさんに直接画面をみてもらって意見をもらいました。このフィードバックを反映し、これで実装は完了です。結構時間が足りないなあと思いました。実際支給されたお弁当をみんな食べる時間がなかったようです。
プレゼン
各チーム5分間のプレゼンを行った後、審査員からの質疑応答に5分間の時間が割り当てられます。以下私が記憶している限りのメモですので間違っている箇所があると思いますがご容赦ください。
チームH: 夢のイベント実現 カラダで選ぶNEWS
発表者は普段から Kinect を使っているらしく、デバイスに近づくとスクリーンに文字が投影され、最後にジャンプするとクーリエのHPへ画面が切り替わるデモンストレーションが行われました。プレゼン終了後は質疑応答、審査員からは「普通のブラウジングではなく kinect を使う優位性は？」という質問に対してはクーリエジャポンの会員は新しいモノに敏感な層であるので kinect を使う事自体でキャッチーになるのではないか。という事をおっしゃってました。 分程度で滞在2,3時間だと思います。
チームA: 月間編集者Ranking機能
雑誌ではなく WEB ならではの機能として人気のある編集者を投票する機能を提案。Like であったり Follow であったり。
質疑応答ではランキングの定義について議論がされていました。ランキングという名目にすると何を持って優劣なのか、という話になるのでまあ難しい議題ではあるのでなかなか全員を満足する解が見つけづらいという話ではあります。
それから実はクーリエジャポンは編集者が8名との事です。
チームB: クーリエジャポンが持っていた紙の読書体験を再現する
チーム内に雑誌時代のクーリエジャポン愛読者がいたそうで、その方の意見を取り入れてスマホ用のビューアーを作成していました。
質疑応答で、紙の良さを再現するのは良いアイデアだと思いますが、扉以外はどのようにすると良いかアイデアはありますか？という具体的な質問がありました。紙から WEB へ移行したクーリエにとっては命題ともなっているテーマだったので質疑応答が活発に行われました。
クーリエジャポンとしては雑誌は定期購買、 WEB はいつでも更新可能。紙とWEB の良さをまとめるアイデアが欲しいんだろうなあと思いました。
チームC: from 国での配信最適化
ユーザーが興味を持つ記事を検索しやすくする、という課題に対して、興味がある国を選択する機能を提案していました。
質疑応答では審査員からトランプ氏がアフリカに、国内の美術館にオランダのといった場合はどの国にで起きた出来事になるのか？という質問がありました。
これは読者次第によるので結構判断難しいとは思いますが、編集者側から「我々で定義する事は可能」との事でした。公開されている記事を全て読む必要はないのだけれど関心がある国の記事は全て読みたいという読者もいると思うので良いアイデアだと思いました。
チームD: カード型レイアウト
WEB らしいレイアウトを提案。読みたい記事をフィルタリング、並び替えを行えるようにしていました。個人的にはよくできたデザインだったのでそのまま差し替えてもいいような気がしましたが審査員側からは色々な機能があり、なんの問題を解決したかったのかが伝わっていないようでした。
チームE: 有料記事の一定期間シェア機能
Facebook などで有料記事を行って期間シェアする機能を提案。審査員のうちの一人がずいぶんと Facebook における承認欲求のメカニズムに関心があったようでかなり好感触のプレゼンでした
チームF: 一度読んだ記事を見つけやすくする仕組み
我々は問題点として使いづらいから使いやすくしましょうというごく真っ当な改善案を提出しました。まあ割とありきたりの機能なのでだれもが予想のつく機能でした。残念ながら審査員の反応が芳しくありませんでした。
チームH: Tinder のように写真を選ぶサービス
クーリエジャポンは写真がきれいです。その写真だけで興味があるかどうかを選んで取捨選択する仕組みを提案。WEB ならではのサービスということでとても好評のサービスでした。
結果発表
編集長より結果発表。審査の基準は色々あり、審査員側でも紙媒体の延長で行くのかWEBならではで行くの議論が別れたそうです。
というわけで結果は以下の通り
- 1位: 15万円 チームH: Tinder のように写真を選ぶサービス
- 2位: クーリエジャポン1年無料 チームE: 有料記事の一定期間シェア機能
- 3位: クーリエジャポン6ヶ月無料 from チームC: 国での配信最適化
懇親会
参加せず
Hackathon で役に立つ技術
役に立った知識と、役に立つであろう知識を紹介します。
json-server
Single Page Application と json-server は Hackathon では強力な武器になると思いました。反面 Node.js の使い手が少ない為他のメンバーの負担が増えてしまい申し訳なかったです。
絵心
初日の午前に参加者全員がA4でのプレゼンを行ったのですが、やはりデザイナーさんとそうでない人ととでは見栄えが全く違いました。やっぱ絵心大事すねえ。
Line API
今回参加しなかったのですがオススメの記事の要約を Line Bot が教えてくれるという企画があり、すごく興味がありました。なんとなくですが Hackathon では頻出アイデアな気がするので実装経験ある人は戦力になるかも。
BitBucket
ソースコードを共有する方法として無料で team と private な repository を作れるのでとても便利です。
感想
所属したチームがなぜか全員サーバーサイドエンジニアになってしまい、フロントエンドができるのが私だけだったので私は実装を担当しました。そんなわけで React.js で SPA する事にしました。
とはいえ機能を実装する事はできましたが情報を伝えたり楽しませたりする能力が足りないなと感じました。今後はフロントエンド側もやる事が増えるのでまだまだ修行が山積みだなと思いました。
あとは他人のアイデアに触れてきた事が良い経験でした。うまく言えないのですが発想力を分けてもらえた気がします。たぶんこの感覚は参加してみないとわからないかも。
それからプレゼンを見て思ったのは実装が足りなくても伝える事はできるなと感じました。もし営業担当から「この機能がないと売りづらい」と言われて実装してあげるのも優しさだと思いますが、「いや、あなただったら上手く説明できる。他に大事な実装があるから私はそっちに注力します」とつっぱねるのもやっぱり大事なんだなと思いました。タイムイスマネー。
色々と自分自身に足りないものが見つかって補完がされた2日間でした。なのでハッカソンに出場した事ない人は参加すると良いとおもいます。
というわけで今回フロントエンドとして参加したわけですがデザインだったりインタラクティブなところだったりとかちゃんと勉強しないとだめだなあと思いました。もうしばらく勉強の日々が続きそうです。
ソースコード
今回使用したデモアプリはこちらにおいてあります。
