はじめに

CrunchTimerのメンバー4人でサポーターズ主催のハッカソンに出場しました。

ハッカソンとは、ハック（Hack）とマラソン（Marathon）を掛け合わせて造られた造語です。ITエンジニアやデザイナーなどが集まってチームを作り、特定のテーマに対してそれぞれが意見やアイデアを出し合います。そこから決められた期間内でアプリケーションやサービスを開発し、その成果を競い合うイベントです。その開発の際にはマラソンのように数時間から数日間といった時間、プログラミングに没頭することからマラソンに例えられています。ちなみにハッカソンの元になっているハック（Hack）という言葉ですが、日本ではハッキングなどネガティブな印象がありますが、本来はハードウェアやソフトウェアに精通した人たちが行うエンジニアリングを意味する言葉です。

この記事では、土日2日間+αの開発ではありますが技術選定など開発フローを紹介できたらなと思います。

アイデア

水曜日にSlackで何を作りたいかを募り、20個近く案が出ました。それをもとにmiroを用いてプロダクト選定を行いました。

具体的には軸を4つ作りマッピングしました。

1. 課題解決<->エンタメ

2. 広範囲<->ニッチ

3. インパクト強<->弱

4. 実現可能性高<->低

今回のハッカソンのテーマや評価基準に合わせたグルーピングによりプロダクトを確定しました。

プロダクト内容

クリエイターのバーチャルPCにファンがステッカーを貼り付ける(課金形式で)ことでクリエイターを手軽に応援できるというサービスです。

近年の一般人の有名人化に沿ったサービスです

設計

簡易的なUX設計をUXブループリントを用いて行いました。

作成物

ポインタで選択したステッカーを晴れるようになっています。

機能

• Google認証
• SNS共有
• 画像合成、トリミング
• 決済機能
• 画像ストレージ
• OGP
• データベース

使用技術

• Next.js
• React
• TypeScript
• Vercel (デプロイ)
• Firebase (認証)
• Stripe (決済)
• TailwindCSS
• Recoil

開発にあたって

全員リモートでの開発だったため、GitHubのissues, Projects, Miroを活用してチーム間でのコミュニケーションをこまめに行いました。

努力賞の獲得

今回の賞は1つが最優秀賞、5つが努力賞でしたが、ビジネスモデルの考慮や、課題解決性、新しい仕組みを評価していただき努力賞をいただけました。

最後に

卒業した中島くんの最後の共同開発で初ハッカソンで賞をいただけたことは良い思い出になりました。

別のメンバーでU-22プログラミングコンテスト2021に出場するのでまたそちらの記事も書こうと思います。