この回転キューブインターフェイスはユーザーフレンドリーですか？
私は革新的なフォームインターフェイスのプロトタイプを作成しています。フォームのさまざまな部分がキューブのさまざまな側面に表示されています。立方体が回転し、ユーザーは立方体が回転するときにそれを埋めることができます。 これは実際の例です ：
私にとっては、問題に対するかなり堅牢な解決策のように見えます（つまり、以前は、フォームがページ上で多くのスペースを占有し、非常に退屈でした）。私が知らない問題を経験します。
これはユーザーフレンドリーなモデルのように見えますか？そうでない場合は、どうすれば改善できますか？
これは実際の例にすぎないとおっしゃっていたように、フォームには主にダミーのデータ（以下を参照）をいくつか入力しました。このデザイン全体で私が唯一懸念しているのは、キューブの面が実際に表示されていない限り、入力フィールドが入力を受け付けないことです。ほとんどのユーザーが見えない入力フィールドに入力するのは面倒であり、その顔が再び表示されると、そのフィールドが入力したすべての情報を失ったことに気づきます。
Luke Wroblewski は、サインアップフォームに関して彼のサイトにいくつかの素晴らしい情報を持っているので、レイアウトを微調整するために一見する価値があります。住所の詳細がすべて1行になっていることに気づきました。少なくとも住所と郵便番号または郵便番号に分割し、より複雑な住所のオプションフィールドをもう1つ追加することをお勧めします。フォームで国際住所を処理する場合は、この XMattersに関する記事 を確認してください。
最初の申し込み時に本当に社会保障番号を取得する必要があるかどうかを検討します。一部のユーザーがその種の詳細について少しおもしろいので、それが絶対に必要な場合は、なぜそれが必要なのかについていくつかのインラインヘルプを提供することをお勧めします。可能であれば、 段階的関与 を介して情報を取得することを検討してください。
少々不快なので、私はおそらくそれほど鮮明でない緑を選択し、赤いテキストを別の色に変更します。 Colorblind Webページフィルター を使用して、視覚障害のあるユーザーにどのように見えるかを確認できます。より多くの色を使用することを恐れないでください-しかし、多すぎないでください！ Smashing Magazineには 色理論に関する3部の記事 があります。
私は全体のコンセプトがそれのために多くを行っていると思います、そして主なUXの問題が解決されるとそれはかなり滑らかに見えるでしょう。ユーザーはその新しさを気に入ると思います。最近の登録フォームはとても退屈です。 サインアップフォームは必ず死ぬ （これもLuke Wroblewskiによる）の理由についてのA List Apartに関するこの記事が注目されています。この例では、サインアップの棺桶にある最後の爪を叩くだけかもしれないので、頑張ってください！
深刻な答え：ひどい
それを改善するために、回転する立方体ではないようにすることができます。
主な問題はそれを制御できないことです。優れたユーザーインターフェイスは、ユーザーに「ねえ、私はすごいです。自分にできることを見てください」と考えさせます。
これは私に、「なんてこった、私は吸う。私はフォームに記入することすらできない」と思います。私は3Dメンタルモデルを維持し、内容を上下逆に入力し、テキストを斜めに表示する必要があります。 手錠をかけたままギターを弾くようなものです
ページ上のスペースが気になる場合は、アコーディオンフォームを使用してください。これにより、ユーザーはフォーム全体を確認し、進捗状況を簡単に測定して、現時点で必要なものだけを表示できます。
ばかげた答え：それは素晴らしいです！
2Dシャックルからフォームを解放してくれてうれしいです。 これをN面の3D形状を構築するライブラリに抽象化できますか？ここで、Nは必要なフォームセクションの数です数学が難しい場合は、フォームを再配置してフィットさせることができますレンダリングしやすい形状-11の代わりに12のセクションに分割するなど。
また、点滅するライトを増やしましょう。
番号。いずれにせよ、それを三角形やその他の幾何学的形状にしたとしても、答えはNOのままです。
私はあなたの実際の例を訪問しました（推測はベータか何かです）。運が良かったので、フォームのフィールドに入力してみました。私はそれが書かれていることをもう一度読み込もうとしましたが、またうまくいきませんでした。その後、タブを閉じました。
私はもう一度あなたの質問を読み、キューブを再度訪れ、1秒後に「あなたは私をからかっていなくてはならない」と言って終了しました。
私の答えをうまくまとめると、私の目にはこれは良いUXではありません。決して良いとは言えません。 Webはますます簡単になっています。なぜ難しいことをしたいのですか？
あなたの質問に対する私の答えはノーです。確かに。
さて、私はそれをバラバラにするつもりだと思いますが、ありこれについて本当に私を悩ませるいくつかのことがあります。
- あなたが使っているフォントはわかりませんが、カーニングは私には本当に奇妙に見えます
- 32pxはデータ入力コントロールのかなり標準的な幅です（私は50か何かを使用していると思います）
- 通常、州のドロップダウンリストは、北東から始まる郵便番号でソートされます。
- 送信ボタンは右揃えのIMOである必要があります
- 絵文字は実際の絵文字の画像に置き換える必要があります（テキストベースのものは、テキストによるデータ交換（電子メール）用に予約されています）。
しかし、それ以外の人は、本当に、本当に良いようです。
キューブの作成方法はわかりませんが、回転中にキューブが歪んでいるようです。
自動的に回転する立方体は、どんなユーザーにとってもばかげて面倒です-立方体を（たとえばスワイプで）回転させる可能性があると、かなり面白くなるかもしれません
テキストを上下逆に表示しないでください。ずっと。
美しさ以外の重要な方法で3次元を利用していません。たとえば、フォームの次/前のページを表示するアクションとして、左または右に回転させることができます。フォームの現在のページのヘルプを得るために上に回転、法的通知のために下に回転しますが、これらは通常の使用では表示されません。
私はそれを愛していて、それは本当に役に立つかもしれないと思います。しかし、すべてのコーナーが内側になっているバージョンが欲しいです。
コンテンツとプレゼンテーションを分離するためのCSSの使用は非常によく行われています。強化されたグラフィックエクスペリエンスを好むユーザーはそれを楽しむことができますが、テキストベースのブラウザーのユーザーやCSSスタイルシートを無効にするユーザーには、装飾されていない線形バージョンが表示されます。 、実際のSSNを明かしたくないため、完全にテストすることはできませんでした。私の唯一の不満は、CSSなしで表示すると順序が正しくないことですが、HTML divを再配置することで簡単に修正できます。
正直なところ、あなたはもっと質問をする必要がある段階にいるように聞こえます。
あなたの統計は、多くの人々があなたのフォームの古いバージョンを使い始めたがそれを完了できなかったことを示唆していますか？これは、退屈な作業をやり通すのに退屈または不十分なインセンティブを示している可能性があります。目新しさ（キューブインターフェイスなど）は役立つかもしれませんが、フォームの長さを短くすることで、より多くの成功を収めることができます。これが人々に強制される必須のフォームである場合、あなたは退屈な側でエラーを起こす必要がありますが、混乱することは不可能です（つまり、notキューブ）。
人々は少数の特定の質問でやめる確率が最も高い傾向がありますか？ （例：こんにちは。匿名のアンケートにご協力ください！Q1：あなたの社会保障番号は何ですか？）フォームが要求する情報の一部がユーザーが不快に共有しているものであるなど、他の何かを示している可能性があります。これが事実である場合、回転する立方体は間違いなく答えではありません。
上記のような質問をしてから、キューブインターフェイスがそれらにどのように対処するかを自問してください。それがすべて「斬新」である場合は、問題がある可能性があります。一人の小説は別の人の混乱です。
個人的には、キューブインターフェースが、目の保養を加えること以外にフォームに記入するプロセスに意味のあるものを本当に追加する方法を思いつくのに苦労しています。フォームへの入力は線形プロセスです。フォームのさまざまなフィールドを3Dオブジェクトの側面に関連付けると、ユーザーがフォームに記入するのにどのように役立ちますか？異なる立方体の面に隣接するフィールドがあると、実際に邪魔になりますか？
繰り返しになりますが、すべてのキューブインターフェイスが「退屈さを減らす」ことを行う場合は、代替案を検討する必要があります。フォームの言語をスパイスアップします。 「住所」の代わりに「本物の枯れ木に印刷されたスパムを送信する場所を指定してください！」 （あなたが実際にスパマーであるならば、これは不快であるかもしれません！）。楽しいものを追加してみてください。例えば名前の直後に、「シークレットエージェントのコールサイン」のフィールドを追加します（パスワードの回復に役立つ場合があります）。タイポグラフィとインターフェースで遊んでください。見やすいフォルムに。 （上記で投稿したRogerの立方体の画像は、すばやく汚れたモックアップですが、完成したフォームに遠くに見えると思われる場合は、おそらくこれについてサポートを受ける必要があります。）
幸運を！
ユーザーエクスペリエンスの観点からすれば、これは素晴らしい動作をすると思います。そう遠くない将来、all Webフォームがこのモデルを使用することを提案します。
改善するための私の唯一の提案は、おそらくアニメーションを高速化することです-フォームフィールドを選択するのは少し難しいかもしれませんが、ユーザーが余分な速度で刺激的で魅力的に感じると思います。
あなたのデザインは明らかに失敗です。十分な忍耐力があれば、isフォームに（少なくとも一部を）記入することは実際に可能です。あなたは明らかにそれを防止しようとしているので、あなたは失敗しました。
あなたの例を見たとき、それは単なる技術デモであり、フォームを操作している間は回転しないと確信していました。しかし、回答とコメントを読んだ後、私は間違っていたと思います。
回転するフォームは、おそらくすべての訪問者を失うことになります。
代わりに、ローテーションを使用してフォームの異なるページを切り替えることをお勧めします。私は PCゲームのメインメニュー「リディックの年代記：ブッチャーベイからの脱出」 のようなものを考えています。あなたがそれを速くてスッキリさせることができれば、これは素晴らしい効果をもたらすでしょう。
使いやすさは、このフォームにリンクするのと同じ文章では使用しないでください。
75％の時間でフォームを表示することもできません。表示することさえできない使いやすいフォームを作成するにはどうすればよいでしょうか。
印象的な3D CSSですが、時間の無駄です...
修正方法：キューブの回転を停止し、目立たない色を選択してください。フォームを表示...常に！
あなたが言った：
「そうでなければ、それを改善するために私は何ができますか？」
ここにいくつかの提案があります：
目を傷つけない色にしてください。
キューブが常に回転するのを止めます。
すべてのデータを一度に表示できることを確認してください。
つまり、適切な入力フォームのようにします。
非常に革新的なアプローチ。
しかし、パラダイムシフトはユーザーフレンドリーではないと思います。あなたがやろうとしていることは、ユーザーが実際にこれを行う方法を変えることです。これは、ユーザーの知覚に挑戦するだけでなく、学習曲線を向上させます。
これを実際の生活で想像してみてください。私は大きな立方体を持ち、それを回転させて何かを書きます。そして、私は他の人が最終的にそれをどのように読むかわかりません。挑戦的なタスクEh！
より現実的なものを考えてください。
キューブをマウスで移動するときなど、ユーザーに完全なコマンドを与えることで、ユーザーはセクション（送信、フォーム、その他）をすばやく選択できるようになります。現在、私は立方体が正しい位置に向くのを待つ必要があります。
立方体を停止せずに回転させる代わりに、立方体の回転効果を1つのページから別のページへの遷移として使用する場合、この概念は本当にすばらしいと思います。立方体は最初の面に回転するそして停止で、ユーザーに最初の面を読み取る時間を与える。ユーザーがそれを完了したら、次へボタンをクリックして、立方体を次の面に回転させることができます。
それは、多くのユーザーを楽しませてくれると思う興味深い移行を追加します:)
わかりました、私は懐疑的でしたが、作業バージョンを試してみて、とても楽しかったです！
これは、ゲームのサインアップフォームや子供向けの何かにとっては絶対に素晴らしいアイデアです。これを使用してサインアップすることは困難であり、サインアップ自体が得られる賞なので、アクセスが制限されたコミュニティに最適です。入力フィールドが少なく、回転が少なく、見栄えがよく、ユーザーがドラッグできることで、本当にクールになるかもしれません。
しかし、あなたの質問によく答えると、このプロジェクトの場合、それはうまくいかないようです。
この退屈な形の世界にあまりにも長く住んでいる人として、誰かがやって来て障壁を完全に破り、パラダイムシフトを引き起こし、アクセシブルで革新的な形で本を書き直す日が来るとは思いもしませんでした。 .. 今まで。
追加したユーザビリティの観点からの私のお気に入りの項目のいくつかは、GoogleやFacebookの同類のものを借りて、コンバージョン率を向上させるのに役立つと思います。
立方体の片側に焦点を合わせることができない-これは素晴らしいです。私はどのようにフィールドに入力してみるのが好きですが、別のフィールドにすばやく入力できるように、立方体の面が再びロールバックするのを待つ必要があります。あなたのフォームに記入するのに約6分かかりました。これは、私が使用した他のフォームに30秒かかったフォーム（ジョーク）よりもはるかに優れていると思います。登録ページのユーザーを長く維持することは、間違いなく直帰率を下げるのに役立つと思います。
小さな判読できないラベル-なぜ誰もこれを考えなかったのですか？誰もがフォームを作成することに関心を持っています。フォームへの記入プロセスを簡単にするために、わかりやすく大きく便利なコンテキストラベルやその他のことを（またはそう言っています）考えています。ラベルを読むために2、3回ズームインする必要がありましたが、立方体の速さは私の目が適切に焦点を合わせることができないことを意味します：よくできました。
立方体の速度-タイトルを初めて見たとき、私はすぐに考えました。立方体の回転が非常に遅くなり、フォームのラベルと入力をはっきりと見ることができます。だった。立方体の速度は速いですが、あまり速くありません。目がぼやけたりぼやけたりするのに十分な速さですが、速すぎません。立方体の速度により、サイトの表示が速くなると思います。
しかし、悲しいかな、あなたのフォームにはいくつかの問題があります：
そのフォントはあまり魅力的ではありません-より良いフォントを試してみることをお勧めします。ComicSans MS Boldがおそらく私の最初の選択肢です。読みやすく、回転するキューブがさらに楽しくなります。
緑は十分に明るくありません-申し訳ありませんが、その緑は十分に明るくありません。よりモダンに見えるように、かなり多くの色合いを明るくすることができます。
送信ボタンが中央に配置されていません-キューブの送信ボタン側を中央に配置する必要があると思います。現時点では、送信ボタンは左に揃えられており、ボタン内のテキストも中央に配置されていません。これはアクセシビリティにとって悪いことであり、これらの2つの小さな調整を行うことで確実に改善されます。ボタンを黒または白にすることで、デザインで少し機能させることを検討してください。グレーはとても時代遅れに見える傾向があります。
暖かさやキャラクターの欠如-アニメーションGIFの欠如がフォームに本当に影響していると思いますが、それだけでなく、ソースを調べたところ、<Marquee>の単一のインスタンスが表示されませんでした鬼ごっこ。審美的には、それは私の好みのために少し静的すぎます。そこでのいくつかの動きは、（もちろんフォントの変更と組み合わせて）より楽しくすることができます。
検証の欠如-私の知る限り、フォームには検証や検証メッセージが欠けています。検証なしのフォームは、ユーザビリティの悪夢です。可能であれば、検証メッセージに<Marquee>タグを使用して、長年にわたって遭遇した他のフォームのように、メッセージをよりフレンドリーでパッシブアグレッシブでなくすることを検討する必要があります。
社会保障番号のラベルが長すぎる-ラベルが他のラベルよりも幅が広い場合は、ラベルを正しく揃えるか、このテキストに改行を入れて、行を少し短くして読みやすくすることができます。
GoogleではChrome（最新）Mac OSでは、選択ドロップダウンが壊れています-ラベルテキストがラベルの上に表示されます。
ここでもGoogle Chrome（最新）Mac OSでは、法的情報ページの見出しが壊れています-私は実際に切り捨てられているので、本当に「重要な法的情報!!!」を参照してください。
感嘆符が多すぎます-法的条項のページで叫んでいるのはなぜですか？ 1つ、最大、2つの感嘆符。ルール知ってる？感嘆符が多すぎる素晴らしいデザインを台無しにしないでください。
全体的に素晴らしいデザインですが、より優れたトロールです。これはおそらく私が今まで読んだ中で最高のトロールの質問の1つであり、Yahoo！で出くわした質問のいくつかに匹敵するものですらあります。回答してくれてありがとう。
6ページ以下にする場合は、これでうまくいきます。
ページの一部が前を向いていないと表示されないことを認識してください。それはユーザビリティの問題かもしれません。
UIは、回転するツールバーがある場所で作成されています。繰り返しますが、顔は4つに制限されており、ユーザーは何が横にあるのかを理解できず、ユーザーを混乱させ、苛立たせました。
適切なオリエンテーションは挑戦になります。
しかし、時にはイライラしたい人もいます。 Angry Birdsを見てください。人々は行方不明になり、挑戦はますます難しくなります。でも楽しい！それはすべて、達成しようとしていることに依存します。
スライスしたパン以来の最高のもの
以下に、勢いをつけるのに適したライブラリを示します。 https://chrisbateman.github.io/impetus/
キューブだけではない場合： https://stackoverflow.com/questions/33629754/text-within-a-non-rectangular-shape-pentagon-or-hexagon
私の古いウェブサイト。
それから私は仕事を探す必要があり、より「普通」であることに決めました
何人かで試してみませんか？いくつかのユーザーテストが必要だと思います。
これまですべての時間を使ってプロトタイプを組み立ててきたので、ユーザーに試してみてください。あなたはこれを何のために構築しているのか正確に言っていないので、それが良いかどうかをどうやって知ることができますか？個人的には、あなたのプロトタイプは楽しいものだと思いました-それは本当に楽しいゲームになるかもしれません。これが事実である場合、ユーザーテストはあなたに肯定的な結果を与えるかもしれません。
しかし、あなたがゲームを作っているのは疑わしい。おそらく、あなたの被験者はそれを信じられないほど煩わしく感じるでしょう。しかし、誰が知っていますか！これがユーザーテストの優れた点です。ほとんどの場合、あなたを驚かせるものが存在します。
次のように、テキストを垂直方向に並べ替えた方がいいと思っていました。
- k
- 私
- l
- l
- メートル
- e
- :)
これが標準のコンピューター画面上にある場合、正直に言うと、このアプローチは失敗だと思います。すべての批評家が非常に有効で詳細なので、繰り返しはしませんが、すでに多くのフィードバックを受け取っています。
[〜＃〜]しかし[〜＃〜]
これがVR/AR環境の一部であり、キューブを手動で操作できると考えている場合、これはそのようなスペースのエントリを形成するための新しいアプローチだと思います。キューブをサブミットする方法としてスロットに挿入することもできます。