kugi's notebook

やったこと、思ったことなどつらつらと書きます

JPHACKS2020参加レポート~Miro大活用とフラクタルスプリントへの挑戦~

はじめに

こちらは

の記事です。(片方遅刻してしました...ごめんなさい🙇‍♂️)

今回は10月末から11月末にかけて行われたJPHACKS2020の参加レポートになります。

昨年に引き続き、2年目の参加です!!昨年の参加レポートはこちら💁‍♂️

kugi-masa.hatenablog.com

昨年はCammelリーダーのtyanioと私の2人で出場していました。 今年度は私にとって学生最後の年、Cammelみんなでハッカソンに出たいという私の強い想いもあり、チーム7人で出場することになりました。

(完全に余談ですが、最近Cammelのページが公開されました🎉)

今年はオンライン

今年のJPHACKS(ジャパンハックス👈ジェーピーじゃないですよ!!ここ重要)はCOVID-19の影響もあり、フルオンライン開催でした。

今年に入ってオンラインのハッカソンに参加したり、主催したり(笑)オンラインハッカソンは初めてではありませんでしたが、参加者およそ400名のここまで大規模な学生ハッカソンをオンラインで実現できるのは、やはりJPHACKSだからこそだなと感じました。

オンライン開催とのこともあり、昨年とは異なり、Hacking Sprint(実際にプロダクトを開発する期間)は2Dayではなく1Weekに。そして、Hacking Spritの前には運営のみなさんによるLearning Sprintという環境構築やチーム開発などの学習イベントが開催されました。

アイディアソンワーク

私たちCammelはアイディアソンワークに参加し、Miroを使ってアイディアの分散・発散・収束について学びました。

f:id:kugi_masa:20201217000630p:plain
ハッカソン」を中心にマンダラートを作成しました。(草が生えたw)

また、出たキーワードから9つのキーワード(転用、応用、変更、拡大、縮小、代用、置換、逆転、結合)を元にさらに発散させる「オズボーンのチェックリスト」はとても学びになりました。全く想像していなかったアイディアが出るので、既に出たキーワードやアイディアからさらに発展させる指標としてとても良いなと感じました。

オズボーンのチェックリストとは?|経営キーワード集 | オンライン創業スクール・Zoomセミナーの講師をお探しならジャイロ総合コンサルティング

その後は、アイディアを収束へ。出たアイディアを元にイメージ図やターゲットユーザ(ペルソナ)について考えていきました。

f:id:kugi_masa:20201217001945p:plain
なんだこれは...

準備期間としてこのようなワークイベントを開いていただけてとてもありがたかったです。日程の関係で参加はできませんでしたが、他のワークにも参加してみたかったです。

1Weekの開発

Best Team Collaboration Award

受賞項目がたくさんあるJPHACKSですが、 今年からBest Team Collaboration Awardという賞が追加されました。こちらの賞は「チーム開発実践入門」という書籍を元に採点項目が設けられ、それらの合計点数の最高得点を獲得したチームに送られる賞でした。

アジャイルの理念を取り入れて開発すること目標として掲げ、これまで開発を行ってきたCammel。 そして、そこでスクラムマスターのような立ち位置でこれまでアジャイルをチームに共有してきた私としては非常に獲得したい賞でした。

採点項目として以下のようなものがありました。(以下の項目は一部)

  • [バージョン管理] チームメンバーの複数人がリポジトリに登録された(チームメンバー)
  • [バージョン管理] 一度でもチームの誰かがリポジトリのmain(master含む)にソースコードをコミットした
  • [チケット管理] Issueが登録されている
  • [CI/CD] SlackにGitHubやCIのログ等をインテグレーションしている

毎日その日までのチームの点数がslackのリーダーボードチャンネルに流れるようになっていて、コンテスト感がありとてもワクワクしました。

f:id:kugi_masa:20201217004340p:plain
slackのリーダーボードチャンネル

各チームのプロジェクトの情報は全てGitHub上に公開されています。 その日の上位のチームが何をしているかの調査をするためにも、上位チームのリポジトリ情報をチームのチャンネルに流すなどしていました笑

f:id:kugi_masa:20201217005057p:plain
前回からの変動に+をつけました

