iPad または他の iOS デバイスを持っている人が自分のサイトにアクセスできるようにしたいのですが。
一般にiPadまたはiOSと互換性のあるユーザーインターフェイスを設計する場合、どのような考慮事項を考慮する必要がありますか?
確認してください Jakon Nielsenの問題に対する考え 。 下部にリンクされているビデオ は3分だけの長さで、直接役立つものではないにしても興味深いものです。
一般的な考え(個人的な経験以外にこれを裏付ける事実はありません):
幸運を!
これは、一般的なUIの質問にさらに当てはまります。
「触る、クリックしない」と考えてください。あなた(または潜在的なクライアント)はhandsでアプリをどのように使用しますか?マウスで何かを指すことと、手で何かを指すことには基本的な違いがあります。おそらく、人々が簡単にアクセスできるように、最も重要な制御を側面で行うでしょうか?さまざまなワイヤーフレームを試し、使いやすさを評価してもらいます。プロセスの早い段階でのユーザーテストは、設計の改善に非常に役立ちます。
IPad向けに最適化/準備されたサイトを設計する際に注意すべきことについて ブログ を書きました。あなたはそれが役に立つかもしれません。
IPadはウェブを閲覧するために設計されました。大きな画面は、ウェブページ全体の幅を表示することを可能にします。したがって、iPadではWebページのデザインは問題ないはずです。
IPhone、iPod Touchの場合、異なるデザインを作成して、ネイティブのiPhoneアプリと同様のUIを作成することを検討できます。これを可能にするために使用できるツールがありますが、多くの作業になります。チェックアウト Sencha Touch 、これはiPadにも使用できます。
Sencha Touchのようなものを使用したくない場合は、ユーザーの操作がこれらのデバイスではまったく異なることを考慮する必要があります。それらはタッチベースであり、マウスベースではありません。例としては、ホバーエフェクトがタッチベースのデバイスでは機能しません。また、マウスのクリックは、iOSのブラウザーがキャプチャするタップの非アクションとは異なります。つまり、iOSで使用するJavaScriptをカスタマイズして、よりネイティブで直感的にすることで、ユーザーインタラクションを向上させることができます。
Appleはまた、iOS上のネイティブアプリ用に Human Interface Guide を作成しました。これはユーザーがネイティブアプリに期待するものであるため、これを検討することをお勧めします。これに準拠したWebページがあると、サイトを理解しやすくなります。
画面サイズと考えられるさまざまなレイアウトを忘れないでください: 横向き/縦向きのiPad CSSレイアウト
特に新しいサイトを設計するのではなく、既存のサイトまたはアプリケーションを適応させることに関して、私が追加したかった2つの問題-これらは些細なことのように見えるかもしれませんが、それでも:
指はマウスよりも正確でないため、要素はデスクトップアプリよりも大きくする必要があります。
最近、いくつかのグラフィックスアプリを使用していて、移動しているオブジェクトが見えにくくなるため、指でオブジェクトを正確に配置するのが非常に難しい場合があることを確認しました。 Appleが行ったように見える)これを修正する1つの方法は、指をいくつか移動した後にのみ移動を開始することです。そのため、移動するオブジェクトの上にはありません。
現在、複数選択は非常に面倒です。 Apple 1つのオブジェクトを1本の指でタップし、複数のオブジェクトを他のオブジェクトでタップして複数選択を作成するアプローチは好きではありません。4〜5個以上のオブジェクトが必要になると、バラバラになります。ドラッグ選択の方がうまくいく場合があります。たとえば、まず選択ツールのタブを押してから、複数のオブジェクトをドラッグ選択します。