開発者、デザイナー必見！　アプリ制作勉強会 / 勘違いだらけのAndroid UIデザイン / HTML5でアプリの壁を超える技

火曜に、スマホ系セミナーに行ってきました。

「開発者、デザイナー必見！　アプリ制作勉強会 / 勘違いだらけのAndroid UIデザイン / HTML5でアプリの壁を超える技」（2012.8.21）

大盛況で370名満員御礼。座席を詰め過ぎたのかギュウギュウ状態。
肩身が狭く、途中休憩もなかったので、今回は身体的にキツかったです。。

html5でアプリの壁を超える方法

吾郷協氏（面白法人カヤック）

Slide: http://0-9.sakura.ne.jp/pub/appsemi/start.html

HTML5とアプリの間には壁がある。

BGM・効果音の実装が難しい（＋iOSは特に制限が多い）
カメラ操作ができない（iOSはJSからカメラAPIにアクセスできない）
動作速度がそもそも遅い（＋iOSのWebViewはJITが効かない）
デバッグ・テストが難しい
エフェクトの限界（iOSは描画速度、AndroidはCSSサポートの問題）
通信の問題

対応策があるものもあれば、どうしても難しいというものもあるようです。

中でも、HTML5でアプリ開発をする際に個人的に一番気になるのは動作速度ですかね。
まず、スマホのブラウザは、クリックイベントの後にどうしても 300ms程度の待ち時間（ダブルタップの待ち時間）が発生するとのこと。
これには回避コードがあるようです（ただし、ダブルタップはできなくなる）。
コレのことかな？

次に、jQuery Mobileを使った場合の初期化時間（ダウンロード＋初期化で 500ms）が。
もちろん、jQuery Mobileの機能が使えるメリットとのトレードオフなので仕方ない面もあるのでしょうが、これは、JSで画面遷移すれば緩和できるとのこと。

いろいろ聞いてると、Android 2.x系はHTML5との相性が悪いみたいですねー。
うーん、どうしたものか。

勘違いだらけのAndroid UIデザイン

佐藤伸哉（Secret Lab, Inc.）

Slide: http://www.slideshare.net/nobsato/android-ui-design-14036267

主な内容は、AndroidのUIデザインの改善について、です。

アプリの独自性＝コンテンツ。見た目で独自性を出すべきではない。
開発済みのiPhoneアプリをベースにAndroidアプリを開発すると逆に工数が増える。
Fragment（Android 3系で導入された、複数デバイスに対応するためのクラス）を使うと逆に工数が増える。
- http://y-anz-m.blogspot.jp/2011/02/android-30-fragments-api.html
- http://matome.naver.jp/odai/2133217279362781401
Androidは複数画面サイズの画像を用意したりとか、面倒くさい。
Android向けデザインのガイドラインを熟知しているデザイナが少ない。
- 機能ボタンはAndroidなら上側、iPhoneなら下側に配置すべき、とか。
- 他にも 9-Patchツールの使い方とか。
検証すべき端末は、NexusシリーズなどのGoogle指定端末だけでOK。
プロトタイプは、ワイヤーフレーム＋ユーザフローを中心に「ペーパープロトタイピング」から始めるのが吉。
- 作る前に、画面の流れのデザイン（フロー）をしっかり決めることが重要。
より良いアプリを作るためには、「Improving App Quality」を読むべし。
- 他のアプリとの連携を前提にして、機能を絞れ。
- アイコンはディテールにこだわって作れ。
- 日本語訳もあるよ（「安藤日記」）
「Android Design Guidline」は必読。