結果的には4位と受賞は逃してしまいましたが、今回のBest Team Collaboration Awardを期に挑戦してみた内容(CI/CDなど)もあったのでチャレンジできてよかったと思います。

Miroを活用してデザインのモックを作って共有したり、うさぎ組のkyonさんのフラクタルスプリントを参考に開発に取り入れてみたりしていたのでそういった点もアピールして評価してもらいたかったなとも思いました。 (自動採点で無くなったら運営のみなさんが鬼大変になってしまうとは思いますが...笑)

kyon-mm.hatenablog.com

Miroを活用

今年は各チームごとにMiroのボードを用意していただきました。 普段の開発でもMiroは使っているのでみんな使い方には慣れていましたが、1週間の開発でフラクタルスプリントにも挑戦してみたので、より使いやすいように以下のような決まりを作りました。

  • 付箋のサイズは基本的に「Mサイズ」!!!
  • 背景パネルは必ず「ロック
  • 付箋の「」に意味合いを持たせる
  • エリア」を分けて活用

f:id:kugi_masa:20201217011901p:plain
付箋のサイズはM!!!

Miroの付箋のサイズは任意に変更できますが、明示的にS・M・Lと固定することもできます。Miroは割と広めにスペースを取れるので、必ずMがいいというわけではありませんが、サイズに基準を作っておくことに意味があると感じました。これはボードを見ている時の倍率(右下の%)を自然と合わせるためです。Miroは簡単にマウスのスクロールなどでズームイン・ズームアウトができてしまいます。他のメンバーのカーソル位置は表示されているのでどの位置で作業をしているかわかっても、付箋のサイズがバラバラであれば、同じ視点から見たボードが共有しづらくなります。

f:id:kugi_masa:20201217012551p:plain
背景パネルはロック

普段Miroを使うときは領域を分けるために「背景パネル」を置いています。ここで重要なのが錠前マークでロック🔒することです。ロックをしておかないと付箋などの移動の際に背景が動いてしまってフラストレーションが溜まってしまいます😤。

f:id:kugi_masa:20201217012849p:plain
自分の色はコレダァァァァ!!!

1週間同じボードを使うため、毎回「コレ誰の?」とらないように自分の使う色を予め決めて付箋を使うことにしました。

f:id:kugi_masa:20201217015350p:plain
エリアを分けて活用!!

また、今回は進捗管理やモックの共有、バックログ管理などもMiroで統一して行ったので作業場所をわかりやすいように分けました。

フラクタルスプリントへの挑戦

基本的に開発はDiscordで通話をしながらGoLiveでのモブプロやペヤプロ、デザインチームはMiroを使ってモック作成を行いました。

f:id:kugi_masa:20201217020215p:plain
1Dayボード

今回のハッカソンでは、1WeekSprint >> 1DaySprint >> 1HourSprint のフラクタルスプリントで取り組んでみました。

1HourSprint

まずは最小単位の1HourSprintでは、1時間ごとにできそうだと見積もったタスクをTODOに列挙し、1時間終わったら振り返りします。ハッカソン中は学業との両立もあるのでこの1HourSprintは作業できる人ができる時間にバックログからタスクをとってやっていきます。

実はハッカソンの序盤が学会と丸かぶりしてしまい、最初の数日は開発できませんでした。 その分空いた時間でMiroを覗いたり、夜の進捗共有には参加して困り事を洗い出すなど、本当にスクラムマスターのような立ち振る舞いをしていました。(意外と見るだけならスマホ版のMiroも良さげでした👀)

今回1HourSprintに挑戦したいと提案してくれたメンバーからは以下のような前向きな意見がでています。

  • 1時間で強制的に手を止めるので気持ち新たに次の1時間に挑める
  • 途中で参加した人も何をやっていたかがすぐにわかる

1DaySprint

1日の区切りとしてだいたい18:00~18:30の時間でDailyScrum(朝会ならぬ夜会)を開きました。DailyScrumでは以下のようなことを行いました。

  • 進捗共有
  • 困り事、心配事の解消(ここでモヤっと🦠をスッキリに✨)
  • バックログリファインメント
  • 次の1DaySprintですることの確認

DailyScrum後にそのまま作業することが多かったですが、一応1Dayの区切りはDailyScrumとして、DailyScrum以降は次の日の1Dayボードに移動して作業しました。

