web-dev-qa-db-ja.com

アプリのユーザーが自分のロゴをアップロードできるようにするときに、ロゴの歪みや品質の低下を防ぐための最良の方法は何ですか?

私はアプリに外部ロゴを許可するのは好きではありませんが、クライアントの要件です。要件は、ユーザーがロゴをアップロードできることであり、120px-160px幅のスペースでアプリのロゴを置き換えます。ユーザーがロゴをアップロードすることを許可するときに防止しようとするいくつかの問題があります。

  1. アップロード時にピクセル化される低品質の画像
  2. 表示時に歪む間違ったサイズの画像
  3. ロゴフォントイメージ内のベクトル化されていないテキスト(これは防止できません)
  4. 間違ったアスペクト比のロゴ

アップロードしたロゴに設定するのに最適なパラメータを教えてください。 pxの幅と高さのコードで確認できます。ただし、コードはテキストがベクトル化されているかどうかを確認できません。この問題については、洞察があればいいでしょう。前もって感謝します。

2
jeancode

インタラクションを直接テストせずにユーザーにとって何が機能するかを特定するのは難しいですが、ここに役立ついくつかの原則があります...

1.コンテキスト内で画像を表示する


コンテキストが鍵なので、この提案が1番です。

ユーザーが画像をアップロードする前に、画像がどこにあるかを示すプレースホルダーを表示します。

placeholder with dimensions

画像が選択された後、ユーザーにプレースホルダーbeforeの代わりに表示して、their final choiceであることを確認するように求めます。

2.何が最適かをユーザーに知らせる


すべてのユーザー入力が障壁であることを忘れないでください。そのため、ユーザーが悪い画像をアップロードすることを止めないでください。代わりに、ユーザーがより良い方法を提案するようにしてください。

エラーメッセージでユーザーをブロックする代わりに...

エラー:画像は171x144でした。 160 x 120のサイズの画像をアップロードしてください。

| [〜#〜] ok [〜#〜] |

ユーザーにやさしく知らせることで摩擦を減らします...

この画像はサイズが間違っているため、歪んで見える場合があります。

| 新しい画像をアップロード | 現在の画像を使用 |

3.プレミアムサービスを提供する


これは特定のプロジェクトの範囲外となる場合がありますが、完全を期すために含まれています。ユーザーがかなり技術的である場合、このオプションは多すぎる可能性がありますが、そうでない場合、一部のユーザーは他の人に代金を支払う簡単な方法を好む場合があります。

3
DaveAlger