HangWat

https://github.com/Yuuuki16/HangWat
https://hangwat-front-898027105416.asia-northeast1.run.app/sign-up

Next.js

TypeScript

Docker

Node.js

PostgreSQL

休日の予定を正確に立てて、一日の予定を完璧に視覚化します。

Takuya Hasegawa

charlse

黒田康介

滝村瑛太

推しアイデア

「日程調整」と「相談」と「決定」をひとつの場所で完結!

作った背景

LINEで候補を投げ合うと、メッセージが流れて誰がどの日OKなのか分からなくなる

推し技術

モダンなフロントエンド 責務を混ぜないバックエンド

プロジェクト詳細

HangWat ──「で、結局何をする?」をなくすアプリ

そもそも HangWat って何?

友達やグループで「次いつ・どこで集まる?」を決めるためのアプリです。

名前の HangWat は、"Hang out"(集まる・遊ぶ)と "What / When"(何を・いつ)をくっつけた造語。集まりたい気持ちはあるのに、肝心の「いつ」が決まらないを片付けるのが狙いです。

アプリの世界は3つの登場人物でできています。

  • イベント … 「忘年会やろう」みたいな集まりそのもの
  • 時間枠 … 「12/20の20時」「12/23の12時」といった候補
  • ユーザー … 参加する人たち

ここにコメントで「昼ごはん麺たべたいな〜」とワイワイ相談を足して、最終的に「この枠で決定!」まで持っていく。画面も ログイン → ホーム → イベント作成 → イベント詳細 → 各候補枠の詳細 と、まさにこの流れに沿って並んでいます。

メインページ(figma)

image

推しアイデア

推したいのは、「日程調整」と「相談」と「決定」をひとつの場所で完結させたところ。

日程を出し合うのを全てLINEで行うと最終的な情報があちこち散らばって、結局「あれ、何時集合だっけ?」が起きる。

HangWat はそこを一本にまとめています。候補の時間枠を出して、その枠ごとにコメントで会話して、納得したらそのまま決定する。EventTimeline(候補のタイムライン表示)と CommentList(コメント一覧)が同じイベントの中に同居していて、「相談しながら決める」体験がそのまま画面になっているのがポイントです。

候補を1つずつ深掘りできる events/[eventid]/slots/[slotid] という階層もいい仕事をしていて、「この枠についてだけ話したい」がちゃんとできる。ざっくり全体を眺めるビューと、1枠を掘り下げるビューが分かれているのは、地味だけど実際に使うと効いてくる設計だと思います。

作った背景

グループで遊ぶ約束って、毎回だいたい同じところでコケます。

  • 「来週どっか行こ!」までは盛り上がるのに、日程の話になると急に止まる
  • LINEで候補を投げ合うと、メッセージが流れて誰がどの日OKなのか分からなくなる
  • 既存の調整ツールは日程は決まるけど、相談の会話は別アプリ
  • 決まったあとも「集合何時だっけ」を毎回スクロールして探す

この「乗り気なのに前に進まない」を技術で溶かしたい、というのが出発点に見えます。だから HangWat は単なる○×の出欠表ではなく、候補・会話・決定を地続きにした。集まりが流れずにちゃんと実現することそのものをゴールに置いているわけです。

チーム開発
  • Notionを用いたタスク、ドキュメント管理
  • image image
  • slackを用いたチームコミュニケーション -image
  • figmaを用いた画面ごとのレビュー image

推し技術

モダンど真ん中のフロントエンド

Next.js 16 / React 19 / TypeScript / Tailwind CSS v4。出たばかりのバージョンを攻めています。App Router を素直に使い、page.tsx は薄く保って、ローディングやエラーは loading.tsx / error.tsx といったフレームワークの作法に乗せる。

*機能ごとに区切ったディレクトリ設計**にしてます。features/auth、features/events の下を components(見た目)/ data(API通信)/ services(機能固有の判断)/ types(型)にきっちり分けていて、「画面からAPIレスポンスを直接触らない」とまでルール化されています。

責務を混ぜないバックエンド

Hono + TypeScript + Prisma + PostgreSQL。presentation → application → domain + infrastructure という、クリーンアーキテクチャの層分けを採用。「HTTP・ユースケース・ドメイン・DB実装を混ぜない」と明文化されています。

軽量な Hono にこの構造を載せているので、速くて、かつ後から育てやすい。短期開発で"動けばいい"に逃げず、層の責任を守ったのは技術力とチーム規律の両方が出ています。

