web-dev-qa-db-ja.com

ユーザーがポイントアプリで無料のコーヒーを入手していることを示す良い方法は何ですか。

私は、ユーザーがコーヒーとパンを購入するたびに「スタンプ」を取得できるポイントカードiOSアプリを設計しています。ユーザーが6つのスタンプを取得すると、濃い色のアイコンが表示され、7つ目は無料になります。つまり、「6を購入すると、7を無料で入手できます」。

私はこれを見た list だったが、彼らがそれをどのように解決したのか本当に確信していた。私が見つけたほとんどのポイントプログラムでは報酬を集めることはできませんが、それを受け取ったらそれを要求する必要があります。例「目標に達しました。店頭での請求。」スターバックスにはポイントを集めることができるので、残念ながら完全に別のロジックがあり、アプリに実際に転送できないと思います。

このアプリでは、報酬を集めることができ、ユーザーが節約した無料のコーヒーやパンの数が表示されます。これが2桁を超えることはほとんどありません。つまり、表示される最大数は99であり、デザインにはこれに十分なスペースが必要です。

これらは私がテストしたデザインです:enter image description here

無料のコーヒー/パンを手に入れることができることを私はどのようにして最良の方法で示すことができますか?現在のところまでは、「サルド0」(バランス:0)を示しています。 (「0」を参照してください。)カップの下に「Free coffee:22」と書くだけでは、簡単に見つけることができず、視覚的に魅力的でもありません。 (「1」を参照してください。)

無料のコーヒー/パンがない場合、どのように見えるべきですか? 2つのオプションが表示されます。

  1. 1つが無料のコーヒーを獲得するまで6つのカップのみを表示し、次に別のカップ/数が表示されます。これの問題は、カップが空いているかどうかによってレイアウトが変わることです。 (「2」を参照してください。)
  2. 無料のコーヒーがたくさんある場合、7番目のスタンプが表示されるのはいいことですが、ほとんどのユーザーにとって、この数はゼロです。それはちょっと悲しくて、やる気がありません。 (「3」と「0」を参照してください。)

収集した無料のコーヒー/パンの量をどのように表示できますか?コーヒーカップ内の数字を機能させます(「4」を参照)。ただし、パンについては機能しません。 (「5.」を参照してください。)したがって、数字のみを表示しようとしましたが(「6.」を参照してください)、これが何を意味するかは一目瞭然ではありません。

したがって、番号の後ろにバッジ(または同様の何か)を付けることもできます。 (「7」を参照してください。)ただし、バッジを使用すると、無料のコーヒーがないときに何を表示するかについての疑問が残ります...

「無料」という言葉を含める必要がありますか、それとも不要ですか?「8」を参照してください。と「9」。

同様の機能を備えたアプリやウェブサイトの経験があり、それを使いやすくユーザーフレンドリーな方法で表示する人がいれば、高く評価されます!

5
beining

ux mobile app

私は物理的なポイントカードのファンではないので、なぜアイデアをモバイルに変換するのですか?ウォレットには何枚のポイントカードがありますか?

シンプルなスピードメータースタイルのグラフィックを使用するだけで、現在の報酬ステータスを簡単に確認できます。数字をキューとして含める-> 8/12

2
atchrismai

画像が見えるので、暗い色の画像は無料のコーヒー/パンの権利を意味するため、画像を使用した方法で使用しないことをお勧めします/ pig-ear。行の最後の数字を特に不可解にします。

トラムパスのようなカードを使用して、スポットの列を穴に変え、列の最後にコーヒー/パン/豚の耳を表示することを検討してください。 「道」が完全に打ち抜かれると、顧客はコーヒーなどにたどり着きました。そしてそれを消費するようになります。

[編集]私はこのようなことを念頭に置いています(これは非常に大雑把です!)

enter image description here

1
MMacD

代表的なアイコンを使用して、獲得したユニットの数を示し、パーセントで満たされたアイコンとして、次の獲得への進行状況を示します。

デジタルスケッチツールにアクセスできないため、現在携帯電話を使用しているため、ASCIIを使用して概算します。

