web-dev-qa-db-ja.com

モバイル/ウェブでの作物管理のデフォルト状態に関する研究

切り取りウィンドウを表示する最良の方法は何ですか?

私は2つの人気のあるアプローチを見てきました。画像をランダムに選択したように見える中央揃えのトリミングウィンドウ。

enter image description here

または、トリミングハンドルが画像の角にあります。

どちらの場合も、ユーザーは自分で作物を調整する必要があります。

それに関する研究や記事はありますか? Instagram/Snapchatのようなプラットフォームは何かを考慮に入れていたに違いない。

2
Sol

私の意見では、(元の)画像の隅にハンドラーを表示すると、一部のユーザーがそれらを見逃す可能性があります。

ユーザーはデフォルトでトリミングされた領域を表示することで、画像の一部を選択する必要がありますおよび操作するハンドラー(/エッジ)がどこにあるかを理解します。

また、アプリに出力の定義済みの比率がある場合は、トリミングフレームで制限することで、それを確認し、余分なアクションを防ぐことができます。

4
Alvaro

「最善の方法」は常に主観的です。

通常、トリミングは、画像が最終的に目的の開口部に収まるようにするために行われます。

たとえば、FacebookとTwitterでは、アバター/プロフィール画像をトリミングして、バナー画像のアスペクト比を変更できます。

これにより、画像が制約されて最も魅力的な形式で表示され、囲んでいるボックスに収まるように画像が引き伸ばされたり縮小されたりして、見た目が悪くなります。

グラブハンドルがおそらく最も一般的であり、フルサイズの画像の不透明なビューにより、ユーザーはフルサイズの画像と比較してトリミングを確認し、選択したものについて情報に基づいた決定を行うことができます。

トリミングする画像の最終結果に応じて、UXをいくつか改善できると思います。 1つは、画像が入るコンテナーのサイズに適合するバウンディングボックスを自動的に提供するトリミングボタンを提供することです。 2つ目は、ユーザーが画像の残りの部分の不透明な値を制御できるようにすることです。これにより、トリミング時にフルサイズの画像がどれだけ機能するかを選択できます。

1
DarrylGodden