說(shuō)到設(shè)計(jì)規(guī)范毯辅，這可能是很多設(shè)計(jì)師會(huì)忽略的一個(gè)東西埂伦，或者就算注意到了，也并沒(méi)有引起足夠的重視思恐，今天咱們就來(lái)講講沾谜，為什么設(shè)計(jì)規(guī)范甚至是平臺(tái)規(guī)范對(duì)我們來(lái)說(shuō)很重要？
你覺(jué)得蘋(píng)果胀莹、谷歌基跑、微軟的設(shè)計(jì)團(tuán)隊(duì)怎么樣？或者你有什么向往的設(shè)計(jì)公司或團(tuán)隊(duì)呢描焰？
可以想見(jiàn)媳否，這些團(tuán)隊(duì)的設(shè)計(jì)師都是精挑細(xì)選出來(lái)的人才，他們都有各自的擅長(zhǎng)的領(lǐng)域，這些精英們一起設(shè)計(jì)出來(lái)的軟件系統(tǒng)當(dāng)然就是他們集體的智慧結(jié)晶逆日。同時(shí)嵌巷，既然是團(tuán)隊(duì)合作，那一定會(huì)有配合的問(wèn)題室抽，他們是怎么保證團(tuán)隊(duì)內(nèi)部不同的設(shè)計(jì)師做出來(lái)的東西能夠有統(tǒng)一的風(fēng)格和交互方式呢搪哪？一個(gè) iOS系統(tǒng)，里面除了系統(tǒng)層的設(shè)計(jì)坪圾，還包括各種內(nèi)置軟件的設(shè)計(jì)晓折，以及讓第三方團(tuán)隊(duì)設(shè)計(jì)的軟件，他們又是怎么做到看起來(lái)就像是同一個(gè)人做的呢兽泄？
他們一定有統(tǒng)一的規(guī)范漓概，用來(lái)讓所有人對(duì)于這個(gè)產(chǎn)品、這個(gè)平臺(tái)有同樣的認(rèn)識(shí)和理解病梢，才有可能做到這一點(diǎn)胃珍。
這就是平臺(tái)規(guī)范的意義。
我之所以用「平臺(tái)規(guī)范」而不是「設(shè)計(jì)規(guī)范」蜓陌，就是想讓大家意識(shí)到觅彰，規(guī)范這東西其實(shí)不只是給設(shè)計(jì)師看的，還會(huì)包含給開(kāi)發(fā)人員看的部分钮热，甚至于所有接觸到這個(gè)產(chǎn)品的設(shè)計(jì)開(kāi)發(fā)過(guò)程的人都應(yīng)該了解填抬，所以用「平臺(tái)規(guī)范」會(huì)更為貼切一些。
當(dāng)然隧期，有些產(chǎn)品只對(duì)外公開(kāi)了設(shè)計(jì)規(guī)范飒责，或者本身還不是一個(gè)平臺(tái)性的產(chǎn)品，我們?cè)O(shè)計(jì)師也可以先關(guān)注他們的設(shè)計(jì)規(guī)范仆潮，從那里也能學(xué)到很多東西宏蛉。
是的，其實(shí)規(guī)范這東西最大的意義不只是用來(lái)讓你遵守的鸵闪，作為設(shè)計(jì)師檐晕，那些精英團(tuán)隊(duì)所寫(xiě)出的規(guī)范，完全可以作為你學(xué)習(xí)的對(duì)象蚌讼，里面包含著他們對(duì)自己產(chǎn)品和平臺(tái)的思考辟灰，以及對(duì)自己設(shè)計(jì)理念的總結(jié)。
且不說(shuō)篡石，我們要在這些平臺(tái)上做設(shè)計(jì)的時(shí)候需要遵循他們的規(guī)范芥喇，換個(gè)角度想，我們既然向往這些設(shè)計(jì)團(tuán)隊(duì)凰萨，那為什么不從這些規(guī)范開(kāi)始學(xué)習(xí)呢继控？
按慣例械馆，先更新技能樹(shù)：
我們看平臺(tái)規(guī)范的時(shí)候，可以從這四個(gè)方面入手：
原則（Principle） ：產(chǎn)品整體的設(shè)計(jì)原則武通，和其他產(chǎn)品在理念上的區(qū)別霹崎；
架構(gòu)（Architecture） ：規(guī)范的架構(gòu)設(shè)計(jì)，可以了解它的產(chǎn)品全貌冶忱；
說(shuō)明（Instruction） ：每個(gè)控件的使用規(guī)范尾菇，開(kāi)發(fā)可用的 API 接口；
動(dòng)效（Motion） ：他們是怎么做動(dòng)效的囚枪，這些動(dòng)效是怎么配合設(shè)計(jì)原則的派诬。
一、原則
我們做任何一款產(chǎn)品的設(shè)計(jì)链沼，首先要知道的就是默赂，自己這款產(chǎn)品是在哪個(gè)平臺(tái)上的？如果會(huì)同時(shí)上線(xiàn)多個(gè)平臺(tái)括勺，那每個(gè)平臺(tái)之間的區(qū)別是什么缆八？做的時(shí)候分別要注意什么地方？
常見(jiàn)的平臺(tái)有：
桌面端：Windows朝刊、Mac OS耀里；
移動(dòng)端：iOS蜈缤、Android拾氓；
網(wǎng)頁(yè)端：桌面Web、移動(dòng)Web底哥、H5咙鞍、小程序；
可穿戴設(shè)備：手表趾徽、VR续滋、AR等；
其他：比如電視孵奶、車(chē)載導(dǎo)航疲酌、智能家電的屏幕等。
這些是對(duì)外的大平臺(tái)了袁，往小了看朗恳，如果我們?cè)O(shè)計(jì)的是一個(gè)微信上、支付寶上的功能载绿，或者是改進(jìn)騰訊電腦管家上的一個(gè)功能粥诫，這時(shí)都可以把微信、支付寶崭庸、電腦管家或者自家的產(chǎn)品當(dāng)成是一個(gè)小平臺(tái)怀浆，我們應(yīng)該基于之前產(chǎn)品的原則和規(guī)范來(lái)做設(shè)計(jì)谊囚。
由于各個(gè)平臺(tái)之間存在著差異性，它們會(huì)著重告知自己的特殊原則执赡，比如 iOS10 就強(qiáng)調(diào)這三點(diǎn)：
清晰（Clarity）：縱觀整個(gè)系統(tǒng)镰踏，任何尺寸的文字都清晰易讀，圖標(biāo)精確易懂沙合，恰當(dāng)且微妙的修飾余境，聚焦于功能，一切設(shè)計(jì)由功能而驅(qū)動(dòng)灌诅。留白芳来、顏色、字體猜拾、圖形以及其它界面元素能夠巧妙地突出重點(diǎn)內(nèi)容并且表達(dá)可交互性即舌；
遵從（Deference）：流暢的動(dòng)效和清爽美觀的界面有助于用戶(hù)理解內(nèi)容并與之交互，而不會(huì)干擾用戶(hù)挎袜。當(dāng)前內(nèi)容占據(jù)整屏?xí)r顽聂，半透明和模糊處理能夠暗示其它更多的內(nèi)容。減少使用邊框盯仪、漸變和陰影讓界面盡可能地輕量化紊搪，從而突出內(nèi)容；
深度（Depth）：清楚的視覺(jué)層和生動(dòng)的動(dòng)效表達(dá)了層次結(jié)構(gòu)全景，賦予了活力耀石，并有助于理解。易于發(fā)現(xiàn)的且可觸發(fā)的界面元素能提升體驗(yàn)愉悅感爸黄，讓用戶(hù)在成功觸發(fā)相應(yīng)功能或者獲得更多內(nèi)容的同時(shí)還能掌控當(dāng)前位置的來(lái)龍去脈滞伟。當(dāng)用戶(hù)瀏覽內(nèi)容時(shí)，流暢的過(guò)渡提供一種縱深感炕贵。
從這三點(diǎn)可以明顯看出 iOS10 的設(shè)計(jì)特點(diǎn)梆奈，它圍繞著自己的高清屏幕、毛玻璃效果以及扁平化的設(shè)計(jì)風(fēng)格称开，制訂了核心設(shè)計(jì)原則亩钟。
你不妨對(duì)照這三條原則辛掠，再去看手機(jī)里的操作系統(tǒng)宣决，你能發(fā)現(xiàn)蘋(píng)果的設(shè)計(jì)師們是如何嚴(yán)格遵守這些原則胀葱，從而設(shè)計(jì)出獨(dú)具特色的界面交互的耸三。
iOS10 還有一些通用的設(shè)計(jì)原則墙牌，我們同樣能用在自己的產(chǎn)品設(shè)計(jì)中：
美學(xué)完整性：視覺(jué)表象羡蛾、交互行為與其功能整合的優(yōu)良程度俊柔；
一致性：內(nèi)部一致的標(biāo)準(zhǔn)和規(guī)范有助于塑造統(tǒng)一的用戶(hù)模式狭归；
直接操作：用戶(hù)直接操作對(duì)象（而不是通過(guò)控件）能夠提升用戶(hù)的參與度并有助于理解睛蛛；
反饋：用戶(hù)的每個(gè)交互行為都需要有對(duì)應(yīng)的反饋鹦马，如果有進(jìn)度的話(huà)要有明確的提示胧谈，還可以適當(dāng)加入動(dòng)效和聲音；
隱喻：當(dāng)界面的視覺(jué)表象和操作行為與用戶(hù)熟悉的日常體驗(yàn)相似時(shí)荸频，用戶(hù)就能更快速地學(xué)會(huì)這款應(yīng)用菱肖；
用戶(hù)控制：應(yīng)用可以對(duì)用戶(hù)行為做出智能提醒和建議，但不應(yīng)該替用戶(hù)做決定旭从。
如果你在做設(shè)計(jì)的過(guò)程中稳强，真的理解透 iOS 給出的這些設(shè)計(jì)原則，并且用這些原則來(lái)檢驗(yàn)自己的產(chǎn)品和悦，你做出的東西就不會(huì)太差退疫。因此在你真正有足夠的設(shè)計(jì)經(jīng)驗(yàn)和領(lǐng)悟之前，完全沒(méi)必要重新發(fā)明輪子——真的沒(méi)那么多新原則鸽素。
二褒繁、架構(gòu)
除了看規(guī)范的內(nèi)容之外，其實(shí)每一個(gè)規(guī)范文檔的結(jié)構(gòu)也有很多值得我們學(xué)習(xí)的地方馍忽。
1. Windows 平臺(tái)設(shè)計(jì)規(guī)范
如果你要做一個(gè)完整的軟件系統(tǒng)棒坏，比如騰訊電腦管家，那要怎么開(kāi)始設(shè)計(jì)遭笋，要考慮哪些內(nèi)容坝冕？既然這些都是桌面端的應(yīng)用，那不妨參考下微軟的 Windows 設(shè)計(jì)規(guī)范瓦呼。2
可以看出喂窟，設(shè)計(jì)這類(lèi)軟件，布局吵血、樣式和控件是重點(diǎn)要考慮的三塊內(nèi)容谎替，甚至在樣式那里還要細(xì)化設(shè)計(jì)到每一種控件，有了這個(gè)目錄在蹋辅，我們?cè)谠O(shè)計(jì)的完整性上面就得以保證了。
當(dāng)然挫掏，未必是全部都要重新設(shè)計(jì)侦另，這需要考慮到我們的設(shè)計(jì)成本，你完全可以只挑選其中的一部分進(jìn)行設(shè)計(jì)尉共，有些部分不需要或者用得極少的話(huà)褒傅，你可以直接用 Windows 的或者 Web 默認(rèn)樣式，但是提前了解全局和默認(rèn)樣式總是有好處的袄友。
2. 騰訊文檔品牌設(shè)定
如果你需要做一套新的品牌設(shè)計(jì)殿托，那不妨參考下最近騰訊文檔做的品牌設(shè)定說(shuō)明。3
騰訊文檔雖然只是一個(gè)新品牌剧蚣，但這是騰訊ISUX團(tuán)隊(duì)親自操刀做的品牌設(shè)計(jì)支竹，整個(gè)設(shè)計(jì)流程和內(nèi)容方面還是很值得我們借鑒的旋廷。他們?cè)O(shè)定品牌目標(biāo)、提取關(guān)鍵詞的過(guò)程礼搁，具體落地時(shí)的樣式規(guī)范饶碘，這些都可以作為品牌設(shè)計(jì)的范本來(lái)參考。
怎么樣馒吴？這么看來(lái)扎运，無(wú)論你想做什么類(lèi)型的設(shè)計(jì)，是不是都有可以借鑒的目標(biāo)了饮戳？
有一點(diǎn)值得提醒的是豪治，這些平臺(tái)規(guī)范往往都是以網(wǎng)站的形式作為呈現(xiàn)，內(nèi)容還特別多扯罐，而且有些還是英文版的鬼吵，所以大多數(shù)人容易望而卻步。我推薦大家在看的時(shí)候最好根據(jù)自己的情況篮赢，先選定 iOS齿椅、Android 或者微軟三者之一作為目標(biāo)，邊看邊寫(xiě)筆記启泣，看完一家涣脚，消化后再看其他的，這樣效果會(huì)更好一些寥茫。
但是這三家的設(shè)計(jì)規(guī)范更新得也很快遣蚀，比如上面說(shuō)的是 iOS10 的中文版規(guī)范，但其實(shí)官網(wǎng)上早就更新到 iOS11 了纱耻，而以前Windows有一版全中文的規(guī)范特別詳細(xì)有用芭梯，現(xiàn)在也更新成英文的 UWP 版本的規(guī)范了。所以要學(xué)習(xí)的話(huà)千萬(wàn)要趁早弄喘，多存檔（保存PDF玖喘、書(shū)簽），不要等到找不到了才追悔莫及蘑志。
參考資料：
《譯文 | iOS 10 人機(jī)界面設(shè)計(jì)指南 （一）》
《Introduction to UWP app design》
三累奈、說(shuō)明
如今蘋(píng)果為它的多個(gè)平臺(tái)都撰寫(xiě)了詳細(xì)的人機(jī)交互規(guī)范，包含桌面系統(tǒng)（macOS）急但、移動(dòng)系統(tǒng)（iOS）澎媒、可穿戴系統(tǒng)（watchOS），還有電視（tvOS）和車(chē)載系統(tǒng)（CarPlay）波桩，這里簡(jiǎn)直是一個(gè)平臺(tái)交互說(shuō)明的百科全書(shū)戒努。你想做任何一個(gè)類(lèi)型的平臺(tái)的設(shè)計(jì)，都可以過(guò)來(lái)參考他們制訂的交互規(guī)范镐躲，可以學(xué)到不少好東西储玫。
再次強(qiáng)調(diào)侍筛，你要學(xué)的是他們寫(xiě)的、對(duì)應(yīng)平臺(tái)的交互知識(shí)缘缚，就算你做的是 Windows勾笆、Android 這些平臺(tái)上的設(shè)計(jì)，一樣能學(xué)到很多好東西桥滨，別被思維框架限制了窝爪。
舉個(gè)例子，比如 iOS10 的人機(jī)交互規(guī)范中齐媒，它對(duì)于如何設(shè)計(jì)數(shù)據(jù)輸入界面的說(shuō)明蒲每，就是一個(gè)很好的學(xué)習(xí)范本。
示例：數(shù)據(jù)輸入（Data Entry）
無(wú)論是點(diǎn)擊界面元素還是使用鍵盤(pán)喻括，信息輸入都是一個(gè)冗長(zhǎng)的流程邀杏。當(dāng)一個(gè)應(yīng)用在做一些有用的事情前要求用戶(hù)一連串的輸入，進(jìn)而拖慢了流程唬血，那么用戶(hù)會(huì)很快感到失望望蜡，甚至?xí)氐椎貟仐夁@個(gè)應(yīng)用。（ST注：先從用戶(hù)使用的角度說(shuō)明為什么重視這里的設(shè)計(jì)拷恨，暗示我們這里要做到高效和簡(jiǎn)單）
△ ST注：然后給出相關(guān)的設(shè)計(jì)原則脖律，每一點(diǎn)都是干貨
1. 可能時(shí)展示選項(xiàng)
盡可能地提高信息輸入的效率。比如腕侄，考慮使用選擇器或是列表來(lái)替代輸入欄小泉，因?yàn)閺囊涣刑崆霸O(shè)定好的選項(xiàng)中選擇一個(gè)比打字容易。
2. 可能時(shí)從系統(tǒng)中獲取信息
不要強(qiáng)迫用戶(hù)提供那些可以自動(dòng)或是在用戶(hù)許可內(nèi)就能獲取的信息冕杠，比如聯(lián)系人或是日歷信息微姊。
3. 提供可靠的默認(rèn)值
盡可能地預(yù)填最可能的信息值。提供一個(gè)可靠的默認(rèn)值縮短了做決定的時(shí)間從而加快了流程分预。
4. 只有在收集完必需信息之后才能進(jìn)行下一步
在允許「下一步」或「繼續(xù)」按鈕前兢交，確保所有必要的輸入框都有信息。盡可能地在用戶(hù)輸入之后就立馬檢查輸入值噪舀，這樣他們就能立即改正魁淳。
5. 只要求必要的信息
只有系統(tǒng)運(yùn)行真正必需的信息才使用必填欄。
6. 簡(jiǎn)化值列表的導(dǎo)航
尤其是在列表和選擇器中与倡，必須能夠簡(jiǎn)單地選擇值±ジ澹考慮通過(guò)將值列表按首字母排序或是其它邏輯排列纺座，從而加快瀏覽和選擇的速度。
7. 在輸入欄顯示提示以輔助說(shuō)明
當(dāng)輸入欄沒(méi)有其它文字時(shí)溉潭，可以包含占位符文字——比如「郵件」或「密碼」净响。當(dāng)占位符文字已經(jīng)足夠說(shuō)明時(shí)不要再單獨(dú)使用標(biāo)簽來(lái)描述少欺。
無(wú)論你有沒(méi)有設(shè)計(jì)過(guò)這類(lèi)控件，他們提供的這些原則都是很好的參考馋贤，如果你正愁沒(méi)人對(duì)你做一個(gè)系統(tǒng)性的指導(dǎo)赞别，那這套規(guī)范簡(jiǎn)直就是一套教科書(shū)級(jí)別的干貨有沒(méi)有？而且還是蘋(píng)果設(shè)計(jì)團(tuán)隊(duì)提供的配乓、免費(fèi)的仿滔。
四、動(dòng)效
平臺(tái)規(guī)范中不僅包含了交互說(shuō)明犹芹，我們還能從中學(xué)到很多做動(dòng)效的知識(shí)崎页，最出名的當(dāng)然要數(shù)谷歌的 Material Design 里的動(dòng)效系統(tǒng)了。來(lái)看他們團(tuán)隊(duì)對(duì)于動(dòng)效的說(shuō)明：
1. 谷歌的動(dòng)效說(shuō)明
2. 為什么動(dòng)效很重要腰埂？
動(dòng)效展示了 App 的組織方式以及可執(zhí)行的操作飒焦。
動(dòng)效提供了：
不同視圖間的引導(dǎo)；
提示用戶(hù)使用手勢(shì)后會(huì)發(fā)生什么屿笼；
元素之間的層次和空間關(guān)系牺荠；
轉(zhuǎn)移用戶(hù)注意力，不去關(guān)注場(chǎng)景背后發(fā)生的程序行為（如獲取內(nèi)容或加載下一個(gè)視圖）驴一；
讓產(chǎn)品變得有個(gè)性休雌、優(yōu)雅和讓人喜愛(ài)。
3. Material 是如何運(yùn)動(dòng)的蛔趴？
Material 系統(tǒng)是從現(xiàn)實(shí)世界的力學(xué)中獲得的靈感挑辆，比如重力和摩擦。這些力學(xué)理念反映在用戶(hù)的輸入對(duì)屏幕上元素的影響以及元素間的相互作用孝情。
響應(yīng)：Material 充滿(mǎn)能量鱼蝉，它可以在觸發(fā)的位置快速響應(yīng)用戶(hù)的操作；
自然：Material 描繪了受現(xiàn)實(shí)世界中的力學(xué)啟發(fā)的自然運(yùn)動(dòng)箫荡；
聰明：Material 會(huì)聰明地了解其周?chē)h(huán)境魁亦，包括用戶(hù)和周?chē)钠渌?Material。它可以和附近元素互動(dòng)并對(duì)用戶(hù)意圖做出適當(dāng)?shù)姆磻?yīng)羔挡；
示意：運(yùn)動(dòng)中的 Material 會(huì)將你的注意力在正確的時(shí)間引導(dǎo)到正確的位置洁奈。
4. 好動(dòng)效是怎樣的？
動(dòng)效是很快的：交互動(dòng)效不應(yīng)該讓用戶(hù)有更長(zhǎng)的等待時(shí)間绞灼；
動(dòng)效是清晰的：過(guò)渡動(dòng)效應(yīng)該清晰利术、簡(jiǎn)單和連貫，應(yīng)該避免一次做太多動(dòng)作低矮；
動(dòng)作是凝聚的：Material 元素的速度印叁、響應(yīng)性和意圖是統(tǒng)一的。同時(shí)，你所定義的動(dòng)效體驗(yàn)在整個(gè) App 中都應(yīng)該是一致的轮蜕。
除了上面關(guān)于動(dòng)效的基本定義昨悼，他們還寫(xiě)了很詳細(xì)的做動(dòng)效時(shí)應(yīng)該注意的細(xì)節(jié)，以及各種動(dòng)畫(huà)曲線(xiàn)的應(yīng)用場(chǎng)景等跃洛，非常推薦喜歡動(dòng)效的同學(xué)去好好了解一下率触。如果說(shuō)交互說(shuō)明方面蘋(píng)果團(tuán)隊(duì)是大佬，那動(dòng)畫(huà)說(shuō)明方面毫無(wú)疑問(wèn)谷歌團(tuán)隊(duì)才是大佬汇竭。
4. 微軟的動(dòng)效說(shuō)明
微軟在 Windows 10 以后葱蝗，也做了一套自己的 Fluent 設(shè)計(jì)系統(tǒng)，也是蠻有特色的韩玩，我也舉例介紹一下他們對(duì)于動(dòng)效的說(shuō)明吧（他們稱(chēng)之為動(dòng)畫(huà)）垒玲。
5. 什么是連貫動(dòng)畫(huà)？
ST注：說(shuō)明其中一種動(dòng)畫(huà)——連貫動(dòng)畫(huà)的作用
連貫動(dòng)畫(huà)讓你可以通過(guò)為一個(gè)元素在兩種不同視圖之間的轉(zhuǎn)換創(chuàng)建動(dòng)畫(huà)來(lái)創(chuàng)建動(dòng)態(tài)和引入注目的導(dǎo)航體驗(yàn)找颓。 這有助于用戶(hù)維持其上下文并提供不同視圖之間的連貫性合愈。 在連貫動(dòng)畫(huà)中，當(dāng) UI 內(nèi)容發(fā)生變化時(shí)击狮，元素似乎在兩種不同視圖之間保持「連貫性」佛析，從其在源視圖中的位置掠過(guò)屏幕，到達(dá)其在新視圖中的目標(biāo)位置彪蓬。 這強(qiáng)調(diào)了不同視圖之間的共同內(nèi)容寸莫，并創(chuàng)建了轉(zhuǎn)換過(guò)程中美觀且動(dòng)態(tài)的效果。
6. 查看實(shí)際操作
在這段簡(jiǎn)短的視頻中档冬，應(yīng)用使用連貫動(dòng)畫(huà)來(lái)為一個(gè)正在「繼續(xù)」變成下一頁(yè)標(biāo)題中一部分的項(xiàng)目圖像制作動(dòng)畫(huà)膘茎。 該效果有助于在轉(zhuǎn)換過(guò)程讓用戶(hù)理解前后關(guān)系。
7. 為何選擇連貫動(dòng)畫(huà)酷誓？
在頁(yè)面之間導(dǎo)航時(shí)披坏，很重要的一點(diǎn)是讓用戶(hù)了解導(dǎo)航過(guò)后會(huì)出現(xiàn)哪些新內(nèi)容，以及這些新內(nèi)容與他們?cè)趯?dǎo)航時(shí)的意圖有何關(guān)聯(lián)盐数。 連貫動(dòng)畫(huà)提供了一個(gè)強(qiáng)大的視覺(jué)隱喻棒拂，通過(guò)將用戶(hù)的注意力轉(zhuǎn)移到兩個(gè)視圖之間共享的內(nèi)容，強(qiáng)調(diào)了二者之間的關(guān)系玫氢。 此外帚屉，連貫動(dòng)畫(huà)為頁(yè)面導(dǎo)航增添了視覺(jué)效果和潤(rùn)色，這可以讓你的應(yīng)用的動(dòng)態(tài)設(shè)計(jì)與眾不同漾峡。
8. 如何實(shí)施
設(shè)置連貫動(dòng)畫(huà)涉及兩個(gè)步驟：
準(zhǔn)備源頁(yè)面上的動(dòng)畫(huà)對(duì)象攻旦，這向系統(tǒng)表明源元素將參與連貫動(dòng)畫(huà)
啟動(dòng)目標(biāo)頁(yè)面上的動(dòng)畫(huà)，將參考傳遞到目標(biāo)元素
在這兩個(gè)步驟之間生逸，源元素將以?xún)鼋Y(jié)狀態(tài)顯示在應(yīng)用中的其他 UI 上方敬特，讓你可以同時(shí)執(zhí)行任何其他轉(zhuǎn)換動(dòng)畫(huà)掰邢。 出于此原因牺陶，你在兩個(gè)步驟之間不應(yīng)等待超過(guò) 250 毫秒伟阔，因?yàn)樵丛氐拇嬖诳赡軙?huì)讓人分心（ST注：這個(gè)對(duì)動(dòng)畫(huà)時(shí)間的規(guī)定可以記住）掰伸。 如果你準(zhǔn)備一個(gè)動(dòng)畫(huà)且并未在三秒內(nèi)啟動(dòng)它皱炉，則系統(tǒng)將釋放該動(dòng)畫(huà)，且任何對(duì) ?TryStart 的后續(xù)調(diào)用將失敗狮鸭。
你可以通過(guò)調(diào)用 ?ConnectedAnimationService.GetForCurrentView 來(lái)訪(fǎng)問(wèn)當(dāng)前的 ConnectedAnimationService 實(shí)例合搅。 要準(zhǔn)備動(dòng)畫(huà)，請(qǐng)?jiān)诖藢?shí)例上調(diào)用 PrepareToAnimate歧蕉，將參考傳遞到你想用在轉(zhuǎn)換中的唯一密鑰和 UI 元素灾部。 該唯一密鑰讓你可以稍后檢索動(dòng)畫(huà)，例如在不同頁(yè)面上檢索惯退。
ConnectedAnimationService.GetForCurrentView().PrepareToAnimate(「image」, SourceImage);
（ST注：在說(shuō)明了動(dòng)畫(huà)的作用之后赌髓，他們開(kāi)始說(shuō)明如何在開(kāi)發(fā)中使用這種動(dòng)畫(huà)的方式，你想用這種動(dòng)畫(huà)的時(shí)候可以把它給開(kāi)發(fā)看）
