名前抽選・チーム分けツール

このツールは，入力されたメンバーの中から1名を抽選で選出する機能と，複数のグループにランダムにチーム分けする機能を持っています．まずはじめに，データを入力する手順と出力の前提について解説します．

メンバーの登録は画面上に用意された入力エリアに対して行います．ここでは参加者の名前や項目を，1行につき1件ずつ改行して入力する必要があります．一行のなかにカンマや空白スペースを挟んで複数の名前を並べたとしても，個別のメンバーとして自動的に分割される機能はありません．

入力されたデータは行ごとに処理されます．行の前後にある不要な余白は自動的に取り除かれ，何も入力されていない空行は抽選候補のリストから外されます．

実際に試せる入力例として，5人のメンバーを登録する場面を想定します．テキストエリアの一行目に佐藤，エンターキーを押して改行し，二行目に鈴木，同様にして高橋，田中，伊藤と入力していきます．これで5人の候補者がシステムに正しく認識されます．

入力時の重要な注意点として，同姓同名の人物が複数いる場合の書き方があります．システムは重複する名前を自動で一つにまとめることはせず，入力された行の数だけ別々の候補として扱います．しかし，入力エリアに佐藤と2行書き込んだ場合，抽選結果やチーム分けの画面でも単に佐藤とだけ表示されるため，出力結果を見たときにどちらの佐藤さんが選ばれたのかを区別することができなくなります．

同姓の人物が複数いる場合は，佐藤（営業部），佐藤（開発部）のように所属を併記するか，あるいは佐藤A，佐藤Bのようにあらかじめ識別子を添えて表記を分けて入力し，出力画面で確実に個人の区別がつくように準備してください．

入力が終わった後，抽選・代表者選出のタブを開くと，候補者の中から1名をランダムに選ぶ機能を利用できます．抽選処理にはJavaScriptのMath.random()が使われています．

画面上のボタンを押下すると，すぐさま抽選プロセスが一度実行され，画面に表示される名前の切り替えが始まります．このとき，内部のタイマー間隔の初期値である100msにすぐさま25msが加算され，最初の待機時間は125msとなります．その後は，表示が切り替わる間隔を25msずつ伸ばしていき，最後に表示された名前が当選となります．

このスロット風の演出によって，結果が確定するまでの様子を画面上で確認することができます．

当選者が確定すると，画面には大きくその人物の名前が表示されます．表示された名前のすぐ下には「名前をコピー」ボタンが配置されており，このボタンを押すことで，選ばれた人物の名前が直接クリップボードへと送られます．文字をドラッグして手動で選択する手間をかけずに，正確な結果をテキストとして記録することが可能です．

この抽選機能において留意すべきは，再抽選を行った際の動作です．本ツールには，一度当選した人を次回の抽選候補から自動的に除外する機能は備わっていません．そのため，同じメンバーリストのまま続けて抽選ボタンを押した場合，直前に選ばれた人物が再び候補に残り，連続して選ばれる可能性があります．

また，過去の当選履歴を保存して一覧で表示するような機能もありません．複数の代表者を順番に決めていくような場面で利用する際には，誰が当選したかをその都度手元のメモに残すか，入力エリアに戻って当選者の名前を手動で一行ずつ削除してから次の抽選を行うといった運用上の工夫が必要になります．

事前の重み付けによって特定の人が選ばれやすくなるような機能もありません．

チーム分け・整列のタブでは，入力された参加者を任意の数のグループに振り分けることができます．この機能では，Math.random()を用いたFisher-Yatesシャッフルのアルゴリズムに従ってリストの順番を入れ替え，その後各グループへ順番にメンバーを配置していきます．この配分の仕組みにより，各グループ間の人数差は最大でも1になるように保たれます．

グループの数は画面のプラスボタンやマイナスボタンを操作して変更でき，初期値は2となっています．参加人数と設定したグループ数の関係によって，出力結果の読み方が変わります．

具体的な例として，入力エリアに5人の名前を登録し，グループ数を2に設定して実行した場合を考えます．出力画面にはグループ1とグループ2の枠が表示され，全体の人数差が最大1となるため，3人のグループと2人のグループに分かれてメンバーの名前がそれぞれ表示されます．このとき，誰が3人のグループに入り，誰が2人のグループに入るのかは実行するごとにランダムに決まり，事前に確定した配置例は存在しません．

各メンバーの個別のスキルや役職などを考慮して技能バランスを整える機能はないため，出力されたランダムな結果の表をそのまま読み取って利用します．

別の例として，入力エリアに3人しか登録していない状態で，グループ数を5に設定して実行した場合を挙げます．参加人数よりもグループ数が多いこの設定では，1人の名前が入ったグループが3つ作成され，残りの2つはメンバーが存在しない0人の空グループとして出力画面に枠だけが表示されます．結果として，1人，1人，1人，0人，0人という人数の分布になります．

いずれの例においても，作成されたチーム分けの結果エリアには専用の「グループ表をコピー」ボタンが用意されています．このボタンを押すと，【グループ 1】といった見出しと，そのグループに割り当てられた各メンバーの名前を適切に改行して整えたテキストデータが，自動的にクリップボードへ送られます．

テキストを画面上から手動でドラッグ選択する必要はなく，またファイルを出力する機能とも異なる，シンプルで確実な共有方法となります．

最後に，本ツールの状態保持と通信環境に関する利用上の制限について説明します．

このツールで入力した名前のリストや，実行した抽選結果，作成されたチーム分けの表などはすべて，ブラウザを開いている間のメモリ上（Reactの状態管理システム）にのみ保存されています．したがって，利用中にブラウザの更新ボタンを押してページを再読み込みしたり，誤ってタブを閉じたりすると，それまでの入力内容や結果のデータはすべて消去され，初期のサンプルの状態に戻ります．

作業を中断する場合や結果を後で確認したい場合は，必要なデータを必ず別のテキストエディタなどにコピーして手元に保存してください．

次に通信についての仕様です．このツールの抽選処理やチーム分けの実行において，入力エリアに記載された参加者の名前データを外部のサーバーへ送信するコードは組み込まれていません．しかしながら，ツールが設置されているウェブサイト全体としては，利用状況を把握するためのアクセス解析や，広告を表示するための通信など，ツールのメイン機能とは独立した別の通信が存在している可能性があります．

そのため，ツールの抽選処理自体に送信コードが含まれていないからといって，端末のネットワーク通信を完全に遮断した状態でのオフライン動作を保証するものではありません．一般的なウェブサイトと同様の通信が発生し得る環境であることを前提とし，利用する場面に合わせて活用してください．