開発体験を向上

  • pnpm workspace のモノレポ … front / backend をひとつのリポジトリでまとめて管理

  • Docker Compose … docker compose up --build でDB・API・フロントが一発で立ち上がる

  • OpenAPI / Swagger UI … /docs で API 仕様をそのまま確認でき、/openapi.json も配信

  • ヘルスチェック … /health でバックエンドとDB接続の生死を確認

  • Prisma Studio … ブラウザからDBの中身を覗ける

  • CI・git hooks・PRテンプレート … .github や .githoocks、docs/development/ 配下にコミット規約やPRルールを整備

  • AIエージェント運用の整備 … CLAUDE.md / AGENTS.md で「日本語で回答」「作業前にブランチ確認」「層を混ぜない」などのルールを明文化し、PR作成スキルまで用意。

  • レビューをしっかりと軽減 coderabbit を搭載してPRのファーストレビューを担当させています。

  • 挑戦ポイント

1. 「日程調整」ではなく「意思決定」そのものを設計

既存の日程調整サービスの多くは、「空いている日を集める」ことに特化しています。しかし実際には、日程が決まった後も

  • 何をする？
  • どこに行く？
  • 何時集合？

といった相談が続きます。

HangWatでは、

  1. 候補日時の作成
  2. 候補ごとの議論
  3. 最終決定

までを一つの流れとして設計しました。

単なる出欠管理ツールではなく、「グループの意思決定を支援するサービス」を目指したことが大きな挑戦です。

2. 候補ごとに議論できる構造

一般的なチャットアプリでは、すべての話題が同じタイムラインに流れてしまいます。

HangWatでは、

イベント
 ├─ 候補A
 │   └ コメント
 ├─ 候補B
 │   └ コメント
 └─ 候補C
     └ コメント

という構造を採用しました。

これにより、

  • 「この日なら参加できる」
  • 「この日は夜の方が良い」
  • 「この枠ならご飯も行けそう」

といった議論を候補単位で整理できます。

情報が埋もれず、スムーズに合意形成を行えるよう工夫しました。

3. ハッカソンでも保守性を意識した開発

短期間開発では「とりあえず動けばよい」という実装になりがちです。

しかしHangWatでは、

  • Frontend: Feature Based Architecture
  • Backend: Clean Architecture
  • OpenAPI
  • Docker Compose
  • CI/CD
  • AI Agent運用ルール

を整備し、開発終了後も継続して改善できる構成を目指しました。

短期開発と長期運用の両立に挑戦した点も大きな特徴です。

GitHubのPull Requestをモチーフにした体験

HangWatでは候補日時を、

  • 未確定
  • 議論中
  • 決定済み

という状態で管理します。

これはGitHubの

  • Open
  • Review中
  • Merged

という開発フローから着想を得ています。

開発者にとって馴染みのある体験を予定調整に取り入れることで、少しだけワクワクするUIを目指しました。

「予定を作る」ではなく「予定を育てる」

一般的なカレンダーアプリは予定を登録したら終わりです。

一方HangWatでは、

  1. 誰かが候補を追加する
  2. みんなで相談する
  3. 候補が増える
  4. 意見がまとまる
  5. 決定する

という過程そのものを重視しています。

予定を入力するためのツールではなく、みんなで予定を作り上げるためのツールとして設計しました。

HangWatが解決したい課題

現代では、

  • グループチャットの情報量増加
  • 日程調整の複雑化
  • コミュニケーションコストの増加

によって、

「遊びたい気持ちはあるのに予定が決まらない」

という状況が頻繁に発生しています。

結果として、せっかくの交流機会が失われてしまうことがあります。

HangWatが生み出す価値

HangWatは、

  • 日程調整
  • 相談
  • 意思決定

を一つの場所にまとめることで、

  • 友人関係の維持
  • コミュニティ活動の活性化
  • オフライン交流の促進

といった社会的価値を生み出します。

さらに、

  • 学生団体
  • サークル
  • 地域コミュニティ
  • イベント運営団体

などへの展開によって、サービスとしての価値も創出できます。

CSVとのつながり

HangWatは単なるスケジュール調整アプリではない！

「集まりたいのに集まれない」という摩擦を減らし、人と人とのつながりを生み出すことを目指しています。

人々の交流機会を増やすという社会的価値と、サービスとしての成長という経済的価値の両立を実現することで、CSV（Creating Shared Value）の考え方を体現しています。

一言で表すなら

HangWatは、日程を決めるアプリではなく、「みんなで集まる」を実現するための意思決定プラットフォームです。

候補・会話・決定をひとつにまとめ、人と人とのつながりを生み出すことで、CSV（Creating Shared Value）の実現を目指しました。

Takuya Hasegawa

@63122597e9729f48