web-dev-qa-db-ja.com

ユーザーが単語をどれだけよく覚えているかを評価するウィジェット

私のアプリでは、ユーザーはWordをどれだけ「知っている」か、つまりどれだけ単語を思い出せるかを評価できる必要があります。

私のその他の関連する質問ユーザーのクリック後にパネルをぶら下げ

そのため、テキスト自体にも配色があります。

  • 青は新しい単語を意味します
  • 濃い黄色は学習を始めたばかりであることを意味します
  • 薄い黄色はほとんど知っていることを意味します
  • 色がないことは、学習または無視されたことを意味します(それらを区別するために小さな緑/赤の下線があります)。

学習には4つのレベルがあります(黄色の色合い)。 Wordがテキストをクリックすると、ウィジェットはそのWordの現在のステータスが選択された状態で表示されます。

enter image description here

これをより直感的にするにはどうすればよいですか?ここに色の問題があります。テキストでは黄色が不明な単語をマークするために使用されていますが、ステータスパネルで進行状況の概念をユーザーに表示したいので、黄色->白のスキームはそこで機能しません。助言がありますか?ありがとうございました!

編集:私が思いついた何か、評価してください。 enter image description here

:ユーザーは同じWordに何度も遭遇します。目標は、徐々に単語を学び、その状態を常に思い出させることです。

3
Fernando

ユーザーに番号付けされた評価システムや星のような「専門用語」を学ぶように要求しないでください。わかりやすい言葉を使用して、進捗状況を評価できるようにします。

目標が学習と記憶である場合は、間隔を置いた繰り返しのヒントでコンテンツが再び表示されるタイミングをユーザーに通知します。

目標は親しみやすさと流動性( 'I know this!')であるため、インスペクタパネルの情報を使用して、このWord /コンテンツが再び表示されるまでの時間を示すことができます。 Supermemo はこれをベースにしたシステムです。

スタイリッシュではないかもしれませんが、 Anki はフラッシュカードスタイルのデッキで、次に思い出させるタイミングをユーザーが選択できるようにします。 。私はそれをプログラミングに使用しました。

専門用語は、ユーザーがモデルに準拠する必要があることを意味します。これは、概念について自分たちが持っているメンタルモデルではない可能性があります。 ドンノーマンの説明を参照してください

enter image description here

格付けは、企業が信頼を築くための社会的証拠としてよく使用されます。あなたの目標は知識の獲得であり、好みや証明ではありません。

Ankiでは、ボタンの横にあるシンプルなラベルを使用して、ユーザーがどれだけ早くコンテンツを記憶するかを確認できます。彼らはこれを使用して、用語をどれだけよく理解して理解しているかを反映できます。

enter image description here

Ankiではスタイリッシュに見えないかもしれませんが、デザインのこの段階ではインスペクターパネルに多くのスペースがあります。積み重ねたボタンを次に表示することで実行できます(ロジックをユーザーに公開する場合)。

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

更新:最近の変更の評価。

あなたは正しい軌道に乗っているようです。注意すべきいくつかの点:

  • あなたの色強度スケールは、彼らが習熟を達成するにつれて、UIをより高密度にしているようです。あなたは「知られている」に向かって暗いスケールを持っています。彼らがボキャブラリーを習得しているように、それはより雑然としたUIを伝えます。 これにより、ユーザーが実行する作業が少なくなるわけではありません(件名を習得している場合でも)というメッセージが表示されます。

  • 進行状況のパーセンテージ(または意味のあるメトリック)を示す動的なタイトルを作成することにより、全体的な進行状況の評価を提供できます。それらがアイテムを「既知」としてマークすると、メトリックが増加します。

私の意見では、学習は「救済」であり、カラーバーが消えることは、操作する要素が少ないことを意味します:Wordを習得したので、アフォーダンスはなくなります(ただし、Wordにカーソルを合わせると、ユーザーがレベルをリセットできるようになります)快適さ)。以下の注を参照してください。

enter image description here

4
Mike M

色の使用は素晴らしいアイデアだと思います。段落テキストに注釈を付けるので、テキストのフローを分割するテクニック(追加のアイコンなど)を使用することをためらっていました。

いくつかの提案:

  • 黄色の濃淡については、テキストの色/フォントに対応する灰色の濃淡(または重み)を使用することも検討してください。これにより、既知の単語や無視された単語が明るくなります(太字にならない)。これは、完全に黒く太字の単語(新しいまたは最低レベルの親しみやすさ)に目を引きます
  • 同じボタン(「新規」、「1、2、3、4、チェック、X」)を持つ「すべて表示」セクションを提供します。クリックすると、他のすべての単語が非表示になる(またはほとんど透明になる)ため、ユーザーは新しい単語、またはレベル1の単語など。クレジットを追加するには、これらのボタンをトグルボタン(ユーザーが1と2だけを表示できるが、たとえば他のすべてを非表示/フェードできるようにする)に、「クリア」ボタンを追加してすべての単語を作成する通常に戻ります。
  • 右側のパネルに複数の単語が表示された状態で、複数選択(ShiftまたはCtrl)やマーキー選択をサポートすることを検討してください。ユーザーが視覚的表示を好まない場合、テキスト行をマーキー選択(マウスでボックスを描画)し、右側のペインのリストまたはテーブルでそれらの単語のステータスを確認/変更できます。
  • ユーザーが色分けを忘れた場合にマウスをホバーすることで単語をすばやく確認できるように、翻訳、ステータス、メモですべての単語のツールチップをサポートすることを検討してください。
0
J. Dimeo