私たちのチームメンバーはチーム名にもなっているように、サークルの運営や務めていたバイト先が潰れたりと、何かしらの職を失ったメンバーで構成されています。 その過程と今回のKC3 2026のテーマである「"本当に欲しい"をカタチに」というテーマから私たちは、親に頼んでもサンタさんに頼んでももらえないようなまさにカタチのないもの"信頼"を思い浮かべました。 そこで、課題として人と人の間で存在している”信頼”をどのようにして表現するのか、というところで、絶対改ざん防止の意味や、技術的に難しいブロックチェーンを導入しました。 解決されることとして、保育園や老人ホームなどの様々な場面で使われている擬似的な通貨をオンライン上の仮想通過にすることによって紛失や不正利用防止が挙げられます。
TrusToken は「信頼」をテーマとした、複数のコミュニティ（ルーム）ごとにトークンを発行・管理・取引できるウェブアプリです。
- 複数ルーム管理(Home画面で表示)：大学サークル、バイト先、友人グループなど複数のコミュニティに属する人の各ルームごとのトークン管理
- トークン発行・移動：各ルームで独自のトークン（モザイク）を発行し、ユーザー間で送金可能(Payment画面で実行)
- ブロックチェーン連携：Symbol Testnet 上で取引を記録し、改ざん耐性と透明性を確保
- NFC 連携：カードかざしによるセキュアな認証と送金
- リアルタイム更新：socket.io によるプッシュ通知で状態変化を即座に反映
現代では、多くの人が複数のコミュニティに所属しており、大学のサークルやアルバイト先、友人グループ、オンラインコミュニティなどが挙げられます。しかし、従来の仕組みでは「どこか一つを選ぶ」ことを前提としているものも多く、複数のルームを持つことが十分に考慮されていないという課題から、本サイトでは複数のルームを作成できる仕様になっています。それぞれのルームごとにトークンを発行・管理できるため、コミュニティごとに役割やその価値を明確に分けることが可能です。
本サイトのフロントエンドは、大学の授業「ユーザビリティ工学」で学んだ内容を基に設計しました。設計において最も重視したのは、「誰もが直感的に操作できること」です。初めて利用するユーザーでも迷わず利用できるよう、情報設計と視覚設計の両方から工夫を行いました。
UIは、シンプルで分かりやすい構成を意識しています。ボタンのラベルには短く具体的な表現を採用し、専門用語を使用していません。ユーザーへ直感的に伝わる言葉を用いることで、ユーザーが次に取れる操作を自然に理解できる設計を心掛けました。これにより、スムーズな操作を実現しています。
本サイトでは、色数を最小限に抑えたことに加えて、「同じ役割を持つ要素には同じ色を使用する」というルールを設けています。例えば、主要なアクションを実行するボタンはすべて同じ色で統一しています。 これにより、ページが変わっても操作要素の意味が変わらず、ユーザーの負担を低減しています。また、色によって役割が視覚的に明確になるため、操作の予測可能性が高まり、簡単に操作を行うことができます。
さらに、情報の整理と視線設計にも注力しました。1画面につき1つの目的を明確にし、余白を確保しています。また、要素を中央に配置することで視線移動を最小限に抑え、ユーザーが迷うことなくスムーズに目的のページへ移動できる構造としました。
画面サイズが変化してもレイアウトが崩れない構造を実現しました。PCとスマートフォンどちらで開いてもレイアウトが崩れない設計になっています。
Symbol Testnet は Symbol ブロックチェーンのテスト用ネットワークで、実際のトークンやモザイクを扱わずに取引を試せる環境。
ここでは、ユーザー間のトークン移動や権限管理などの操作を ブロックチェーン上に記録 することで、取引履歴の改ざん耐性を確保。
各取引は ハッシュ値 と 署名 によってチェーン上で管理され、第三者が内容を改ざんするとハッシュが一致せず不正がすぐ検知可能。
状態変化をクライアントに即座に反映するため、WebSocket ベースの socket.io を利用。
通常の HTTP リクエストではクライアントはサーバーにポーリングが必要だが、socket.io を使うと サーバー側からプッシュで通知可能。
これにより、UI の即時更新や、取引完了通知などのリアルタイム性が必要な場面で高速かつ効率的にデータを同期できる。
argon2 を用いたパスワードハッシュ化により、平文パスワードが漏洩しても復号が困難。
argon2 はメモリ消費量と計算時間を調整可能で、ブルートフォース攻撃耐性が高い。
JWT (JSON Web Token) で認証状態を管理。
ログイン時にサーバーが JWT を発行し、クライアントは以降のリクエストでこのトークンを送信。
サーバーはトークンの署名を検証するだけでユーザー認証が可能になり、セッション管理が不要。
この組み合わせにより、安全で軽量かつスケーラブルな認証システム が構築できる。
ユーザーがアップロードした画像は、サーバー上でファイル名を UUID に置き換えることで、元のファイル名から推測される情報漏洩を防いでいます。元ファイル名との対応関係はデータベースで管理しており、アプリケーション側から必要に応じて参照可能です。
- ブラウザの制約回避
- Web NFC API は スマホのブラウザ（主に Android Chrome）限定 で、Windows PC のデスクトップブラウザではほぼ使用できない。
- USB接続のNFCリーダーをブラウザで直接扱うことはできないため、PowerShellなどのローカル環境を経由する必要がある。
- 残高をスマホでも送れるように
- ルーム管理者がトークン量を自由に増やせるように
- 支払いしかないから購入や交換機能欲しい（お菓子と交換できるように）
- 管理者と参加者で画面の見た目を変えたい（管理者モードと利用者モードで視覚的にわかるように）
- 宛先で一覧表示や文字を入力したら候補表示
- Frontend: React, TypeScript, Vite, socket.io-client
- Backend: Node.js, argon2, jsonwebtoken, symbol-sdk 3
- Infra: Docker, MySQL, Nginx
- Blockchain: Symbol Testnet