対話型 Web アプリケーションのテクノロジ スタックを選択しようとしています。
プロジェクト要件:
1) アプリケーションは実際にはフルスクリーン ボードであり、互いに相互作用する多数の長方形オブジェクトを保持しています。
2) 1 人のリード ユーザー (デモンストレーター) は、ボードに新しいオブジェクトを追加し、それらの位置、角度、向き、およびサイズを決定できます。これを行う理想的な方法は、ユーザーが単純な左クリックの選択をボード上の空きスペースにドラッグでき、右クリックが押されている間にその選択を回転できる場合です。マウスを離すと、選択した面に長方形のオブジェクトが描画されます。
3) デモンストレーターは、オブジェクトのサイズ変更、回転、ドラッグによるオブジェクトの移動を行うことができます (右クリックを同時に押すと、移動中にオブジェクトを回転させることもできます)。その過程でオブジェクトがどれだけ移動したかを(任意の測定単位で)測定できれば、本当にいいと思います。
4) 多数のオブザーバー/ユーザー/クライアントがデモンストレーション ルームに参加し、以下を観察できます。
物体の動きをリアルタイムで観察してほしい。そうでない場合は、
オブジェクトを以前の位置から新しい位置に移動するアニメーションを見てもらいたいと思います。そうでない場合は、
オブジェクトが新しい位置に瞬時に移動するだけであれば問題ありません。
5) サポートされているオブザーバーの数:
シームレスに 50 をサポートする必要があります。
1万まで応援したいです。
技術スタックが最初に安価な非専用サーバーでサポートできる任意の数を提案してください (ただし、後でアップグレードするオプションと、サポートされているクライアントの数に応じてどのようにスケーリングするかを指定してください)。
6) デモンストレーターは、別のユーザーを「アシスタント デモンストレーター」として指名し、完全な特権を得ることができますが、管轄権を分離できます (デモンストレーターのオブジェクトを移動することはできず、自分自身のオブジェクトを追加/移動/削除することしかできません)。
7) Flash や Java がインストールされていなくても動作できる必要があります (事実上、それらは方程式から除外されます)。
ボーナスポイント:
1) スケーラビリティ (レスポンシブ デザイン) とそれが Canvas に与える影響 (アスペクト比 16:9 を維持しながら、「解像度」は同じままにし、ピクセル サイズを調整する必要があります)
2) モバイル デバイスのサポート - 新しいモバイル デバイスやタブレットでも十分に機能します (おそらく高度な機能は必要ありません)。
3) オブザーバーには、実際の (現在の) 状態に戻す (同期する) ことができる一方で、オブジェクトを (ブラウザーでクライアント側のみ) 移動するオプションもあります。
私の頭に浮かぶのは:
最初に頭に浮かぶのは次のことです。
HTML5 Canvas と、その上でオブジェクトを描画および操作するための JS ライブラリ ( fabricjsは有望なようです)
適切なフレームワークを備えた node.js (Meteor は現時点で本格化しており、多数のクライアントとのリアルタイム同期を処理する機能を備えているようです)
しかし、私はどちらにもあまり詳しくなく、このプロジェクトを開発するのに最適なスタックであるかどうかを判断することはできません.
おすすめはありますか?私は jQuery / PHP / AJAX の経験があり、それらの外に出たことはあまりありませんが、何か新しいことを学ぶことに何の不安もありません。
PS: この質問にタグを付ける方法がわかりません。適切と思われる方法で自由にタグを付けてください。