在Jeff的地圖動(dòng)畫中，他同時(shí)使用了所有位置、透明度和比例動(dòng)畫的組合括蝠。
- 初始的面板稍微縮小并且透明度降低斑胜，所以它很好地淡出到應(yīng)用的背景中去了控淡。
- 地圖面板從一個(gè)比1.0倍稍微大一點(diǎn)的比例（可能是1.1倍之類的）以及0.0的透明度開始。然后動(dòng)畫減小到1.0倍以及1.0的透明度止潘。它還有一個(gè)輕微的位置動(dòng)畫來上移一些像素掺炭。
記得這個(gè)手表的界面和它光滑的動(dòng)作么？真的沒有什么秘訣凭戴，這個(gè)動(dòng)畫設(shè)計(jì)唯一的屬性就是元素的位置涧狮。沒有比例或者透明度的調(diào)節(jié)，元素僅僅是在屏幕上通過改變他們的位置來移入移出么夫。每個(gè)動(dòng)畫的開始時(shí)間會比前一個(gè)元素稍微錯(cuò)開一點(diǎn)來給出一種“拖拽”的感覺者冤，但是唯一用到動(dòng)畫里的就只有位置。
動(dòng)畫一個(gè)元素的位置档痪、透明度和比例可以讓你走的很遠(yuǎn)涉枫，但當(dāng)然也有其他你可以在動(dòng)畫中操作的屬性。這里是三個(gè)在更高級的動(dòng)畫中經(jīng)常用到的元素屬性腐螟。
顏色愿汰。就如CSS動(dòng)畫中一樣，你可以在兩個(gè)值之間過渡顏色遭垛。這可以是你界面中一些文本的顏色或形狀和面板的背景色尼桶。你可以在一次點(diǎn)擊或者介紹一個(gè)新界面給用戶的時(shí)候過渡顏色【庖牵或者可以在用戶首次體驗(yàn)一個(gè)滑動(dòng)的時(shí)候在顏色之間緩慢地切換泵督。
旋轉(zhuǎn)。你界面中的物體可以旋轉(zhuǎn)庶喜，從初始的0度到360度的旋轉(zhuǎn)狀態(tài)到360度的整體旋轉(zhuǎn)并回到0度小腊。當(dāng)你在代碼中創(chuàng)建動(dòng)畫的時(shí)候旋轉(zhuǎn)通常使用弧度來表示（0到2π）救鲤。輕微的旋轉(zhuǎn)動(dòng)畫可以增加非常靈巧有趣的元素到原本平凡的動(dòng)作中去，尤其是和之后會討論的跳躍動(dòng)畫曲線組合的時(shí)候秩冈。
3D本缠。在你的界面中以3D的方式變化一個(gè)物體意味著在第三個(gè)方向上操作它，并且當(dāng)你在動(dòng)畫中使用3D的時(shí)候入问，通常要么是3D旋轉(zhuǎn)回屏幕丹锹，要么是旋轉(zhuǎn)向用戶。這個(gè)旋轉(zhuǎn)的數(shù)量也是像2D平面旋轉(zhuǎn)一樣用弧度來表示的芬失，但3D動(dòng)畫的另一個(gè)關(guān)鍵因素是你想使用多少透視程度楣黍。通過改變透視值，你可以有限地描述元素會被放置在視覺上離屏幕前端多遠(yuǎn)的地方棱烂。這取決于3D變化過程中變形的數(shù)值租漂。
一個(gè)精細(xì)的3D效果的例子是Clear中捏的動(dòng)畫。這個(gè)視覺效果是任務(wù)條目行視覺上折了一半颊糜，其中每一半都向屏幕里面旋轉(zhuǎn)（在3D空間上）哩治。旋轉(zhuǎn)的數(shù)值和行的上下兩半的位置都被仔細(xì)的控制，所以在中間沒有縫隙去影響效果衬鱼。還有业筏，為了讓它看上去確實(shí)像一個(gè)三維物體，要讓行的上半部分比下半部分暗來顯示一個(gè)陰影馁启。這類似于Paper中的彈起動(dòng)畫：新聞在打開的時(shí)候使用了一個(gè)3D變化來旋轉(zhuǎn)向用戶驾孔。
Clear中的捏交互
查看完整合集：https://github.com/Cloudox/Motion-Design-for-iOS