1WeekSprint

この1DaySprintをHackingSprintの七日間繰り返すことで1WeekSprintとしました。

作ったプロダクト name_it

ここまではチームとしての1週間の取り組みについてでしたが、ここからは作ったプロダクトについてお話ししたいと思います。

まずは、デモ動画をご覧ください。

www.youtube.com

name-it-38fb8.web.app

name_itは自分が悩んでいる変数名やメソッド名を投稿し、 みんながアンケートに投票や更なる選択肢の追加などを行ってよりよいネーミングを共有していくエンジニア支援サイトです。

元々は気軽にコードレビューをもらえるサイト感情日記という自分のその日の感情を色として日記に記録できるアプリの2つでアイディアがわれていました。そこで、挙げられていた3つの評価基準([問題着眼点・着想点]、[実行・実現可能性]、[完成度・動作性])に着目してさらに深堀をしていく中で、変数命名を投票で決めるというアイディアが生まれました。

「感情どこ行った...??」という声が聞こえて来そうですが、 感情日記はハッカソンで作るのではなく、時間をかけて普段の開発で作りたいねという話もありコードレビュー寄りのアイディアになったという裏話もあります。

f:id:kugi_masa:20201217022956p:plain
投票で最終的に変数命名投票サイトに

Twitterで実際に変数の命名などで時間をかける人がいるかなども予め調査をしました。

結果としては、予選落ちでFinalistAwardへは進出できませんでしたが、動くものを1週間で作りきれたことフラクタルスプリントという新しい取り組みに挑戦できたことは私たちチームとしてとても価値のあることだったと思います。

フィードバックでもいただいたように、「回答を投票する側のメリット」や「命名に悩む人はすぐに回答が欲しいのに待たなくてはならない」といったユーザの視点、実際使ってもらう人の視点を踏まえた機能を早い段階で取り入れるべきだったと思います。

f:id:kugi_masa:20201217024517p:plain
1週間のバックログ

まとめ

これまで2年間Cammelでアジャイルの手法を取り入れ開発を行ってきて、スプリントをまわす習慣やモブプロ、振り返りなどは身についてきたと今回のハッカソンで実感できました。そしてハッカソンを通して、私たちのチームの弱点は私たちのプロダクトを使うユーザプロダクトをどのように、なぜ使うのかという点を踏まえて開発する力が弱いことだと感じました。開発が進んで行くにつれ、私たちのプロダクトのペルソナが「プロダクトを求めるユーザ」ではなく「プロダクトが求める、プロダクトありきのユーザ」になってしまっていたと感じます。(今回の例だと、私たちのユーザは「回答が来るまで辛抱強く待てる人」と思ってしまっていた)

これは特に最初のペルソナ定義が曖昧のまま開発が進んでしまうと、尚更陥りやすいことだとも思いました。 時間のないハッカソンの場合は最初に時間をかけて物事を決めたり、途中で手を止めてプロダクトの根幹の部分を見つめ直して手戻りするということはなかなかやりにくいと思います。しかし、使ってもらうものをユーザに届けるためにはプロダクトのペルソナを考えて開発することは非常に大切です。早い段階で一度手を止めてプロダクトについて見つめ直す時間(ドッグフーディング🐶)ユーザについて考える時間をとることがハッカソンでは重要になってくると改めて学ぶことができました。

また、今回挑戦したMiroの活用法やフラクタルスプリントのエッセンスは今の開発にも活かせていると思います。

Finalistに2連続で進出できなかったことは悔しいですが、結果が全てではありません。 今回メンバーには少々無理を言って全員参加に踏み切りましたが、全員参加できてよかったと言ってくれて嬉しかったです。 学生としてのCammel最後の年度に(先日引退はないよと言われました笑)本当にいい思い出ができたと思います。 メンバーには感謝です。

そして運営のみなさんも本当にありがとうございました!!! (オフ会わいわい楽しかったです笑)

私は今年度で修了しますが、残り5人は来年度まで学生です。 来年もJPHACKSに出場するかはわかりませんが、私としては出て欲しいですね笑

やったこと

  • チーム全員でハッカソンに参加してname_itといい思い出を作った

わかったこと

  • チームの弱点が見つかった

次やりたいこと

  • チームの弱点をチームで補っていく