ユーザーが任意のCSVファイルを開き、そのフィールドとデータベース内の既知のフィールドのリストとの1対1のマッピングを定義するデータインポート機能を構築しています。フィールドのリストは非常に長くなります(CSVでは約30の既知のフィールドと任意の数(CSVではおそらく20から50の間))。
単純な実装は、既知のフィールドのマッピングを選択するためのコンボボックスとペアになっている垂直のリストで、発見されたすべてのフィールドをレイアウトするだけです。
[discovered 1] [combo]
[discovered 2] [combo]
etc
または水平に、
[discovered 1] [discovered 2] [etc...]
[combo] [combo] [combo]
ここでの問題は次のとおりです。
おそらくより良いアプローチは、発見されたフィールドに隣接して配置できる既知のフィールドのドラッグ可能なボックスを除いて、上記と同様です。
考慮すべきもう1つの問題は、ヘッダー行のないCSVファイルです。発見された各フィールドを識別する方法は?
この相互作用の良い解決策の既存の例はありますか?
"フィールドのリストが非常に長い"が実際に何を意味するかによります。実際の番号を入力して質問を明確にできますか? CSVのフィールド数とデータベースのフィールド数の両方。また、フィールド名は比較的短いのですか、それともわかりやすい長い名前ですか?
Gridsは、リストよりも多くの情報を簡単に表示できます。 CSVから見つかったフィールドのグリッドとデータベースのフィールドのグリッドを両方とも同時に表示します。それらを一致させるためにドラッグアンドドロップします。次に、両方の観点から、使用されたものと使用されなかったものに関する視覚的なフィードバックがあり、変更を行うためのさまざまな自然な方法があります。
データベースに約200を超えるフィールドを含めるには、一部のフィールドを非表示にし、関心のあるフィールドのみを表示する方法が必要になります。アルファベット順の並べ替えに基づく、8つのタブを持つタブコントロールは、さらに適合させるための簡単な方法の1つです。
考慮すべきもう1つの問題は、ヘッダー行のないCSVファイルです検出された各フィールドを識別する方法
発見されたフィールドを「フィールド1」、「フィールド2」などと呼ぶことに問題はありません...
より良くするには-ユーザーが実際にフィールドを識別できるようにするために、画面にinfo-boxがあるはずです。たとえば、 'フィールド1:日付のように見えます。 1066年7月9日から2035年4月1日までの値。 17の空白のエントリ。 2つのエントリが有効な日付形式ではありません。 View'。これにより、マップされていない最初のフィールドの情報、またはクリックまたはドラッグされたばかりのフィールドの情報を表示できます。
これにより、ユーザーが検出されたCSVフィールドからデータベースフィールドにドラッグするか、データベースフィールドから検出されたCSVフィールドにドラッグするかを選択できます。
あなたがdoで発見されたフィールドのフィールドヘッダーを持っている場合、考慮すべき点として、最適なインターフェイスを求めました。お使いのソフトウェアが、データベースのどのフィールドが名前とタイプに基づいて一致するかについて、知識に基づいた推測を行うことができる場合、それは情報ボックスに「推奨される一致」として表示されます。確認するチェックボックス。すべての提案を表示し、それらをまとめて確認/承認できる画面を表示することもできます。
既知のフィールドのセットが多い(24を超える)場合は、それらをグループ化するか、階層的に配置することを検討してください。これにより、ユーザーはすべてを表示したり、少なくともすべてを並べ替えたりして、使用可能なフィールドセットを理解できます。
それらを「駐車場」(サイドバーまたは画面の領域)に提示します。次に、発見されたフィールドを水平または垂直に表示します(画面スペース、フィールドの幅、フィールドの数によって異なります)。
次に、検出されたフィールドの既知のフィールドを、次のいずれかの方法で指定できるようにします。
ユーザーが選択したときに既に使用されている既知のフィールドを強調表示またはグレー表示できます。
ユーザーがフィールドをドラッグまたは入力したい場合は、前の場所から静かに削除するか、アニメーションを表示するか、「発見されたフィールドXXXから削除してもよろしいですか? ?」
以前の応答を基にして、かなり簡単なアイデアの1つは、データのプレビューグリッドを用意することです(ユーザーがフィールドを識別しやすくするためです-ヘッダーでは不十分な場合があります)。
DB: [ v] [ v] [ v] ...
column1 column2 column3
1. foo 123 11/5
2. bar 32 19/7
実際の選択は、各列の上部にあるオートコンプリートボックスで行われます。入力ボックスは重要な要素であり、それを改善する多くの方法が可能です。
おおよそ次のようになります。
[p| v] x
| Property Publisher *Party* |
| Place Ponies *Phone* |
| Postcode |
*---*
)下部にあり、グレー表示され、インジケーターアイコンが付いています。それらを選択することを許可し、新しいマッピングが選択されるとすぐに古いマッピングをクリアします。x
)アイテムを自動的に一致させようとする(推測)と、非常に役立ちます。
注:特にスクロールが関係している場合、私はドラッグアンドドロップに対して強く偏っています。コンボボックスは段階的に改善できますが、より洗練されたコントロールでは、基本的な機能にさらに多くの作業が必要になります。また、非常によく知られていて期待されているUI要素でもあります。
発見された各フィールドを識別する上で、私が見た設計では、インポートされた各フィールドの最初の5つの一意の非空白値のドロップダウンメニューを提供します(ドロップダウンの最初の値は「インポートされたフィールドN ")。
別のアプローチは、ユーザーがインポートされたレコードをざっと見る方法を提供することです。
あなたはすでにあなたの答えを持っています、私はまだこれを投げ入れたいです:
コンボボックスは理想的ではないと思います。開発コストを完全に無視して、少しゲームを提案します。
それらを2列に入れます。アイテム(左または右)をクリックすると、他の列(一致)または他の場所(不一致)のアイテムをクリックするまで、マウスポインターに沿って矢印が描画されます
成功したマッチを一番上に移動して、「邪魔にならない」ようにしますが、それらを選択して再ルーティングできるようにします。
キーボードナビゲーションを提供します(カーソルを上/下/左/右で選択、Enterまたはスペースで「クリック」、「選択」状態を示す必要があります)。
視覚的な(そしておそらく聴覚的な)キューを提供します。子供のゲームのように扱います。
スペースが十分でない場合、スクロールはほとんど問題ありません。そうでない場合は、画面を垂直方向に分割し、各セットを両側のグリッドに配置できます。
根拠
コンボボックスは画像メモリを利用しません。 「チャールズはあそこにいた」これは、大部分のユーザーにとって大きな助けになるでしょう。それはその特性を欠いている人々にとっては低下かもしれませんが、それは十分に低く、おそらくコンボボックスソリューションよりもはるかに悪いことではありません。
コンボボックス-簡単な実行-は常にすべてのアイテムをリストし、正常に一致したアイテムは削除されません。それはすでに改善になるでしょうが、その場合、一致を削除する可能性が必要です。