Download - 走進 APP 的世界 (大專院校學生版)
ECOWORKEfficient, Economical IT Works
This document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
走進 APP 的世界蘇彥碩 Michael Su @ Ecowork Inc. com
Credit: 花のアンドロイド学園,週アスPLUS
1
ECOWORK
台上的是誰?
團隊簡介及主要服務
Credit: 蘋果君(アップルくん),花のアンドロイド学園,週アスPLUS
2
ECOWORK
2005 年成立、資本額新台幣 1200 萬、員工人數 20 人、60% 開發+20% 人機介面+20% 產品規劃
友善介面 x 行動應用 x 數位資料⇓
最佳的體驗 + 即時的溝通 + 有效率的管理
益科股份有限公司
3
ECOWORK• 行動應用品牌經營、實用工具、數位內容
• 企業內部應用企業專用的 iOS 行動應用及企業版 AppStore
• 網路服務平台大型網路服務雲端平台:Amazon AWS、Google App Engine
• Findbook書籍搜尋引擎、商情資料庫、隨身行動工具
4
ECOWORKEfficient, Economical IT Works
工作機會:goo.gl/Jh9k9iOS、Android、Web 正職或暑期實習
5
ECOWORK
行動世界的戰爭
現實的消費者市場
Credit: H.T.希小姐(H・T・シーちゃん),花のアンドロイド学園,週アスPLUS
6
ECOWORKEfficient, Economical IT Works
蘋果 vs 安桌椅?芒果和黑莓在哪呢?
7
ECOWORKEfficient, Economical IT Works
美國 2011 年 Q3 智慧手機市占率nielson.com
Credit: http://blog.nielsen.com/nielsenwire/?p=30235
8
ECOWORKEfficient, Economical IT Works
美國 2011 年 Q3 智慧手機季成長率comScore MobiLens
Credit: http://www.comscore.com/Press_Events/Press_Releases/2011/12/comScore_Reports_November_2011_U.S._Mobile_Subscriber_Market_Share
9
ECOWORKEfficient, Economical IT Works
資訊的世界變動很快~AAPL 近 10 年的股價Credit: http://www.google.com/finance?q=NASDAQ%3AAAPL
10
ECOWORKEfficient, Economical IT Works
The IT World never Sleeps而且變動非常快速
Credit: Mauna Loa Volcano,冒納羅亞火山,夏威宜11
ECOWORK
我們參與過的戰役
Ecowork 做過的應用
Credit: 三.星小姐(サム・スンちゃん),花のアンドロイド学園,週アスPLUS
12
ECOWORKEfficient, Economical IT Works
品牌經營對於品牌的服務、形象、工具等需求~
Credit: http://tw.123rf.com/photo_7371465_brand-word-collage-on-black-background-vector-illustration.html
13
ECOWORK
統⼀一超商7-ELEVEN + 卡路里日記簿
7-ELEVEN品牌形象及行銷應用2010Q4 上線、免費軟體Mango 版本今年第⼀一季上線行銷整合、地圖簽到、條碼整合
卡路里日記簿
輕食類商品行銷應用2011Q2 上線、免費軟體行銷整合、雲端平台、條碼整合
配合每年度各類活動、輕食類商品及各行銷伙伴的行銷計畫,提供共同整合行銷的行動應用平台
2012 Q1
14
ECOWORK
玉山銀行GoodCalendar + 網路銀行
GoodCalendar 好讚行事曆實用工具、品牌形象、客戶服務行事曆整合、影音記錄、行銷整合2011Q3 上線、免費軟體由玉山銀行自行發行Android 版將於今年上線
網路銀行
Android 版將於今年上線
配合主要市場的社會文化提供實用的工具,除了提升品牌形象外,也可以提供更多的服務給自己的客戶
20122012
15
ECOWORKEfficient, Economical IT Works
行動購物可以在手機上面直接下單購物~
Credit: http://jewel-staite.net/online-shopping-carts-%E2%80%93-preventing-customer-frustration-online.html
16
ECOWORK
博客來博客來快找
博客來快找
條碼掃描、購物車、資料整合2011Q4 v2.00 版上線、免費軟體由博客來自行發行
2.00 版由 Ecowork 重新改寫,整合⼀一維條碼的掃描功能、全域購物車,並和博客來的資料庫整合,提供使用者購物清單、線上直接購買的功能
17
ECOWORK
翻書客 FindbookFindbook Scanner 隨身書籍搜尋比價
Findbook Scanner益科 Findbook 翻書客書籍搜尋服務 雲端搜尋引擎、條碼整合2010Q3 iOS、2011Q3 Android 上線
使用者可以透過手機直接掃瞄書籍背後的商品條碼,即可馬上搜尋該本書籍的相關商品銷售情報、圖書館借閱情報,亦可直接連線進行線上購買
18
ECOWORKEfficient, Economical IT Works
企業應用企業內部應用行動化,讓員工在外也可以處理公事~
Credit: http://flickr.com/photos/wysz/167342533/
19
ECOWORK
永慶房屋 FindbookFindbook Scanner 隨身書籍搜尋比價
企業應用商店
待售物件地圖
常用試算工具
群組行事曆
文件管理
客戶關係管理
利用 iPad 高度安全性,讓外務型員工可以隨時隨地與公司連結,有效率的處理公事
20
ECOWORKEfficient, Economical IT Works
數位內容除了單純的電子數、影片外的使用方式~
Credit: http://olesturm.com/media-wall/
21
ECOWORK
公共電視Natural Formosa 福爾摩沙的指環
高畫質影音
使用者可以透過 iPad 欣賞高畫質的影片、照片、多國語言的旁白,也可以自己擔任製片,剪接重組不同的內容變成新的⼀一段內容
22
ECOWORK
城邦 貓頭鷹出版社自然科學圖鑑集(鳥類、昆蟲、寶石)
科學圖鑑的數位化
應用
重製現有的數位化內容,鳥類圖鑑提供本地端搜尋引擎功能,可模糊搜尋 , 共 包 含 了1000+隻不同的鳥種;昆蟲及寶石圖鑑引用了標本收藏盒的概念,讓使用者可以延伸現實生活中的體驗,也使用姿態感測器提供陰影的效果
23
ECOWORK
有個好點子然後?
行動應用的原點、起步
Credit: 摩特.蘿拉小姐(モト・ローラちゃん),花のアンドロイド学園,週アスPLUS
24
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
需求是什麼?行動裝置可以做到的事...
Credit: http://www.wantchinatimes.com/news-subclass-cnt.aspx?cid=1303&MainCatID=13&id=20110113000113
25
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
技術不是重點!除非是專業的技術性需求 ...
Credit: http://blog.oxagile.com/2010/05/21/android-has-defeated-apple-in-the-fight-for-the-u-s-market/
26
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
注意「需求」和「解法」...
Credit: http://newkingdomsayshi.com/2008/12/28/go-broke-with-a-cassette-ipod/
27
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
可以「隨時中斷」、「不花力氣」...
Credit: http://www.londoncyclist.co.uk/cycling-accessories/iphone-bike-mount/
28
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
減少「認知負擔」、「嘗試時間」...
Credit: http://www.flickr.com/photos/40852554@N00/472111992
29
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
設計並實地體驗「使用者情境」
Credit: https://squareup.com/
30
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
畫出幾個「心裡想看的介面」
Credit: http://www.outsightinteractive.com/blog/outsights_award_winning_phizzpop_design_process
31
ECOWORK
特別的材料
行動裝置上好用的功能
Credit: 索妮.愛理小姐(ソニ・エリちゃん),花のアンドロイド学園,週アスPLUS
32
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
位置 GeoLocation、GeoFence
33
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
體感 陀螺儀、電子羅盤、加速規
34
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
聲音 產生、發出、接收、記錄聲音
35
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
影像 拍照、攝影、即時處理
36
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
網路 資料連結、推播通知
37
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
觸控 多點觸控、多到同時追蹤 11 隻指頭
Credit: http://www.outsightinteractive.com/blog/outsights_award_winning_phizzpop_design_process
38
ECOWORK
全新的觸感不同的介面
觸控的介面超難設計
Credit: 艾爾.G小姐(エル・Gちゃん),花のアンドロイド学園,週アスPLUS
39
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
有好好設計嗎?
40
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
螢幕尺寸和人之間的關係
★ 和使用者互動的介面• Home Button
• 螢幕★ 手指頭點擊螢幕• 最適合的大小是 44pt x 44pt
• 大約是 6.86mm x 6.86mm
Portrait Landscape
iPad *
iPhone 4
Others
768x1024 1024x768
640x960 960x640
320x480 480x320
41
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
單點觸控手勢
★ Touch
★ Tap
★ Swipe/Flickr
★ Drag
42
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
多點觸控手勢
★ Scroll
★ Zoom/Pinch
★ Rotate
★ Special
43
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
是這樣嗎?
http://www.codinghorror.com/blog/2006/02/sometimes-a-word-is-worth-a-thousand-icons.html
44
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
Keynote on Mac OS X
45
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
Keynote on iPad ?
46
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
「操作」而不是「控制」...
http://www.wired.com/gadgetlab/2008/12/microsoft-surfa/
47
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
基本原則:⼀一致性★ ⼀一致性• 與內建 App ⼀一致的操作流程• 同⼀一個 App 內保持⼀一致• 改版前後保持⼀一致
★ 直接操作• 可以用 Pinch 就不要用 Button
• 可以用 Rotate 就不要用 Button
• 99% 會使用常用選項就不要提供自訂參數
48
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
基本原則:Metaphor 隱喻
★ 與真實物品結合• 行事曆• 記事本• 郵件
★ 與生活經驗連結• Switch
• Picker
• 照片翻頁
49
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
Keynote for iPad!
50
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
將畫面拆解開
http://inspirationfeed.com/2011/02/25-examples-of-wireframes-and-mockups-sketches/
51
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
拆開成不同的卡片
52
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
在不同的步驟間調整
53
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
方便的工具
54
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
可以實體模擬的方法
55
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
確定的基本流程後,再開始繪製成電子稿
56
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
各作業系統都有做好可以直接用的元件
57
ECOWORK
你可以伴演哪些角色
分工職掌
Credit: 夏普小姐(シャープちゃん),花のアンドロイド学園,週アスPLUS
58
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
真的要細分的話...
• 操作概念:每⼀一個人都要有• 介面設計:平面、廣告、工設、心理• 前端程式:動畫、操作、操作流程• 後端程式:資料庫、主機、API
• 進度控管:時間還是很重要的!• 非直接的工作:影片、聲音、法務、財務
59
ECOWORK
法律和隱私
台灣團隊最常遇到也常常無法理解的部份
Credit: 富士通(Tohru)小姐(富士 通(とおる)ちゃん),花のアンドロイド学園,週アスPLUS
60
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
你有可能被下架的原因...
• 未加密傳送使用者的隱私資料• 位置、電話、聯絡人、朋友
• 未告知使用者就取用任何隱私資料• 簡訊、使用記錄、位置通通都包括
• 直接使用其它大廠的品牌、名稱、圖檔等• 侵權了!後果可能會很大• 或是該放而沒有放上去
• 辦抽獎或贈品活動沒有加上 Apple 的免責條款
61
ECOWORK
後記
雜七雜八
Credit: 樫尾N子(樫尾エヌ子ちゃん, NEC Casio Mobile),花のアンドロイド学園,週アスPLUS
62
ECOWORK
iOS 專案建議流程(前段)
訪談 提案建議 規格會議 規格書報價單合約
簽約 Kick-Off
New Idea
調整修正 調整修正
1~6 weeks
63
ECOWORK
iOS 專案建議流程(後段)
Kick-Off
開發
0.9 Beta 測試
AppStore 審核通過
1.0 Release 測試
開發
正式上市4~7 weeks 2~3 weeks
1~2 weeks
AppStore 審核通過
1~2 weeks
64
ECOWORKThis document is confidential and is intended solely for the use and information of the membership to whom it is addressed.
各類應用運作方式評估參考行動網站應用 手機原生程式
安裝方式
顯示操作反應
支援功能
程式語言
總合評估
適用情境
簡易只需打開瀏覽器,並連線到特定網址
過程較長開啟網頁或特定的手機程式下載並安裝
較慢需透過網頁瀏覽器執行 Javascript,速度會因被 JS Engine 拖慢
較快使用各手機作業系統的原生應用程式語言撰寫,可以直接連結顯示及操作功能
較少僅限於 HTML5 及 JS Engine 可以 支援的功能,無法存區如像機等特殊功能
完整可以存取所有手機作業系統開放的功能
Javascript、HTML5、CSS3 iOS 為 Objective C、Android 為 Java
開發門檻低、需在多種的硬體上面測試;操作體驗較差、大都需要連線才能使用、安
全性較低開發門檻稍高、應用佈署較花資源;操作反應快、離線亦可使用、安全性較佳
適合有穩定連線、既有網站系統 適合不穩定行動網路、高安全性、快速操作反應、需要連結相機等特殊功能的應用
65
線上瀏覽本文件:http://www.slideshare.net/ecowork/
Ecowork 工作機會:goo.gl/Jh9k9iOS、Android、Web 正職或暑期實習
66