これらのマスター/ディテール関係で優れたUXを得るにはどうすればよいですか？

Question

私は、ユーザーがプロジェクトを作成および管理する必要があるWebアプリに取り組んでいます。

各プロジェクトは、特に、リソースのリストによって定義されるタスクのリストによって定義されるサブプロジェクトのリストによって定義されます。

このマスター/ディテールの問題があります。ユーザーがプロジェクトごとにサブプロジェクトを作成し、これらのサブプロジェクトにタスクを追加して、これらのタスクにリソースを割り当てることができるように、直感的なUIを作成する方法がわかりません。

これらの親子関係にもかかわらず、各「対象」に関連する他の必須情報があります。

Project：名前、コード、予算、カテゴリ、サブプロジェクトのリスト
サブプロジェクト：名前、ID、タスクのリスト
タスク：リソースの名前、カテゴリ、リスト
Resources：名前、開始日、終了日

私はマスター-詳細グリッドについてこれのようにについて考えています。

この種類のグリッドでは、いくつのレベルが許容されますか？ 2つのレベルはすでに多すぎると思います。

誰かがこのプロジェクト管理機能で堅実なUIを作成するための優れたUXプラクティスを推奨できますか？

ダイアログパネルを避けるべきですか？オブジェクトごとに新しいページを開いてブレッドクラムを表示する必要がありますか？

Jamezrp · Accepted Answer

これは素晴らしい質問です。 PMとしてJiraとAsanaの両方を使用している場合、これは私が後者のために苦労している問題です。主に私には本当に4つの層があるためです：

製品
事業
仕事
サブタスク

言い換えれば、実用的なアイテムの3つのレイヤーですが、そのうち2つだけが本当に重要です。通常、2つのレイヤーがビジュアルディスプレイの最大ですが、それは純粋に企業の制限だと私は思います。なぜなら、誰もがプロジェクト管理ツール用に少なくとも1650pxの不動産を持っているわけではないからです。 Jiraは、複数のタイプのフィルター、フラグを追加し、検索に依存することでこれを回避します。 Asanaには2つ以上のレイヤーがなく、フィルタータイプも追加されています。

あなたのグリッドを見ると、それは問題なく、間違いなく理解できると思います。理論的にはさらにクリックして詳細を表示することもできますが、同じページの3番目の表示レベルでは、その時点で実際にどのような貴重なデータを表示できるのか疑問に思います。また、ユーザーが実際にこのページをどのように使用するかによっても異なります。貴重な情報は何ですか？

さらに、グリッドのすべてのレベルを表示すると、ユーザーがそれらがどこにあるかを正確に把握するのに役立ちます。これは非常に役立ちます（ページのどこでもわかりやすい方法でリストに表示されていません）。 1時間後にページに到達した方法を知っていれば、問題はありません。

dennislees · Answer

このタイプのプロジェクト管理の内訳に使用した最高のメタファーはレイヤードページメタファーです。

Basecampはこれを使用して大きな効果をもたらします。プロジェクトに移動すると、より深いレベルは最後のレベルの上に浮かぶページレイヤーとして表示されます。

このようにして、奥行きと場所の感覚を維持し、より深いレイヤーのタイトルがそこへのリンクになり、積み上げブレッドクラム機能が提供されます。

表現する必要のあるデータで機能させることができるとすれば、この穏やかなスキューモモーフィック効果は、広大なスライディングテーブルをクリックするよりもはるかに少ないエクスペリエンスを提供すると思います。

この手法を使用しない場合でも、Basecamp.comで無料トライアルを入手して遊んでみるとよいでしょう。彼らは本当に物事をシンプルに保つのに素晴らしい仕事をしています。

enter image description here

Alexey Kolchenko · Answer

情報がロードされたアプリケーションがあります。これはユーザーに悪影響を及ぼし、使い勝手が悪くなる可能性があります。

記事で定義されているように、プログレッシブ開示パターンを使用することをお勧めします：プログレッシブ開示-最高のインタラクションデザインテクニック？

プログレッシブ開示は、ユーザーの負担を軽減するために、複数の画面にわたって情報とアクションを順序付けする対話設計手法です。情報を段階的に公開することで、必要なものだけを明らかにし、ユーザーが機能豊富なサイトやアプリケーションの複雑さを管理できるようにします。

あなたが述べたマスター/ディテールグリッドは、ユーザーがとにかく多くの情報を見るので、完全なソリューションではありません。これは彼らの注意を現在の仕事に集中させることを許しません。

おそらく、次の2つのレベルの階層を維持できます。プロジェクト-サブプロジェクト。後者のレベルは、タスクとそれらが互いにどのように連携するかを観察できるので、サブプロジェクトの優れた概要を提供します。また、セカンダリメニューをナビゲーション手段として使用し、サブプロジェクトリスト全体を観察することもできます。

また、ユーザーの役割とその目標およびタスクにも注意を払ってください。異なるユーザーは、意思決定のために異なるレベルの抽象化を必要とします。繰り返しになりますが、これはプログレッシブ開示手法がうまく機能していることです。