Refine mobile app’s user interface
•
6 recomendaciones•562 vistas
This slide was present at HP19 event. http://www.hpx-party.com/hpx-events/hp19-mobile-design
Recomendados
Recomendados
Más contenido relacionado
Similar a Refine mobile app’s user interface
Similar a Refine mobile app’s user interface (20)
Último
Último (20)
Refine mobile app’s user interface
- 1. Refine mobile appʼs user interface Edward Chiang 1
- 2. Refine mobile appʼs user interface Edward Chiang Polydice, Inc. Mobile Developer 2
- 3. 21 Polydice, Inc. 3
- 4. App UI 4
- 5. ... 5
- 6. App 6
- 7. 7
- 8. 8
- 9. 9
- 10. 10
- 11. 11
- 12. 11
- 13. 11
- 14. 11
- 15. Prototype 12
- 16. 13
- 17. Version 0.1 Prototype 14
- 18. 15
- 19. 15
- 20. 15
- 21. 16
- 22. 16
- 23. 16
- 24. 17
- 25. 17
- 26. 17
- 27. 18
- 28. 18
- 29. 18
- 30. 19
- 31. 19
- 32. iPhone App Web Service API 20
- 33. iPhone App Web Service 21
- 34. App UI 22
- 35. iPhone Quality Test 23
- 36. 3G 24
- 37. 3G Any where, any time! 24
- 38. 25
- 39. 25
- 40. 25
- 41. 25
- 42. 25
- 43. 25
- 44. 25
- 45. 26
- 46. 26
- 47. 26
- 48. 26
- 49. 26
- 50. 26
- 51. 26
- 52. ... 27
- 53. App UI 28
- 54. iPhone Usability test 29
- 55. User-Centered Design DNA 30
- 56. 31
- 57. You are not your user 32
- 58. 33
- 59. 34
- 60. 35
- 61. User research lite version 36
- 62. 37
- 63. 38
- 64. 39
- 65. Version 0.2 40
- 66. Version 0.2 40
- 67. Vsersion 0.5 41
- 68. Vsersion 0.5 41
- 69. Version 0.6 42
- 70. Version 0.6 42
- 71. Version 0.7 43
- 72. Version 0.7 43
- 73. Version 0.75 App 44
- 74. Version 0.75 App 44
- 75. v0.8 v0.7 v0.6 v0.5 v0.2 45
- 76. Usability Test v0.8 v0.7 v0.6 v0.5 v0.2 45
- 77. Usability Test v0.8 v0.7 v0.6 v0.5 v0.2 45
- 78. Usability Test v0.8 v0.7 v0.6 v0.5 v0.2 45
- 79. Usability Test 46
- 80. ” ” 47
- 81. App UI 48
- 82. iPhone App User Acceptance Testing 49
- 83. 50
- 84. 50
- 85. 50
- 86. 51
- 87. 51
- 88. 51
- 89. iPhone Web Service 52
- 90. 53
- 91. 53
- 92. 53
- 93. 53
- 94. 54
- 95. 54
- 96. 54
- 97. 54
- 98. 55
- 99. 55
- 100. 55
- 101. 55
- 102. 56
- 103. 56
- 104. 56
- 105. 56
- 106. 57
- 107. 57
- 108. 57
- 109. 57
- 110. 57
- 111. 58
- 112. 58
- 113. 58
- 114. 59
- 115. 59
- 116. 59
- 117. 59
- 118. March 21, 2011 Version 1.2 60
- 119. 61
- 120. 62
- 121. And one more thing... 63
- 122. 64
- 123. ... ... ... 65
- 124. 66
- 125. 67
- 126. App 68
- 127. ... We are hiring! Polydice, Inc. HPX 69
- 128. Thank you! 70
Notas del editor
- 0/20 \n大家好，我叫 Edward，我今天要跟各位分享題目是 Refine mobile app’s user interface。我覺得作為開發人員，或者設計師最難的事情是做出打動人心的應用軟體，所以我今天要在短短 20 分鐘要跟各位分享開發人員奮鬥故事。\n
- 0/20\n我在 Polydice Inc 擔任 Mobile Developer，對於 HPX 部份我從 HP12 開始參加到現在，另外我也有參加網站企劃讀書會。\n\n在三月時候，聽到今年五月將會有 Mobile Design 的主題，我相當的興奮。那時後我的專案故事還在進行當中，我就跟 Richard Tasi 說我想要可以分享我的經驗。\n
- 1/20\n那時後只有這樣想法：不管此專案未來會進行怎麼樣，也還不知道 App Store 上面下載量好不好，無論如何我一定要認真做。\n
- 1/20\n精彩內容可以分為三個不同階段，如何來改善與提升我們 App UI 的使用\n
- 1/20~2/20\n
- 2/20\n\n
- 3/20 分析市面上的 APP 有哪些功能\n可以對大家做調查\n
- 2/20\n豐富的線上最新資料可以做查詢\n
- 3/20\n從頭開始做畫面、動線、資料呈現的討論\n
- 3/20\n黑板討論建立我們 App 的 Concept\n
- 4/20\nPost it! 將我們的各個 iPhone 功能、動線排出來\n
- 4/20\nPost it! 將我們的各個 iPhone 功能、動線排出來\n
- 4/20\nPost it! 將我們的各個 iPhone 功能、動線排出來\n
- 4/20\n開始製作第一階段要交給客戶的 Prototype 畫面\n
- 5/20\n這是我的辦公桌，用 MacBookPro 製作 Prototype 是件愉快的事情。\n
- 5/20\n讓大家來瞧瞧我們第一版的設計，這也是我們第一階段 on time 交給客戶的。\n
- 5/20\n首頁、根據所在位置查詢附近的房屋，可以將資訊過濾\n
- 5/20\n首頁、根據所在位置查詢附近的房屋，可以將資訊過濾\n
- 6/20\n觀看每一個房屋資訊、如果觀看覺得不想錯過，就將它加入最愛\n
- 6/20\n觀看每一個房屋資訊、如果觀看覺得不想錯過，就將它加入最愛\n
- 6/20\n點選每一個房屋，可以進去看更多照片，一張一張的滑動瀏覽\n
- 6/20\n點選每一個房屋，可以進去看更多照片，一張一張的滑動瀏覽\n
- 6/20\n除了所在位置，我們可以跨區域查詢，根據各種查詢條件，帶出查詢的房屋列表回來。\n
- 6/20\n除了所在位置，我們可以跨區域查詢，根據各種查詢條件，帶出查詢的房屋列表回來。\n
- 6/20~7/20\n除了看房屋，我們可以透過手機了解附近的分店、點選靠近的分店，可以進一步透過各種管道接洽。\n
- 7/20\n畫面敲定後，就是讓假的頁面資料傳接 API，換上栩栩如生的真實資料\n
- 7/20\n當 API 越接越多，手機上的動線和資料呈現越來越逼真。\n
- 8/20\n當開發到一陣子，我們就開始思考著，這樣的 UI 動線是不是好的，順不順？\n
- 8/20\n我們帶著 iPhone 測試去，我們怎麼測試確保那些待在辦公室開發以為已經解決，但是還是會有特殊狀況事情我們待發現。\n
- 8/20\n我們在哪邊測？\n
- 8/20\n在這些環境下，幾乎跑了大台北，我們發現了很多不是預期中的狀況發生了。\n
- 8/20\n在這些環境下，幾乎跑了大台北，我們發現了很多不是預期中的狀況發生了。\n
- 8/20\n在這些環境下，幾乎跑了大台北，我們發現了很多不是預期中的狀況發生了。\n
- 8/20\n在這些環境下，幾乎跑了大台北，我們發現了很多不是預期中的狀況發生了。\n
- 8/20\n在這些環境下，幾乎跑了大台北，我們發現了很多不是預期中的狀況發生了。\n
- 8/20\n在這些環境下，幾乎跑了大台北，我們發現了很多不是預期中的狀況發生了。\n
- 8/20\n程式串接沒有 Bug，但是怎麼會出現這樣的資訊呢？無論如何，這是要解決的。\n
- 8/20\n程式串接沒有 Bug，但是怎麼會出現這樣的資訊呢？無論如何，這是要解決的。\n
- 8/20\n程式串接沒有 Bug，但是怎麼會出現這樣的資訊呢？無論如何，這是要解決的。\n
- 8/20\n程式串接沒有 Bug，但是怎麼會出現這樣的資訊呢？無論如何，這是要解決的。\n
- 8/20\n程式串接沒有 Bug，但是怎麼會出現這樣的資訊呢？無論如何，這是要解決的。\n
- 8/20\n程式串接沒有 Bug，但是怎麼會出現這樣的資訊呢？無論如何，這是要解決的。\n
- 9/20\n我們要探索品質，不要讓 APP 因為操作過承造成當掉跳掉，我們希望資料能夠合理正常的呈現，我們要修正這些意外中的事情。\n
- 10/20\n當我們的努力到覺得差不多，可以見人的時候，我們的改善 UI 機會二出現了！\n
- 10/20\n
- 10/20\n
- 10/20\n我要感謝 HPX 讀書會社群，這是我參加第二組時候閱讀的書，互動設計。這本書讓我學會很多這領域的知識。\n
- 11/20\n花些時間來瞭解使用者，就能降低做出不被喜愛的使用者經驗，而讓我們可以有機會做出好的成果。\n
- 11/20\n如果能越早做修正，成本會比較低之外，程式也比較好改\n
- 我們讓使用者操作我們開發中的 APP，而我開發人員則站在旁邊安靜的觀察、安靜的紀錄。尤其身為開發人員看著使用者困惑的表情、驚奇的表情，這樣更能讓自己知道，開發貼近使用者的自我要求，是如此的重要。\n
- 11/20\n這個過程我們是要反覆式的設計，做改善再做測試。\n
- 11/20\n我們用什麼方法來花些時間來瞭解使用者呢？我們希望能降低做出不被喜愛的使用者經驗，而讓我們可以有機會做出好的成果。這 Lite version 也是參加互動設計讀書會學到，當初是由 Richard 出給我們該組的作業，我將這作業帶入到 Mobile 應用。\n
- 12/20\n
- \n
- 12/20\n
- 12/20\n
- 13/20\n
- 14/20\n
- 14/20\n
- 14/20\n
- 12/20\n
- 12/20\n
- 12/20\n
- 14/20\n
- \n
- 15/20\n
- 15/20\n
- 15/20\n樣式客戶非常的在意，要能 Follow 全球既有軟體的配色、色調。這邊沒啥空間可以商量。\n
- 15/20\n樣式客戶非常的在意，要能 Follow 全球既有軟體的配色、色調。這邊沒啥空間可以商量。\n
- 15/20\n對於資料呈現是否正確，顯現出來是否足夠，該顯示顯示、該隱藏的隱藏，最了解的是客戶，也由他們跟我們回報他們所發現。\n
- 15/20\n對於資料呈現是否正確，顯現出來是否足夠，該顯示顯示、該隱藏的隱藏，最了解的是客戶，也由他們跟我們回報他們所發現。\n
- 16/20\n
- 16/20\n豐富九宮格的首頁、支援使用者登入帳號、使用者等待過程有提醒\n
- 16/20\n豐富九宮格的首頁、支援使用者登入帳號、使用者等待過程有提醒\n
- 16/20\n豐富九宮格的首頁、支援使用者登入帳號、使用者等待過程有提醒\n
- 16/20\n跨區域查詢、房屋豐富資訊列表、地圖找房屋\n
- 16/20\n跨區域查詢、房屋豐富資訊列表、地圖找房屋\n
- 16/20\n跨區域查詢、房屋豐富資訊列表、地圖找房屋\n
- 16/20\n多了達人積分功能、看地理位置、附近街景\n
- 16/20\n多了達人積分功能、看地理位置、附近街景\n
- 16/20\n多了達人積分功能、看地理位置、附近街景\n
- 16/20\n觀看房屋內部格局、照片總攬、喜歡可以分享出去，或者選擇推薦。\n
- 16/20\n觀看房屋內部格局、照片總攬、喜歡可以分享出去，或者選擇推薦。\n
- 16/20\n觀看房屋內部格局、照片總攬、喜歡可以分享出去，或者選擇推薦。\n
- 16/20\n可以找到附近分店、看哪個分店最靠近、看距離想看房屋路程大概多近多遠、可以看方位找方向。\n
- 16/20\n可以找到附近分店、看哪個分店最靠近、看距離想看房屋路程大概多近多遠、可以看方位找方向。\n
- 16/20\n可以找到附近分店、看哪個分店最靠近、看距離想看房屋路程大概多近多遠、可以看方位找方向。\n
- 16/20\n可以找到附近分店、看哪個分店最靠近、看距離想看房屋路程大概多近多遠、可以看方位找方向。\n
- 16/20\n看看達人排行榜、看看個人收藏好屋\n
- 16/20\n看看達人排行榜、看看個人收藏好屋\n
- 16/20\n看看成交行情、試算自己貸款與攤還方式、貼心功能設定\n
- 16/20\n看看成交行情、試算自己貸款與攤還方式、貼心功能設定\n
- 16/20\n看看成交行情、試算自己貸款與攤還方式、貼心功能設定\n
- 16/20\n
- 16/20\n東森新聞報導\n
- 16/20\n客戶為 iPhone app 操作影片\n
- 17/20\n最後我要跟大家分享這段歷程的使命感怎麼來！\n
- 17/20\n
- 17/20\n因為這個問題存在，所以我要用我的長才，來提供解決辦法\n
- 17/20\n
- 17/20\n
- 17/20\n
- 18/20\n
- 19/20 最後，我要謝謝 Polydice，也要謝謝 HPX 和網站企劃讀書會社群\n