Vを充填済みのコーヒーカップアイコンとし、vを部分的に充填したカップとします。 Bが塗りつぶされたパンのアイコンを表し、bが半分塗りつぶされているとしましょう。すべての場合において、_は、対応するアイコンの塗りつぶされていないアウトラインを表します。それからあなたは次のように始めるかもしれません:

_
_

コーヒーとパンを買うと、報酬がもらえます。

v
_

(部分的に稼いだコーヒー、パンの収益なし)

v
b

(部分的に稼いだコーヒーとパン)

Vv
B_

(1杯のコーヒーを獲得し、2番目に作業して、パンを獲得しました-しかし、新しいパンの獲得を開始していません)

Vv
BB_

(次のコーヒーの途中でコーヒーと2つのパンを獲得しましたが、これまでのところ次のパンにはありません)

等々。アイコンをクリックまたはタップして、獲得日を表示できます。ホバーがサポートされている場合は、同じようにします。

重要な点は次のとおりです。

  1. 塗りつぶされたアイコン全体を使用して、獲得および利用可能であることを表します。
  2. 部分的な塗りつぶしを使用して、次の獲得に向けての進捗状況を表します。

編集

コメントで質問がありました。これが私の回答です:

どのようにしてあなたが無料のカップを手に入れるのにどれだけ近いかを示しますか?

アイコンには、目標に向かっている割合が表示されます。したがって、無料のコーヒーを獲得するために4回の購入が必要な場合、最初の購入ではコーヒーが1/4充填されたことが表示されます。 2番目の購入では、1/2が満たされたことが示されます。等々。正確なパーセンテージが実現不可能な場合は、最も近い可能な単位に丸めます。したがって、アイコンのサイズと解像度により、アイコンを1/4塗りつぶしの増分で視覚的に表示できるだけで、カップを満たすのに6回の購入が必要な場合は、購入を最も近い可能性のある1または2に「スナップ」します。購入は1/4フィルドとして表示され、3は1/2、4または5が3/4として表示され、最後に6がフィルドとして表示されます。すべての場合において、可能であれば、ユーザーがアイコンをクリック/タップして正確な詳細を見つけることを許可します。

[たくさんのコップを表示するにはどうすればよいですか?]つまり、22カップあります(明らかに多くは起こりません。おそらく、22杯のコーヒーを節約するよりも多くの場合、無料のコップを使うことになるでしょう)。 22のコーヒーアイコンがある場合、22のコーヒーアイコンがあるとかなり雑然として見えます。

獲得した正確な数は、数量が多い場合は関係ありません。つまり、私が1つ、2つ、多分3つのコーヒーを持っていることを知ることは重要で刺激的です。 4を超えると、獲得数は無限になる可能性もあります。

そこで、タリーアイコンを作成するか、小さなラベルを使用します。集計では、獲得したアイテムのグループを示すために 集計マーク のようなものを使用することを意味します。たとえば、フルコーヒーアイコンを1/4サイズに縮小してから、そのうちの4つを正方形に配置します。そのタリーアイコンは4つのコーヒーを表し、スペース要件を300%縮小します。この例では、10(4 + 4 + 1 + 1)を獲得しています。

V V  V V  \ /  \ /
V V  V V   V    V

または、小さなラベルは黄色のテキストの元のアイデアのようにできますが、代わりに次のようなアイコンにオーバーレイされます(これもASCII)。

\   / \   / \   / \   /
 \ /   \ /   \ /   \ +10 more
  V     V     V     V
1
bishop

無料で有料の7番目のコーヒーと混同される7番目のコーヒーを表示してから、それらすべての7番目のコーヒーを追加する代わりに、私の提案は次のように無料のコーヒーを表示することです。

coffee

各コーヒーは、次の無料のコーヒーの6番目の部分を満たします。無料のコーヒーの量を混乱させないために、アイコンを含めないようにするには、テキストでそれを書いてください(そのテキストを表現するより良い方法が確かにあります)。


私の意見では、6日に到達した後、次のコーヒーを支払うのではなく、無料のコーヒーが蓄積されて消費されないのは奇妙ですが、私が見逃している理由があるかもしれません。追跡しているのがすでに到達して消費された無料のコーヒーの量である場合は、代わりに消費された有料のコーヒーの総量を追跡することを検討してください。理解しやすいかもしれません。

0
Alvaro