私は現在、AngularJSを学んでいるサイドプロジェクトを行っています。私が取り組んでいるサイドプロジェクトは、Webベースの部屋予約アプリケーションです。
あなたが会社の従業員で、会社の建物にある多くの会議室の1つで1時間予約したいとします。
部屋予約システムのUIに関しては、ドリブルの人々が髪を引っ張るような衝撃的なものを見てきましたが、スタイリングがいかに悪くても、私はいつも2つのアプローチが取られるのを見てきました。
アプローチ1:
会議室の予定表をカレンダーとして表示します。ユーザーはカレンダーを見て、どの曜日にどの会議が予約されているかを確認できます。会議を追加したい場所で、カレンダー自体をクリックして会議を追加し、予約することができます。そこで会う。これに似ています(私が見つけることができるまともなものだけ)
アプローチ2:
部屋を予約するには、基本的に、会議室を予約する日付、時刻、場所を指定する入力フィールドを持つフォームがあります。
あなたはどのアプローチが最善だと思いますか?より直感的でユーザーフレンドリーですか?より良い例はありますか?
マイビジョン:
これについて考えていたとき、「CADユーザーが実際の部屋をクリックし、スケジュールを確認してから、予約しますか? "..しかし、HTML5/CSS3/JavaScriptで実現できることはわかりません。Flashを使用したくありません(その中で実行できることはわかっています)。
フィードバックやヘルプをいただければ幸いです。
ありがとうございました。
この状況では、主に2つのタイプのユーザーがいると思います。
これら2つのシナリオを念頭に置いて、カレンダービューにはいくつかの長所があります。
ユーザーが建物の図を参照して最初に部屋を選択し、次にその部屋のスケジュールを確認するという質問で提案された代替のアプローチは、おそらく視覚的に魅力的ですが効率が悪いように聞こえます。日付までに動機付けされたユーザーは、スケジュールを比較するために各部屋をクリックして出入りする必要があります。とはいえ、カレンダービューの横に建物の図を配置すると便利です。
CAD部屋の予約の場合はどうしますか?部屋を見つけて利用可能な時間帯を選択するプロセスは、それほど面倒ではありません!3D回転する建物がある重いページで、予約ウェブサイトのようには見えません!これで、ユーザーは3D構造を制御する方法を学ぶ必要があります!
建物のアーキテクチャや、建物内の部屋の正確な位置は気にしません。部屋の写真だけが欲しかった。
BlueFlameに同意する必要があります。建物を3次元で表示すると、エクスペリエンスが悪化します。建物のどこで会議を行うかがポイントではないと思いますが、いつ行われるかです。
あなたの最初のオプションが勝者のように見えるところです。 Googleカレンダーを例にとると、インターフェースはアプローチ1に沿ったものです。おそらくそれをインスピレーションとして使用しますか?これにより、キーボードの使用を少し減らす(時間/日付)こともできます。
リソースのアクセス可能性によって定義される両方のアプローチには、基本的な違いがあります。
排他的リソースを管理するには、タスクを容易にするための計画、保留、またはキューイングツールを提供する必要があります。したがって、インターフェースがより複雑になり、タスクがより効率的になります。
あなたのケースはおそらくこのカテゴリに分類されます。
可用性が高く、インターフェースをシンプルにして認知的負荷を軽減して高いパフォーマンスを実現する必要があるため、非独占的なリソースには管理ツールは必要ありません。
フライチケットの予約は、このカテゴリの例です。