[MOPCON 2014] Google Glass 開發經驗分享

[MOPCON 2014] Google Glass 開發經驗分享

全台灣大約只有20隻!從Google眼鏡問世,開始出現了「穿戴式」的應用的分類 想知道Google眼鏡要怎麼開發?會有什麼樣有趣的應用?實作Glassware上架有什麼重點?一一報給您知!
大綱:
- Google glass 的簡介
- Mirror API 初探
- 10分鐘快速上手 Glass Development Kit (GDK) 開發
- Glassware上架審核重點
- Google glass 與 Android wear 的異同之處

議程介紹:
http://mopcon.org/2014/session.php

8a6e58b272b266faf22d8a3b2927624f?s=128

Johnny Sung

October 26, 2014
Tweet

Transcript

  1. Google Glass 開發經驗分享 Johnny Sung x 2014.10.26 @ MOPCON

  2. None
  3. https://fb.com/j796160836 Johnny Sung Mobile devices Developer https://plus.google.com/+JohnnySung http://about.me/j796160836

  4. Hiiir Works

  5. 世新廣播電臺 Personal Works

  6. Battery Checker https://glass.google.com/glassware/14294674819446771796

  7. 百萬種Google glass爽的⽅方式 2014.06.25 Developing Google Glass 2014.08.27 2014.10.26 Google Glass

    開發經驗分享
  8. Handmade
 USB - 3.5mm phonejack for Glass™

  9. None
  10. Agenda • Google Glass 介紹 • Mirror API 初探 •

    快速上⼿手 Glass Development Kit (GDK) 開發 • Glassware上架審核重點 • Google glass 與 Android wear 的異同之處
  11. 你知道嗎?

  12. 戴 Glass 的⼈人都有份感恩的⼼心

  13. None
  14. None
  15. None
  16. None
  17. None
  18. None
  19. None
  20. 時間很寶貴。

  21. None
  22. Muki Wu (吳姿穎) • Wordpress 課程 • RWD課程 • ⽂文具⼿手帳

    MUKI space* 台灣知名部落客 (因為出賣朋友只好⼯工商⼀一下...)
  23. Timeline (時間軸) https://www.youtube.com/watch?v=jK3WLILYhQs

  24. None
  25. None
  26. MyGlass 連接 Google Glass

  27. None
  28. Clock Live Card Static Card

  29. Clock Static Card Now Past

  30. Clock Live Card Settings

  31. Glass development • Mirror API • Glass Development Kit (GDK)

    • Hybrid
  32. Mirror API

  33. • Periodic notifications & Static Card
 (Push notifications) • RESTful

    API • Choose a favorite language you like Mirror API Go Java .Net PHP Python Ruby
  34. None
  35. Mirror API 可以做到 • 可⾃自由抽換⾃自⼰己建⽴立的 Static Card • 聯絡⼈人(分享的對象) •

    語⾳音指令 (eg: Take a note) • Location updates
  36. Mirror API - OAuth Settings • Google Developers Console •

    勾選 Mirror API • 設定OAuth Client ID
  37. None
  38. None
  39. Tips for Mirror API (PHP) • Edited: $api_simple_key 不需要了 •

    沒有 DNS 域名? ⽤用 DNS 反解吧 $ nslookup 114.42.21.220 Server: 10.100.83.253 Address: 10.100.83.253#53 Non-authoritative answer: 220.21.42.114.in-addr.arpa name = 114-42-21-220.dynamic.hinet.net. http://114-42-21-220.dynamic.hinet.net/
  40. Mirror API - OAuth Settings • APPLICATION TYPE • Web

    application • AUTHORIZED JAVASCRIPT ORIGINS • http://114-42-21-220.dynamic.hinet.net/ • AUTHORIZED REDIRECT URI • http://114-42-21-220.dynamic.hinet.net/mirrorapi/ oauth2callback.php
  41. ⼤大家都說 Glass 是 ...

  42. 盗撮 神器

  43. 拍照三部曲 • ⽂文雅版 • Ok glass, Take a picture Muki

    Wu
  44. 拍照三部曲 • 技巧版 • 眨眼拍照

  45. 拍照三部曲 • ⽂文⻘青版 • 推眼鏡

  46. You can do this …

  47. Ok glass, Take a picture. But don’t do this …

  48. Glass Development Kit (GDK)

  49. Glass Development Kit Sneak Peek
 4.0.3 (API 15) Glass Development

    Kit Preview 4.4.2 (API 19) Android 4.4.2 KitKat (API 19) Android 5.0
  50. = . .

  51. Glass development • Glass Development Kit (GDK) • Ongoing task

    & Live Card (活動卡⽚片,即時卡⽚片) • Low Frequency Rendering • High Frequency Rendering • Immersion (沉浸式體驗,獨佔式體驗)
  52. <activity android:name=".MainActivity" android:label=“@string/app_name"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" />

    </intent-filter> </activity> <activity android:name=".MainActivity" android:immersive="true" > <intent-filter> <action android:name="com.google.android.glass.action.VOICE_TRIGGER" /> </intent-filter> <meta-data android:name="com.google.android.glass.VoiceTrigger" android:resource="@xml/voice_trigger_start" /> </activity>
  53. public class HelloActivity extends Activity { private TextView sampleTextview; @Override

    protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.card_main); sampleTextview = (TextView) findViewById(R.id.sample_txt); } } As same as android :D
  54. Voice trigger ok glass, show me a demo

  55. VoiceTriggers.Command • add an event • calculate • call me

    a car • capture a panorama • check me in • check this out • control my car • control my home • explore nearby • explore the stars • find a bike • find a dentist • find a doctor • find a hospital • find a passage • find a place • find a place to stay • find a product • find a recipe • find a video • find a website • find reviews • find the exchange rate • find the price • flip a coin • give me feedback • help me sign in • keep me awake • learn an instrument • learn a song Pick one you like !
  56. Layout

  57. Layout • https://developers.google.com/glass/develop/gdk/ui-widgets • https://developers.google.com/glass/design/style •Screen Size: 640 x 320

    •Padding: 40 x 40 •Bottom Bar: 560 x 40
  58. Layout

  59. Touch input

  60. Keypad Swipe down translates to KEYCODE_BACK. A camera button press


    translates to KEYCODE_CAMERA. Tap translates to KEYCODE_DPAD_CENTER.
  61. • SWIPE_DOWN • TWO_SWIPE_DOWN • SWIPE_LEFT • TWO_SWIPE_LEFT • SWIPE_RIGHT

    • TWO_SWIPE_RIGHT • SWIPE_UP • TWO_SWIPE_UP Gestures • TAP • TWO_TAP • THREE_TAP • LONG_PRESS • TWO_LONG_PRESS • THREE_LONG_PRESS
  62. http://www.slideshare.net/j796160836/developing-google-glass

  63. Glass 殺⼿手級應⽤用?

  64. 舒壓 。

  65. Demo

  66. Glassware上架審核重點

  67. • 05.23 收到送件 (BatteryLevel) • 05.29 語⾳音指令通過
 ( Show the

    battery level -> Check the battery ) • 06.11 改名叫 Battery checker 更新送審 送審時間表
  68. • 06.27 初步審查通過,開啟 Issue Tracker • 07.17 追加 Issue •

    07.30 修完全部的 Issue • 08.11 從MyGlass看到 Developer only • 08.26 Ready for launch • 08.29 正式 Release
  69. None
  70. Product Icon Before After Provide logo icons that are white

    on transparent
  71. 640 × 360 tile image

  72. 640 × 360 tile image Before After

  73. 640 × 360 tile image

  74. Screenshot & Context picture 2528 × 1856 640 × 360

  75. Layout Before After

  76. Layout

  77. Baseline of text

  78. Baseline of text

  79. Layout

  80. Product descriptions • A simple app that showed the current

    battery level of glass. Unlike the percentage in settings page, this app will response with voice directly. Hopes you will like it! Glassware Glass
  81. Product descriptions • 區分 Android app vs. the Glassware. •

    Use Glass trademark • Glass™ • Glass is a trademark of Google Inc.
  82. Assets Issue

  83. None
  84. None
  85. None
  86. None
  87. None
  88. 常⾒見的錯誤 • 不要將 Glass 放⼊入產品名稱的⼀一部份 GlassPresenter Presenter for Glass™

  89. None
  90. None
  91. 常⾒見的錯誤 • App功能不要照搬 • Horizontal tugging feedback • 沒有作⽤用的觸控應該發出DISALLOW的聲⾳音
 (咚咚...咚咚...

  92. Developer Settings

  93. Show layout bounds

  94. Layout screen overlay

  95. None
  96. Android Wear

  97. None
  98. None
  99. None
  100. Notification Center

  101. Glass vs Wear • ⼀一個是眼鏡 • Wifi / Bluetooth 4.0

    • 相機 • 離線語⾳音辨識 • 可獨⽴立作業 • LiveCard • ⼀一個是⼿手錶 • Bluetooth only • ⼼心跳檢測 • 震動 • ⼿手機螢幕的延伸 • Notifications
  102. Q & A

  103. 辦公室景⾊色

  104. None
  105. ஹഐක೯٫eֳ࢕ၾऊ൬٫ɧ˙ ৰəᎴ౉Վdᒔ݊ᑌᅧၣ ί࿁ٙࣛගe࿁ٙήᓃഗ࿁ٙᎴ౉Վ

  106. None
  107. None
  108. http://fb.com/groups/glassdev.taiwan Google glass developer Taiwan 不只聊 Glass 喔

  109. None
  110. 䵻ⵌ.01$0/ 7*1闍䌌Ⰵ㜥⽷ 惐晊EFS 謝謝總召 Mikimoto ⼤大⼤大