Kanpai!

乾杯すると友達になれる新しいサービス、Kanpai!

デモ動画

デモ動画はこちら

レポジトリ

ハードウェア | WEB UI | デバッグツール

製品概要

背景(製品開発のきっかけ、課題等）

コロナによる制限がなくなり、オフラインのイベントや懇親会が増えてきました。しかし、オフラインの懇親会では、以下のような課題が存在します。

• 話すきっかけがなかったり、知らない人に話しかける勇気がない
• 連絡先の交換を忘れてしまい、その場限りの関係なってしまうことが多い

私たちが開発した「Kanpai!」では、乾杯の動作に合わせて SNS の交換を行うことができます。これにより、話すきっかけが生まれ、また、SNS の交換を忘れることもありません。 会場にプロジェクターがあれば、会場内の総乾杯数を表示し、会場の盛り上がりを演出することもできます。

製品説明（具体的な製品の説明）

【乾杯で友達になる】カップホルダー型デバイス 例えば JPHACKS の懇親会…話しかけるきっかけや勇気がない時、また話しかけることができてもその場限りになってしまうことありませんか？

「SNS 交換」と「話しかけやすくなる」という価値を “乾杯” に付与することで新たな乾杯を提供します！

機能

1. カップホルダーを使って乾杯をすると、SNS が自動で交換。
2. 乾杯するごとに他の参加者のプロフィールがアンロック。目指せ全員と乾杯！
3. 会場全体の総乾杯数がプロジェクターで見える。会場で盛り上がろう！

UI

特長

1. つい乾杯したくなるデザイン

加速度センサにより乾杯を検知すると、カップホルダー型デバイスの中にある LED が光り、さりげなく盛り上がりを演出します。アプリ上には乾杯した回数が表示され、乾杯した人のプロフィール画面がアンロックされていきます。全員との乾杯を目指すもよし、乾杯を口実に話しかけるもよし、つい乾杯したくなるデザインを目指しました。

会場にプロジェクターやスクリーンがあれば、全員の総乾杯数を表示することもできます！

2. 乾杯した相手と簡単に繋がれる

懇親会が終わった後は、乾杯した相手のプロフィール画面をチェックしましょう！乾杯した人とは自動で SNS アカウントの交換が行われているため、すぐにフォローすることができます。

3. 話題に困ったときは...

初めての人と乾杯すると、その人のプロフィールをアプリ上で確認することができます！話題に困ったら、プロフィールをちら見して共通の話題を探してみましょう。

解決出来ること

「Kanpai!」は、懇親会で、様々な人に話しかけるきっかけを提供します。また、連絡先の交換を通じて、懇親会以降もつながることができます！

SNS 交換 と 話しかけやすくなる という価値を"乾杯"に付与します！

今後の展望

機能面

• コップにディスプレイをつけて、利用者のアイコンを表示

  • イメージ:

• 話したい話題に応じて、カップの LED の色を変える

  • アプリ上で話したい話題を選ぶと、カップの LED の点灯色が変化する機能を実装する予定です。例えば、技術的な話をしたい人は赤、ゲーム好きは青、と言ったようにカップを光らせることで、話したい話題をアピールし、話しかけるハードルを下げることができます。
  • イメージ:

• 話の種になる質問項目のカスタマイズ

  • 利用開始時に、話の種となるいくつかの質問を用意しています（「どこからきましたか？」「得意な領域は？」など）。この質問事項を、イベント主催者が自由にカスタマイズできる機能を実装予定です。
  • 

• 会話内容の記録と要約

  • レコーディング機能を追加し、「誰と乾杯した時に、どんなことを話したのか」を記録することで、後からこの人誰だっけ？になることを防ぎたいと考えています。 Whisper や ChatGPT などを活用して実現したいと考えています。

技術面

• 乾杯の検知を機械学習で行う
  • 現在は加速度センサーの値が閾値を超えたら乾杯とみなす実装。
  • 機械学習を用いて、より正確な乾杯の動作の検知を行う予定です。

注力したこと（こだわり等）

• 乾杯が発生した後、プロフィールを交換する処理は、ハードウェアレベルの通信、Bluetooth Low Energy、Firestore のリアルタイムリッスンの仕組みを組み合わせて実装しています。ハードウェアレベルでは、加速度センサによる乾杯検知と、赤外線によるユーザー ID の交換を行なっています。取得したユーザー ID は BLE を利用してアプリに送信され、アプリがサーバーにアクセスし相手の情報を取得します。

• 【ハードウェア】カップホルダーは、紙コップ・缶のどちらにも対応しています！

• 【ハードウェア】3D プリンタで M5Capsule を収納するパーツを作成し、カップホルダーとして問題なく使える形にしました

• 【デザイン】楽しい雰囲気を感じられるグラフィカルな UI とイラスト（自作） -【デザイン】UI と発表資料のブランドを統一

-【実装】赤外線（ハードウェア間）、Bluetooth Low Energy（ハードウェア<->アプリ）、アプリ<->Firebase の通信を 2 日間で実装 -【実装】ユーザー向けのネイティブアプリと、会場で投影する用の Web アプリを実装

開発技術

活用した技術

フレームワーク・ライブラリ・モジュール

• アプリ: Flutter, Firebase (Firestore, Authentication)
• 会場表示用ページ: React, TypeScript
• デバッグツール: Next.js, TypeScript

デバイス

• M5Capsule（加速度センサ, 赤外線）
• BLE (Bluetooth low energy)

独自技術

ハッカソンで開発した独自機能・技術

• 独自で開発したものの内容をこちらに記載してください
• 特に力を入れた部分をファイルリンク、または commit_id を記載してください。