BOARD
BOARD（Browser-based Open Academic Realtime Drawing）は、ブラウザ上でリアルタイムに描画を共有できるP2Pグループホワイトボードアプリケーションである。大学の講義やゼミにおけるグループワークでの利用を想定しており、参加者全員が同じキャンバス上にフリーハンドで描画したり、付箋を貼り付けてメモを共有したりすることができる。
通信にはWebRTCのP2P（Peer-to-Peer）技術を採用しているため、サーバーを介さずに参加者同士が直接データをやり取りする。これにより、低遅延でスムーズなリアルタイム共有を実現している。インストールは不要で、ブラウザでURLにアクセスするだけで利用できる。
概要
BOARDは、P2P（Peer-to-Peer）技術を使用したリアルタイム共同描画ホワイトボードである。サーバーを必要とせず、参加者のブラウザがWebRTCを通じて直接通信を行う。大学の講義やゼミにおけるグループワークで、参加者全員が同じキャンバス上にフリーハンドで描画したり、付箋を貼り付けてメモを共有したりすることができる。
すべての操作はルーム内の全参加者にリアルタイムで同期される。URLを共有するだけで、すぐにグループワークを開始できる。
主な機能
- ルームの作成・参加 — URLを共有するだけで、すぐにグループワークを開始できる
- フリーハンド描画 — マウスやタッチ操作でキャンバスに自由に線を描ける
- 消しゴム — 描画した内容を部分的に消去できる
- 元に戻す（Undo） — 直前の自分の操作を取り消せる
- キャンバスクリア — キャンバス上の全描画を一括で消去できる
- テキスト入力（付箋） — キャンバス上にテキスト付きの付箋を追加・移動・編集できる
- 画像エクスポート — キャンバスの現在の状態をPNG画像として保存できる
動作環境
本アプリケーションは以下のブラウザの最新版に対応している。
| ブラウザ | 対応 |
|---|---|
| Google Chrome | ✔ 最新版 |
| Mozilla Firefox | ✔ 最新版 |
| Microsoft Edge | ✔ 最新版 |
| Safari | ✔ 最新版 |
インストールは不要である。ブラウザでURLにアクセスするだけで利用できる。1つのルームに同時に参加できる人数は最大10人である。
ルームの作成と参加
トップページの画面構成
アプリケーションのURLにアクセスすると、トップページが表示される。トップページには「ルームを作成」ボタンと、ルームURLの入力欄および「参加」ボタンが配置されている。
新しいルームを作成する
- トップページで 「ルームを作成」 ボタンをクリックする
- 自動的に新しいルームが作成され、ホワイトボード画面に遷移する
- 画面上部のツールバーに表示される ルームURL を他の参加者に共有する
既存のルームに参加する
ルームに参加するには、以下の2つの方法がある。
方法1：共有されたURLを直接開く
ルーム作成者から共有されたURLをブラウザのアドレスバーに入力するか、リンクをクリックして開く。自動的にルームに参加し、ホワイトボード画面が表示される。
方法2：トップページからURLを入力して参加する
- トップページの 「ルームURLを入力」 欄に、共有されたルームURLまたはルームIDを入力する
- 「参加」 ボタンをクリックする
- ホワイトボード画面に遷移し、ルームに参加する
ルームURLの共有
ホワイトボード画面上部のツールバーに表示されている 「コピー」 ボタンをクリックすると、ルームURLがクリップボードにコピーされる。コピーしたURLをメール、チャット、SNSなどで他の参加者に送ることで、簡単にルームを共有できる。
ホワイトボード画面の見かた
ホワイトボード画面は、上部のツールバーと、その下に広がるキャンバス（ホワイトボード領域）で構成されている。
ツールバー
ツールバーには以下のボタンが配置されている。現在選択中のツールはハイライト表示される。
| ボタン | 機能 |
|---|---|
| ペン | フリーハンド描画ツールに切り替える |
| 消しゴム | 消しゴムツールに切り替える |
| 付箋 | 付箋追加モードに切り替える |
| 戻す | 直前の自分の操作を取り消す |
| クリア | キャンバス上の全描画を一括消去する |
| 保存 | キャンバスをPNG画像としてダウンロードする |
参加者数の表示
ツールバーの右側に、現在のルームの参加者数がリアルタイムで表示される。新しい参加者がルームに入退室すると、自動的に人数が更新される。
キャンバス
ツールバーの下に広がる白い領域がキャンバスである。選択中のツールに応じて、マウスやタッチ操作で描画や消去を行うことができる。付箋はキャンバスの上にオーバーレイとして表示される。
描画ツールの使いかた
フリーハンド描画（ペン）
- ツールバーの 「ペン」 ボタンをクリックして、ペンツールを選択する
- キャンバス上でマウスの左ボタンを押したままドラッグ（またはタッチ操作で指をスライド）すると、軌跡に沿って線が描かれる
- マウスボタンを離す（または指を離す）と、1つのストロークが確定する
| 項目 | 仕様 |
|---|---|
| 描画色 | 黒（固定） |
| 線幅 | 2px（固定） |
| 同期 | 描画した内容はリアルタイムで全参加者のキャンバスに反映される |
消しゴム
- ツールバーの 「消しゴム」 ボタンをクリックして、消しゴムツールを選択する
- キャンバス上でマウスの左ボタンを押したままドラッグ（またはタッチ操作で指をスライド）すると、軌跡に沿って描画が消去される
| 項目 | 仕様 |
|---|---|
| 消しゴムサイズ | 20px（固定） |
| 同期 | 消しゴムによる消去もリアルタイムで全参加者に同期される |
元に戻す（Undo）
直前の自分の操作を取り消したい場合は、以下のいずれかの方法で実行できる。
- ツールバーの 「戻す」 ボタンをクリックする
- キーボードショートカット
Ctrl + Z（Macの場合はCmd + Z）を押す
キャンバスクリア
- ツールバーの 「クリア」 ボタンをクリックする
- 確認ダイアログが表示されるので、内容を確認して実行を承認する
- キャンバス上の全描画が消去される
付箋の使いかた
付箋を追加する
- ツールバーの 「付箋」 ボタンをクリックして、付箋モードを選択する
- キャンバス上の付箋を配置したい位置をクリックする
- 黄色い付箋がクリックした位置に表示される
| 項目 | 仕様 |
|---|---|
| サイズ | 横150px × 縦100px（固定） |
| 背景色 | 黄色（固定） |
付箋にテキストを入力する
追加された付箋のテキスト領域をクリックすると、直接テキストを入力・編集できる。入力した内容はリアルタイムで全参加者に共有される。
付箋を移動する
付箋の右下にあるドラッグハンドル（ ● マーク）をマウスで押したままドラッグすると、付箋をキャンバス上の任意の位置に移動できる。テキスト入力中に誤って付箋が動いてしまうことを防ぐため、移動はドラッグハンドルからのみ行える設計になっている。移動結果はリアルタイムで全参加者に同期される。
付箋を削除する
付箋の右上に表示されている 「×」 ボタンをクリックすると、その付箋が削除される。削除は全参加者のキャンバスにも即座に反映される。
その他の操作
画像エクスポート（PNG保存）
- ツールバーの 「保存」 ボタンをクリックする
- キャンバスの現在の状態（描画内容および付箋を含む）がPNG画像としてダウンロードされる
注意事項・制限事項
- データの保存について — 本アプリケーションはデータの永続化を行わない。ブラウザを閉じたり、ページを離れたりすると、キャンバス上の描画や付箋の内容は全て失われる。グループワークの成果を残したい場合は、必ず終了前に画像エクスポート機能を使ってPNG画像を保存すること
- 同時接続数の上限 — 1つのルームに同時に参加できるのは最大10人まで。10人を超える場合は、複数のルームに分けて利用すること
- 音声・映像通話について — 本アプリケーションは描画の共有に特化しており、音声通話やビデオ通話の機能はない。音声でのコミュニケーションが必要な場合は、別途ビデオ会議ツールなどを併用すること
- 同時編集時の競合について — 複数の参加者が同じ場所に同時に描画した場合、操作はタイムスタンプ順に反映される。高度な競合解決の仕組みは実装されていないため、ごくまれに参加者間で描画の表示順に微小な差異が生じる可能性がある
- 描画設定について — 現在のバージョンでは、ペンの色（黒固定）、線幅（2px固定）、消しゴムのサイズ（20px固定）、付箋の色（黄色固定）・サイズ（150px × 100px固定）は変更できない
よくある質問（FAQ）
アプリケーションのインストールは必要ですか？
いいえ、インストールは不要である。対応ブラウザでURLにアクセスするだけで利用できる。
ルームに参加するにはアカウント登録が必要ですか？
いいえ、アカウント登録は不要である。共有されたルームURLを開くだけで参加できる。
ルームURLはどうやって他の人に伝えればよいですか？
ホワイトボード画面上部の「コピー」ボタンをクリックすると、ルームURLがクリップボードにコピーされる。コピーしたURLをメール、チャットアプリ、SNSなど任意の方法で共有できる。
途中からルームに参加した場合、それまでの描画内容は見られますか？
はい、途中から参加した場合でも、既存の参加者からキャンバスの現在の状態が自動的に同期される。参加時点までの描画内容と付箋がそのまま表示される。
他の参加者の描画をUndoで取り消すことはできますか？
いいえ、Undo機能で取り消せるのは自分自身が行った操作のみである。他の参加者の描画を消したい場合は、消しゴムツールを使用する。
ブラウザを閉じてしまいました。描画データは復元できますか？
ブラウザを閉じるとデータは失われ、復元することはできない。重要な内容は、こまめに画像エクスポート機能を使って保存することを推奨する。
スマートフォンやタブレットでも使用できますか？
対応ブラウザの最新版がインストールされていれば、スマートフォンやタブレットからも利用可能である。タッチ操作でフリーハンド描画や付箋操作を行うことができる。