2012年2月4日土曜日

スマホサイトのための正しいアプローチ その3

テーマ:№3 親指フレンドリーでいこう。№4 見えるデザインせよ。 №5アクセスしやすくする

副題:Google「GOMO」を読み解く

「GOMO http://www.howtogomo.com/)
「スマホのための10のキーワード」
 googleが2011年11月2日に公開したGOMO。彼らは何を伝えようとしているのか
断片的な情報の中に、書かれたキーワードを読み解いてきます。
今回は10のキーワードについて №3~№5まで分析を続けてみます。

 

№3

 Be Thumb Friendly

親指フレンドリーでいこう 

  デスクトップならマウス、ノートブックなら、トラックパッド、そしてスマートフォンならば親指!が重要です。とGoogleは大事だという。そうなんだろうか。iphoneであっても、ボクの場合、操作はひとさし指のほうが多い気がする。なぜなら、ボタンを押し間違えるからだ。Googleは間違っているのでは。いやいや電車の中で観察すると、どちらも多い、親指の人もいれば、ひとさし指の人もいる。ただ、条件反射的に、握ったままフリーになっているといえば、親指なのだ。

 どちらが大事の議論ではなく、「親指でも操作が可能なスマホ・デザインを意識しよう」で、いいだろう。 そこでいう。 

  • センターにボタンを大きく配置すれば、戸惑いが減り、ミスクリックを減します。

  • ボタンを叩くと範囲がひろがりげて、タップ可能なエリアを増やしましょう。

  • テキストもクリックカブルにして、チェックボックスをONさせます。

  • あとは、案外、ボタンの配置に余裕を持たせることが大事です。

これらを実現すると、多くの場合、具の大きなデザインを作ってしまいます。タイト感が消えてしまって、かっこ悪くなるのが、デザイナーとしての悩みになりそうです。ここも親指によるユーザビリティテストをしっかり行うということになります。

「さあ、テスターのキミたち、今回のサイトは、親指だけで操作してみてください。もし、なにが不具合があれば、報告ください。」

 

   

№4

Design for Visibility

見えるデザインせよ。

Googleはいいます。「目にストレスを与えないで、メッセージを伝える必要があります。読んで覚えてもらうことを第一に、明るさが足らない場所でもカンタンに操作が行えるようにしましょうと。アプローチは下記です。
 



  • 背景とテキストの間のコントラストを調整します。 
  • コンテンツはスクリーン上でフィットするかどうか、ピンチングやズームなしで、読むことができるか、確かめましょう。
  • たっぷり、空きスペースを用意しましょう。
  • リンクボタンの優先を示すために、サイズと色を工夫しましょう。
  • タンには、3D効果やシャドウを使ってデザインしましょう。

ここは特に具体的なテクニックで、企業担当者社様なら、しっかりと考えておくべきところです。ち見た目のデザイン品質ばかり追ってしまうと、抜けてしまいがな部分となります。むしろ上記のポイントを抑えた上で、いかにデザイン的に満足いくかが、ポイントかもしれません。いまのうちから、ディレクターやデザイナーも視点を変えて考えておくべきところでしょう。
さらにその3と同様に、これも暗い夜の街、明るい過ぎるビーチやグラウンド、キッチンなどの空間など、ちょっと使いにくいコンディションでもどうかを考えてみましょう。









№5

Make it Accessible

アクセスしやすく

理想にいえば、作られたモバイルサイトは、あらゆるモバイルデバイスに適合させるべきです。 さてお題目は下記のとおりです。
 
  • フラッシュについては、一部のデバイス(iPone)では機能しません。
  • HTL5 インタラクティビティやアニメーションのためには、HTML5を使用してください。
  • 水平・上下動に的確に配置させたデザインが求められます。
  • デザインのルールを変更した場合、ユーザーにはそのサイトに留まってもらうことが大事です。

 ご存じように、iPhoneおよびiPadなど、Apple社製品ではFlashが使えません。そのために、Flashに置き換わる方法を考える必要があります。単純にいえば、動的を辞めて画像に置き換えることもわかりやすい方法です。
どうしても動的なものならば、ムービーファイルを独立させてHTML5で組むことをGOMOは進めています。ただし、HTML5はまだ正式にリリースされていない規格。一部のアンドロイド機では不具合があるなど、もう少し時間がかかりそうです。現実には、HTML4とCSSの組み合わせのほうがバグが少ないようです。
また一番下の、デザインを統一することを重要ポイントをにしています。いきなり
デザインが変わって、イメージが変わった瞬間に離脱が起こることを示唆しています。実は、作った時期や担当のデザインが変わると起こりやすい問題です。 


これらについて、みなさんは、どう思われますか?ぜひ反論、追記、いろんな意見を聞いてみたいと思っています。 




高速なスマホサイト変換ならDomobi!
http://domobi.domore.co.jp/
 

 


0 件のコメント:

コメントを投稿