web-dev-qa-db-ja.com

この複雑な写真アップロードシステムを使いやすくするにはどうすればよいですか?

私はウェブサイトの既存の写真アップロードシステムを変更するためにかなり複雑な作業を進めています。

現状:

ウェブサイトには、ユーザーが写真をアップロードできるいくつかの領域があります(つまり、ギャラリー、コンテスト、グループなど)。現在、ユーザーは、その領域に写真をアップロードする各領域の専用のアップロードページに移動する必要があります。

ユーザーはまた、現在ギャラリーエリアにアップロードした写真を表示するポートフォリオを持っています。

必要な状況:

ここで、ユーザーが写真をポートフォリオに直接アップロードし、必要に応じて各領域に写真を「追加」できるようにしたいと思います。そのため、彼らのポートフォリオは、ギャラリーエリアにアップロードしたものではなく、アップロードの集まりです。これの主なアイデアは、ユーザーがポートフォリオでより柔軟にアップロードできるようにすることです。

ユーザーが(たとえば)ギャラリーエリアに写真を追加する場合は、ポートフォリオ内の写真から選択する機能を提供したいと思いますORコンピューターから。 「コンピュータから」画像もポートフォリオに追加されます。

ポートフォリオ内の写真を閲覧する場合、写真がWebサイトで追加された領域を参照する方法がいくつかあることが重要です。

私が言ったように、それはかなり複雑であり、それが非常に重要なので、使いやすく単純な方法で行われます。既存のユーザーを苛立たせたくありません。

質問:

建設的なフィードバック、提案、アイデア、入力をお願いします!

2
David

私があなたを理解していれば、目標は共通の写真ストレージを持ち、その写真をエリア間で共有することです。さらに、新しいデザインは古いユーザーを混乱させてはなりません。

1)ポートフォリオページの変更:ユーザーは同じ写真を他のエリアと共有できます:写真の近くのチェックボックスを使用します

[Portfolio]
 _____________  
|             |   Share photo to: 
|             |   [x]  gallery          <- users can share photos via portfolio
|    photo    |   [x]  competitions     <- 
|             |   [x]  groups           <- 
|_____________|    ....

2)ユーザーは引き続き、ギャラリーなどの他の領域から写真をアップロードできます。だからあなたはポートフォリオでこれらの写真を見ることができます:

[Portfolio]
 _____________  
|             |   Share photo to: 
|             |   [x]  gallery   <- it means that image was uploaded from gallery 
|    photo    |   [ ]  competitions 
|             |   [ ]  groups
|_____________|    ....

3)アップロードボタンの近くのすべてのエリアに[オプション]を追加して、ユーザーがストレージ(ポートフォリオ)から写真を選択したり、外部ソース(ウェブURLまたはローカルファイルなど)から写真をアップロードしたりできるようにします。ユーザーが[ポートフォリオからアップロード]を選択すると、このエリアで共有されていない写真のリストがUIに表示され、ユーザーは写真をチェックしてこのエリアで共有できます。

[Competitions] Choose to place at this area
     _____________       ____________
    |             |     |            | 
    |             |     |            |
    |   photo1    |     |   photo2   |
    |             |     |            |
    |_____________|     |____________|    ...        

     [x] place           [ ] place 
1
igor

まず、「ポートフォリオ」と「エリア」の違いをユーザーが理解できるようにします。これは混乱を招く可能性があります。設計では、「ポートフォリオ」が「ギャラリー」や「競争」とは異なるタイプのオブジェクトであることを明確にする必要があります。

次に、次の3つのユースケースがあると思います。

1)ポートフォリオに写真をアップロードしたい

最初の反復では、ポートフォリオをonlyユーザーが写真をアップロード、編集、または削除できる場所にします。これにより、アップロードが大幅に簡略化されます。領域に「写真を共有...」するオプションをアップロードUIに追加します。

2)私はポートフォリオ内にあり、以前にアップロードした写真をエリアに追加したい

ユーザーが写真をアップロードすると、チェックボックスまたはタグを使用して、写真をサイトの他の領域(igorの最初の図と同様)に共有することを選択できます。 この時点ではまだポートフォリオにあります。

)エリアにいて、写真を追加/アップロードしたい

ユーザーがエリアに写真を追加したい場合は、ポートフォリオのビューに戻します。トップレベルのPortfolio画面である必要はありませんが、ユーザーがPortfolioが画像の「バケット」が格納されている場所であるという関連付けを行うのに十分な知識が必要です。

追加する必要のある画像が現在アップロードされていない場合、アップロードボタンは可能な限りユースケース1に近いUIを提供する必要があります(つまり、「ポートフォリオに画像をアップロードしてを追加しています) 'to gallery'ではなく 'I amuploadinga image to gallery')ではありません。ユーザーがいたエリアのボックスを自動的にオンにします(またはタグを追加します)。


もう1つの注意点-バッチアップロードとバッチ操作を検討してください。上記の操作はすべて、バッチレベルでサポートされている必要があります。例えば。ポートフォリオから複数の写真を選択してギャラリーに追加できるようにします。

1
Jon White

色分けを検討してください(色覚異常を念頭に置いてください)。 「エリア」を特定の支配的な色に関連付け、そのエリアにアップロードする場合もその色にする必要があります。アイコンだけでなく、セクションに一貫した多くの視覚的情報。

0
Stefano