Android UIの罠

Post on 12-Nov-2014

6428 Views

Category:

Documents

2 Downloads

Preview:

Click to see full reader

DESCRIPTION

Androidマーケットでアプリをどんどんインストールしていくと、アプリケーションによってUIがばらばらなのに気づきます。iOSでの開発と比べて、Androidではデザインを含め多くは開発者にゆだねられています。 この発表では、Androidでのデザインについて、僕が実際にアプリケーションを開発している上ではまった内容を列挙します。

Transcript

Android のUI について

@dekosuke

2

Anrdoid アプリの UI の話をしますUI 全般の話というよりは、 Android の特徴的

な点についてですGoogle 推奨 UI ガイドラインに忠実な内容と

なっております

はじめに(前提)

3

Android 携帯

4

Android 端末は沢山ある・・・

↑ の 103 件は色違い含むので、実際はその 1/3 ぐらいですが・・・

5

3ボタン (menu/home/back) or 4ボタン(+search)

ボタンの順番は端末によってばらばら( Android3.0 以降のタブレット端末は、ソフトウェアボタン)

キーボードある端末もある 解像度は 800*480 が一番多いけど、ばらばら

ハードウェアいろいろ

6

下側にボタンを配置すると、 Android 固有のボタンとかぶる

後述の Action Bar/Tab Bar の利用を推奨

下側にボタンを配置するべからず

7

Android で推奨されているレイアウト (Google IO 2010 で発表 )

海外のアプリはこれに沿ってるものが多い 実際に使いやすいかは (ry

Action Bar/Tab Bar

Action Bar

Tab Bar

8

一番必要なボタンは画面内 (Action Bar など ) に置く

あまり頻繁には押さないが、必要なボタンはメニューに入れる

操作ボタンの配置

画面内ボタン↓

メニュー↑

9

端末によって、ボタンの押しやすさには差がある

操作ボタンの配置

10

Back Key を使いましょうBack Key はすべての端末にある 画面に戻るボタンをおくのはやめましょう

戻るボタン

11

Tap するボタンは大きめに配置しよう (Google IO 2010)

Google+/EverNote のダッシュボード

タップのサイズ

12

タッチ精度が iPhone に比べてかなり悪いのでびっくりした(元 ATOK 開発者)

http://www.atmarkit.co.jp/news/201105/27/7notes.html

タッチスクリーン精度

13

タッチスクリーン精度

iPhone Android

14

だめな例↓(あくまで例です)

アイコンのガイドライン

だめ

15

Google 公式のアイコンガイドラインhttp://

developer.android.com/guide/practices/ui_guidelines/icon_design.html

アイコンはちゃんと余白あけないとだめ

アイコンのガイドライン

16

さまざまな画面サイズに対応できる汎用リソース すっごい伸びるよ 専用のエディタあり

9-Patch 画像

17

Android 標準のアイコンなどのリソースが使える (SDK 付属 )

android-sdk\platforms\android-X\data\res

Anrdoid 付属のリソース

18

他のアプリを呼び出せる & 他のアプリからの呼び出しを受け取れる

iPhone より優れている数少ない点 呼び出す側の例 – twitter 連携(ブラウザ呼び

出し) 受け取る側の例 – メディアプレイヤー

インテント

19

ご清聴ありがとうございました

top related