サポーターズ ウインターハッカソン vol.7に参加しました
4人チーム（miniature-octo-guide）で、SpatialChatライクなUIでタブの音量調節をするChrome拡張を開発し、 約40人 17チームの中で最優秀賞をいただきました。 https://github.com/miniature-octo-guide/spatial-volume-controller https://talent.supporterz.jp/events/28d759c2-50b4-456d-889b-1f08abf6c053/ ツイート1 音声ボリュームをブラウザ上でコントロールすることで複数の講演を同時に視聴＆往来できる【Spatial Volume Control App】（電通大チーム）が最優秀賞を獲得！ 「講演を選び切れない」 「視聴しながら比較したい」 そんな課題とニーズに応える素晴らしい作品・・・！ #ウインターハッカソン #技育祭 — 楓博光@未来の技術者を育てる (@kaepon1219) February 28, 2021 ツイート2 最優秀賞いただきました！ 「Spatial Volume Control App」（Chrome拡張） https://github.com/miniature-octo-guide/spatial-volume-controller #技育祭 #ウインターハッカソン #ウインターハッカソンvol7 #サポーターズ — aoirint🎐 (@aoirint) February 28, 2021 内容 開発に使うOSは3人がWindows、1人がLinuxでした（macOSのテスト環境も用意はあった）。 開発経験は、Web系（Pythonなど） 3人、Unity・マイコン系 1人でした。 ハッカソンは全員初参加でした。 開発アイデアを集めたのち、実装可能性を検討している中で、ベースをChrome拡張としました。 当初はOSのAPIを叩くネイティブアプリ（スタンドアロンソフトウェア）としての実装を検討していました。 Windows Core Audio、macOS CoreAudio.framework、Linux PulseAudioのAPIを叩くことを考えていましたが、 いくつかの理由でネイティブアプリでの実装を取りやめました。 参考資料が少ない Windowsでの動作検証で、Chromeタブごとの音量制御ができなさそうだった プロセスごとの制御はできる マルチプラットフォームな実装が面倒 各OSごとのAPI呼び出し GUI実装 言語にはTypeScriptを選択しました。 TypeScriptの採用理由は、流行りの言語であること、型の記述によるデバッグ性・メンテナンス性が高いこと、あたりを考えていました。 全員簡単なJavaScriptを書いた経験はあったようですが、 テンプレートをいじった程度の簡単なコードを書いた経験があったわたしを除いてはTypeScriptの経験はなさそうでした。 しっかりしたChrome拡張を作った経験は全員ありませんでした。 準備期間で開発環境を用意しました（事前開発あり）。 Docker上で開発することを想定し、 GitHub上にOrganizationを作ってパブリックリポジトリでコードをホストし、 GitHub Actionsで自動コードチェック・ビルドする環境を整備しました。 実装課題はIssueを立て、 コードの共有は同一リモートリポジトリ内でブランチを切り、プルリクエストを作成し、 統合はプルリクエストのSquash Mergeですることにしました。 ドキュメントをNotion（1000ブロック制限付きのチーム）に作成し、 コミュニケーションはDiscord（通話あり）とハッカソン用Slackを使いました。 プロジェクトテンプレートの生成にはmazamachi/generator-chrome-extension-kickstart-typescriptを使いました。 https://github.com/mazamachi/generator-chrome-extension-kickstart-typescript Linterにはts-standardを使いました。 ...