WWDC 2014 上，Apple的原型設計團隊分享了公司内部的一套App開發流程。在完成App之前不斷的進行原型疊代，這個過程中，原始的idea逐漸變的更加具體真實，最終達到滿意的使用者體驗和達到預期的目的。本文包含了兩部分，前半部分介紹Apple的工作流，并且加上了部分個人了解；後半部分是Apple用一個虛拟的項目展示了如何快速完成一個三輪疊代。
開始一個App ？
說起做一個App，通常簡單的想法是，我有一個很cool的idea，按照這個想法做成App，接下來的要關心的事情就是數錢了：）
然而實際情況往往并非如此。在完成一個App的過程中，對于團隊,可能會遇到資金不足，時間不夠，人員流動，協作成本等種種問題；對于獨立開發者也可能會有項目進度、自律等問題。最終成功的都是少數，結果一般是悲劇的:(
在我經曆的幾個項目中，成功的經曆總是相似，失敗則各不相同。獨立開發過程中，影響因子大多集中到開發者本身，開發者自身的時間管理、架構設計、産品觀，設計技能以及coding能力都會成為關鍵。目前由于Sketch、雲服務等工具的普及，獨立開發者可能存在的一些短闆得到了一定的補充，是以App的成功率也在不斷提高。這裡成功的定義是開發者在預期的時間内完成了符合要求的産品。
團隊開發中，衆多影響項目的因素分布在每一個人身上。我的體會是，團隊開發App成功，要麼團隊有一個獨裁式的核心人物，他能保證一切正常的運轉，要麼團隊由少數自我推動能力較強的人構成。第二種情況中，團隊成員更容易感受到做一件事情的激情，例如 WI輸入法 團隊在開發Android一個版本時，三個核心開發者都處在忙碌的大三學期，但最終保證了在一個學期左右的時間，快速的完成beta版本。又經曆了四個月的疊代，以一個成熟的App釋出到市場上并獲得50萬使用者。我們在疊代中的做法是不斷通過郵件發給内測使用者beta版本并抄送給一些熱心關注的學校老師，聽取回報，持續改進。
Apple的做法就是：一個App的誕生都是從idea 經過不斷的原型疊代，逐漸的去接近其目标的體驗，變得更加具體真實，最後成為真實的産品給使用者。
為什麼進行原型疊代？
驗證産品
原型可以快速的去驗證你是否在做正确的事情，及時發現問題可以大大節省時間和金錢。有時候，産品一口氣做到底，才發覺功能和體驗與最初的目标已經大相徑庭了。比如有人會提出這個很炫，那個很好玩，而忽略了産品最本質的東西。微信就不會因為各種生活服務而忽略其核心的溝通功能，“消息”和“通訊錄” 永遠在最直接的位置。
激發想法
在疊代的過程中，可能會想到更好的體驗。一個App在設計稿上，在裝置上，在使用者手裡都會有不同的體驗。原型疊代可以讓産品的體驗盡可能保持一緻，而不緻于出現想法和實踐上的不統一。
如何進行原型疊代？
在每一輪疊代中，要做三件事情
- 制作原型
- 把App給别人看
- 從回報中總結經驗
制作原型
哪些部分需要更加真實具體一些？
兩個使用者界面，在最初的原型裡可能隻是陳列起來，從頁面A到B是經過怎樣的轉換，這個功能指引并沒有在原型中展現出來，這裡就是需要更加具體真實的。
我們可以去模拟哪些部分？
可以模拟一些icon，和清單内容。UGC的産品可以模拟已經存在的内容。
使用者在什麼場景下使用？
這是非常關鍵的一個問題，好的設計應該是考慮到使用場景的。例如一款經常在戶外使用的App,就要考慮其視覺上是否可用，或者更明确的讓使用者看到其要使用的功能。我覺得App應該是向場景化靠近的，如何在特定的環境下讓使用者以最短路徑達到目的是在完成App是必須要考慮的問題。
不僅互動應該尊崇場景化，功能設計也應該考慮場景。百度地圖在查詢公交線路的時候，會考慮由于班車線路時間導緻的錯過班車的問題，同類産品卻忽略了這個關鍵的場景因素。
生活場景網際網路化，有三個階段：首先網際網路可以 承載 生活中的資訊，地圖App将班車線路從生活轉向網際網路，其次網際網路可以 加工 生活中的資訊，地圖App又能根據你的出發和到達計算線路。最後，網際網路可以 延伸 生活的資訊，即根據的你的線路可能會推斷出你的出行意圖，進而提供一下階段的服務，形成閉環。忽略場景的App在這條線路上可能是不完整的，也可能是惡性的循環，考慮那些毫無相關性打擾使用者的push消息。
給使用者展示
你的使用者是誰？
明确目标使用者很關鍵，從非目标使用者身上，甚至有可能受到錯誤的回報。
你知道怎麼使用XX功能嗎?
這裡要驗證App的核心功能是不是能夠容易的被使用者感覺和使用。
XX功能是不是用起來很簡單？
在滿足可用性的基礎上，要考慮功能的易用性。
我們怎麼能使這個功能更好？
傾聽回報，向使用者請教，不要辯駁或者否認。
最後，總結回報的時候，我們要思考：
- 哪些是正确的？
- 哪些是錯誤的？
- 我們還獲得了哪些idea？
一個例子
Apple展示了一個快速的三輪疊代的過程，它們的原型從最初簡單的圖檔展示，到簡單動畫效果，最後到了互動展示。這也是一個App從最初的概念界面，逐漸具體化，最後到動态互動的一個過程。他們通過Keynote完成靜态界面和動畫的制作，使用Objective-C 來編寫簡單的程式實作基本的互動示範。
第一階段Pictures
在最初的階段, 你可能想到自己的App有幾種布局，大概有list view, grid view, 或者gallery view 幾種。這些基本的頁面布局在iOS内置應用中已已經有現成的應用了，例如下面的list view就是通過iOS内置音樂應用截屏的。在開始之前，你需要在Document設定中将slide size設定為 640 * 1136， 和iPhone的螢幕适配。
使用Shape工具可以繪制矢量圖形，覆寫原有的界面元素。
導入的圖檔可以使用圖檔的Mask功能，例如将一個面包圖檔顯示成一個圓盤的形狀，完成界面元素的自定義、
使用特殊符号功能添加頁面基礎元素，将星星設定為金黃色。這樣以iOS内置音樂應用為布局基礎的美食清單頁面就完成了。
同樣的方式，還完成了grid view, map view 和gallery view，他們分别使用了iOS内置的相冊，地圖和天氣App.
第二階段 Animations
使用者可能會好奇尋找top toast 和 nearby toast的關系，此時原型中需要添加轉場動畫，兩個界面是怎樣轉換的呢？ Keynote中的動畫包括兩種
- Build 在一張slide之内的動畫
- Transition 不同之間切換的動畫
其中Transition中有一種非常給力的動畫叫做Magic Move, 它可以使同一進制素在不同的slide之間進行動畫轉換，形成很炫酷的效果。利用這一特性可以做出不同的動畫，例如，一個圓盤圖示在slide1 和slide2中分别處于不同的位置，進行Magic move的時候，就會出現圓盤的跨slide平移效果。如果位置相同，slide1 和slide2中圓盤的大小角度不同，就可以出現旋轉或者放大的效果。了解Magic move的基本工作方式後，做出不同的效果靠自己發揮了。
第三階段 Interaction
在有了頁面之間的動畫轉換後，我們可能得到更多的回報，比如nearby toast 和 top toast 的界面可以合并為一個頁面。原型中應該增加互動，讓App更加真實。
Apple使用了Xcode進行了簡單的互動制作，這些互動隻是看起來在工作，例如地圖的移動隻是一張圖檔在拖拽，輸入文本隻是在連續的切換十幾張圖檔。
例如下面的界面實際上是一張圖檔拆成了三個部分，一個導航欄，一個地圖，一個清單。
為layer編寫簡單的onTouchMove事件，模拟在一張地圖上拖拽浏覽的操作。