O slideshow foi denunciado.
Seu SlideShare está sendo baixado. ×

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

Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio

Confira estes a seguir

1 de 41 Anúncio

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

Baixar para ler offline

【増員!→370名】 開発者、デザイナー必見! アプリ制作勉強会 / 勘違いだらけのAndroid UIデザイン 発表資料(2012年8月21日)
http://atnd.org/events/31039

The presentation doc for Smartphone application design seminar on 2012/08/21 by WAVE Multimedia School.

【増員!→370名】 開発者、デザイナー必見! アプリ制作勉強会 / 勘違いだらけのAndroid UIデザイン 発表資料(2012年8月21日)
http://atnd.org/events/31039

The presentation doc for Smartphone application design seminar on 2012/08/21 by WAVE Multimedia School.

Anúncio
Anúncio

Mais Conteúdo rRelacionado

Diapositivos para si (20)

Quem viu também gostou (20)

Anúncio

Semelhante a 勘違いだらけのAndroid UIデザイン (20)

Mais de Nobuya Sato (20)

Anúncio

Mais recentes (20)

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

  1. 1. 1
  2. 2. WAVEイベントセミナー・アプリ制作勉強会 勘違いだらけのAndroid UIデザイン Android UI Design, Too Much Misunderstanding Nobuya Sato Secret Lab, Inc. August 21st., 2012 Twitter: #appsemi Copyright © 2012 Secret Lab, Inc. All Right Reserved.
  3. 3. 自己紹介 •  @nobsato •  UXデザイン、デザイン戦略、IA –  1994年からWebデザイン –  Webエージェンシーで大規模な企業サイトの情報設計や企業 のグローバル戦略、海外サイト構築やグローバル展開 –  Sonyのデザイン部門でAndroidのPF戦略やタブレット戦略 –  米Seesmicで日本語化やAndroidアプリやWP7アプリ –  現在はUXやUIデザインのコンサルティング、デザイン調査 Copyright © 2012 Secret Lab, Inc. All Right Reserved. 3
  4. 4. 本日のテーマ •  勘違いだらけのAndroid UIデザイン 1.  Androidで独自性を出すのは大変? 2.  Androidアプリの開発は工数が係る? 3.  Android向けのデザインは大変? 4.  検証すべき端末は数百、すでに飽和状態? Copyright © 2012 Nobuya Sato. 4
  5. 5. UX/UIデザイン UX = UI ? Copyright © 2012 Secret Lab, Inc. All Right Reserved. 5
  6. 6. UX/UIの違い The Difference Between UX and UI: Subtleties Explained in Cereal Copyright © 2012 Secret Lab, Inc. All Right Reserved. (写真が語るUXとUIの違い) 6
  7. 7. Copyright © 2012 Secret Lab, Inc. All Right Reserved. 7
  8. 8. Copyright © 2012 Secret Lab, Inc. All Right Reserved. 8
  9. 9. Copyright © 2012 Secret Lab, Inc. All Right Reserved. 9
  10. 10. Copyright © 2012 Secret Lab, Inc. All Right Reserved. 10
  11. 11. Copyright © 2012 Secret Lab, Inc. All Right Reserved. 11
  12. 12. UX/UIデザインの改善? •  ユーザーの使い方、モノの使われ方を観察して問題点 を直すことで、ユーザーの体験を改善でき、モノの使 われ方やユーザーエクスペリエンス(UX)を向上する ことができる Copyright © 2012 Secret Lab, Inc. All Right Reserved. 12
  13. 13. UX/UIデザインの改善? •  ユーザーの使い方、モノの使われ方を観察して問題点 を直すことで、ユーザーの体験を改善でき、モノの使 われ方やユーザーエクスペリエンス(UX)を向上する ことができる  → 改善しているのはUX(使い方や使われ方)、 本来のUI(ボタンやアイコン)は スライドで 見てきた例では改善されていない。 Copyright © 2012 Secret Lab, Inc. All Right Reserved. 13
  14. 14. UIデザインの改善 1.  提供しようとしているコンテキスト(内容)は何か? 2.  どのように機能を提供できるか? 3.  その場におけるルール(作法)は何か? Copyright © 2012 Secret Lab, Inc. All Right Reserved. 14
  15. 15. 勘違いだらけのAndroid UIデザイン Copyright © 2012 Secret Lab, Inc. All Right Reserved. 15
  16. 16. 先ほどのテーマの回答 •  勘違いだらけのAndroid UIデザイン 1.  Androidで独自性を出すのは大変? 2.  Androidアプリの開発は工数が係る? 3.  Android向けのデザインは大変? 4.  検証すべき端末は数百、すでに飽和状態? Copyright © 2012 Nobuya Sato. 16
  17. 17. さっそく本日の回答 •  勘違いだらけのAndroid UIデザイン 1.  Androidで独自性を出すのは大変 メーカーは端末の差異化を出すので大変です SNSゲーム会社は複数プラットフォーム向けにアプリ を対応させるのが大変です 独自性と独創性が混在していることが多いです。 アプリの独自性=コンテンツ、内容の事。見た目で 独自性を出すのは大変です。  Copyright © 2012 Nobuya Sato. 17
  18. 18. さっそく本日の回答 •  勘違いだらけのAndroid UIデザイン 2.  Androidのアプリの開発は工数が係る? 社内に経験がない技術で開発すると大変です。 工数削減のために、既に開発済みのiPhone向けアプ リをベースに開発すると、実は大変です。 (ネットにある記事のほとんどがこの話です) 現状、Fragmentを利用して複数デバイス(タブレット /フォーン)向けに完璧に開発しようとすると、実は かなり大変です Copyright © 2012 Nobuya Sato. 18
  19. 19. さっそく本日の回答 •  勘違いだらけのAndroid UIデザイン 3.  Android向けデザインは大変? 複数サイズのリソース用意したりとか面倒くさいです 複数画面サイズのレイアウトデザインが必要で、実はちょ っと面倒くさいです Android向けのデザイン作業やデザインのルールを熟知し ているデザイナーがまだまだ少ないです デザイナーといってもiPhoneアプリのデザイン経験者が 多い。デザインがiPhoneっぽくなって… Добрый день Copyright © 2012 Nobuya Sato. 19
  20. 20. さっそく本日の回答 •  勘違いだらけのAndroid UIデザイン 4.  検証すべき端末は数百、すでに飽和状態? Copyright © 2012 Nobuya Sato. 20
  21. 21. さっそく本日の回答 •  勘違いだらけのAndroid UIデザイン 4.  検証すべき端末は数百、すでに飽和状態? そうえいば18ヶ月保証とかありましたが… NexusシリーズやGoogleが指定しているリファレンス端末 (Xoomなど)を、OS毎に用意 ※OS毎の例:Android 1.6 = HTC Magic、Android 2.0 = DROID、Android 2.1 = Nexus One、Android 2.3 = Nexus S、Android 3.x = Xoom、Android 4.0 = Galaxy Nexus、Android 4.1 = nexus 7 国産メーカー(シャープ、NECカシオ、パナソニック、 ソニー)は☓。やっぱり海外端末、特に開発コミュニティ にも優しいSony EricssonかSamsungが良い。 ※LGやASUSなどの変態端末も可。海外主流の京セラもわりと良い Copyright © 2012 Nobuya Sato. 21
  22. 22. さっそく本日の回答 •  勘違いだらけのAndroid UIデザイン •  主な開発手法 –  ネイティブ –  側だけネイティブ+中身をWeb View –  HTML5ベース  → 標準ブラウザも実はかなりいじられている Copyright © 2012 Nobuya Sato. 22
  23. 23. 良いアプリUIのデザイン方法? Copyright © 2012 Secret Lab, Inc. All Right Reserved. 23
  24. 24. UIプロトタイピング •  まずはUIのプロトタイピングから… Copyright © 2012 Secret Lab, Inc. All Right Reserved. 24
  25. 25. UIプロトタイピング •  ワイヤーフレームとユーザーフローをしっかり作る © Geeky Gadgets Copyright © 2012 Secret Lab, Inc. All Right Reserved. 25
  26. 26. ペーパープロトタイピング •  費用も掛からず、全員が確認できて効果的 © The Mobile Frontier Copyright © 2012 Secret Lab, Inc. All Right Reserved. 26
  27. 27. UIステンシルツールなどを使う •  画面デザインを沢山つくるのに便利 Google I/O 2012で配られたGoogle Android UI teamオフィシャル?ステンシル Copyright © 2012 Secret Lab, Inc. All Right Reserved. 27
  28. 28. 面倒くさい人には… Copyright © 2012 Secret Lab, Inc. All Right Reserved. 28
  29. 29. UIデザイン=画面の流れのデザイン •  アプリを作る前に必ず、画面フローを確認をする © Six Revisions © xDevelop Copyright © 2012 Secret Lab, Inc. All Right Reserved. 29
  30. 30. 良いアプリの作り方? Copyright © 2012 Secret Lab, Inc. All Right Reserved. 30
  31. 31. より良いAndroidアプリの作り方 •  https://developer.android.com/intl/ja/distribute/googleplay/strategies/app- quality.html Copyright © 2012 Secret Lab, Inc. All Right Reserved. 31
  32. 32. Androidアプリの品質向上 •  Google API Expert 安藤さん(@yukio_andoh)による日本語訳 •  http://www.andoh.org/2012/06/android-improving-app-quality.html Copyright © 2012 Secret Lab, Inc. All Right Reserved. 32
  33. 33. Androidアプリの品質向上 1.  ユーザーの声を聞く 2.  安定性の向上とバグの削除 3.  UI 応答性の向上 4.  ユーザビリティの向上 5.  プロフェッショナルな外観と審美性 –  User Interface Deign Tips (2010 July) 6.  必要な機能の正しい選択 7.  システムと第三者アプリの統合 8.  詳細に対して注意すること Copyright © 2012 Secret Lab, Inc. All Right Reserved. 33
  34. 34. Android Design Guideline Copyright © 2012 Secret Lab, Inc. All Right Reserved. 34
  35. 35. Android Design Guideline、Jelly Bean対応! •  http://developer.android.com/design/ Copyright © 2012 Secret Lab, Inc. All Right Reserved. 35
  36. 36. 旧Android Design Guideline(ICS版) •  http://developer.android.com/design/ Copyright © 2012 Nobuya Sato. 36
  37. 37. Android Design Guideline日本語版? 残念ながら表示しません。 Copyright © 2012 Secret Lab, Inc. All Right Reserved. 37
  38. 38. 有志による日本語訳版(ICS版) •  松岡さん(@kenz_firespeed)による日本語訳版 •  http://firespeed.org/diary.php?diary=kenz-1462 Copyright © 2012 Secret Lab, Inc. All Right Reserved. 38
  39. 39. 補足 : 9-Patch •  http://developer.android.com/intl/ja/tools/help/draw9patch.html •  Android SDKで提供されている伸縮可能なボタン画像 を簡単に作るツール •  黒いドット部分を元に自動的に紫のように拡大される •  ドットの指定方法が少し奇抜で慣れが必要 伸縮可能 エリア パディング 指定も可能 Copyright © 2012 Secret Lab, Inc. All Right Reserved. 39
  40. 40. 補足: Action Barの理解を助ける書籍 •  Action BarやICSで追加されたAPIなどを理解するのに 良い参考書(エンジニア向け) •  Android UI Cookbook for 4.0 ICSアプリ開発術 •  あんざいゆき(@yanzm)/著 •  インプレスジャパン Copyright © 2012 Secret Lab, Inc. All Right Reserved. 40
  41. 41. Thank You Nobuya Sato Secret Lab, Inc. nobsato@secret-lab.jp http://about.me/nobsato http://twitter.com/nobsato http://slideshare.com/nobsato Copyright © 2012 Secret Lab, Inc. All Right Reserved. 41

×