web-dev-qa-db-ja.com

小さなiPhone画面で複雑なUIをユーザーに説明する方法は?

私は構築し、構築してきましたが、初めて使用するときにユーザーを教育する必要があるアプリができあがりました。プログラマにとって非常に「洗練された」迅速なアイコンジェネレータです。私のアプリには常に最大16個のボタンが表示されています。主要なボタン(閉じる、保存は色分けされています。)残りは灰色で、ラベルを使用しています。

私は実際のユーザー(ターゲットユーザーではなく)を使用してテストを行い、それを理解しました主な問題は、右側のウィジェットの使用方法がわからないことです(ボタンのスタック)。これらのボタンをドラッグして、レイヤーの順序を変更できます。

アプリの使い方を説明するために、私は画面上の矢印の付いた2つの付箋が適切な方法かもしれないと思いましたが、UXの専門家にもっと良い方法があるかどうか尋ねたいと思いますユーザーはUIに慣れています。

ボタンを指す基本的な矢印の付いた小さな付箋の7画面が表示されました。 ユーザーがアプリを使用する前に7つの画面を通過することを意図しています

複雑な14ボタンUIを扱いやすい部分でユーザーにどのように教育できますか?

on-screen sticky note example overview

2
Alex Stone

言われたとおり、一歩下がってUIを再設計します。

最初に頭に浮かぶのは、画面の下部にタブ付き領域を作成することです(画面の上部はアイコンの大きな画像専用にする必要があります)。各タブは特定のレイヤーに関連付けられており、対応するコントロールが含まれています。操作。または、このアイデアをさらに進めて、タブではなくアイコンを使用して水平ツールバーを作成することもできます。


また、アニメーションを忘れないでください。アニメーションを適切に使用すると、ユーザーをガイドするのに役立ちます。たとえば、ユーザーが別のレベルに切り替えると、他のレイヤーを一時的に非表示にしたり、現在のレイヤー要素を別の色で一時的にハイライトしたりできます。アニメーションは多くの実装なしで多くの問題を解決できます-特定のGUI要素の透明度/色をアニメーション化するだけです。

1
Sergey Lost