中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

動效細節(jié)原則總結(jié)

動效細節(jié)原則總結(jié)今年早些時候迪斯尼動畫師Glen Keane和R/GA的設(shè)計師Rebecca Ussai在Medium上發(fā)了一篇文章UX Choreography，首次嘗試通過12個原則和5個規(guī)律來總結(jié)UI動效的一些要求。他們總結(jié)的很好，不過只是主要涵蓋了功能性動效，沒有去真正考慮“物理性”和“趣味性”。

從我的觀點上來看，12個原則可以完全應用于UI動效。我重新整理了這些規(guī)則歸類進了上面的三種動效中。

下面讓我們看看這些原則是如何單獨應用到UI動效的，并分析他們的相互關(guān)系。

實體繪圖Solid drawing

基本的物理設(shè)計原則。主要是遵循三維空間的規(guī)則，通過給對象賦予重量和容積來得到適當維數(shù)。實體繪圖需要動畫師熟悉基本的三維形狀知識–結(jié)構(gòu)，重量，平衡，光和陰影。迪斯尼動畫師希望動畫片看起來真實，希望觀眾能夠和動畫角色關(guān)聯(lián)起來。他們以前叫SOLID DRAWING。今天在動效設(shè)計領(lǐng)域稱之為 MATERIAL DESIGN。

有兩種辦法畫出動態(tài)效果：逐幀畫 / 直接畫每個不同狀態(tài)。動畫師根據(jù)復雜程度和轉(zhuǎn)場的狀態(tài)使用不同的技術(shù)手段。而動效跟我們用戶的聯(lián)系決定于我們要用XCODE還是CSS還是用其他編程語言來實現(xiàn)。

如果動效很簡單，你只需變化一個單一的參數(shù)，比如說對象的位置或者縮放，可以創(chuàng)建兩個關(guān)鍵幀來直接實現(xiàn)相對線性的過渡。

而如果你的動畫是獨特復雜的，有很多變量，那么你應該制作逐幀動畫或者使用AE等軟件制作出來。

擠壓和拉伸Squash and stretch

用來描述目標對象的剛性和質(zhì)量，定義對象的物理屬性。作為設(shè)計師你應該定義UI的屬性：固定架構(gòu)，剛性表面，以及快速準確地動作；還是更有機，具有柔軟可彎曲的表面以及流體動作。這是你的動效品牌感：你的動畫風格和給人的感受。

同樣，弧線（曲線）也有助于定義動畫的本質(zhì)。像汽車自行車火車等機械產(chǎn)品傾向于沿著直線軌跡運動，而有機體，如植物，動物，和，嗯…我們，往往沿著弧形軌跡移動。所以問問你自己，你的UI是機器人還是人性化的？這一原則，以及擠壓和拉伸和直線等結(jié)合就能創(chuàng)建更真實的，有機的，令人難忘的動效。

分級強調(diào)主要強調(diào)動效的中心思想（分清主次），能使用戶見到動效就一目了然。一個分級較好地過渡動效可以把用戶的注意力吸引到正確地位置—到重要的建議內(nèi)容或交互重點上。大多數(shù)用戶界面缺乏強有力的關(guān)注點，結(jié)果新用戶瀏覽各種界面時通常一頭霧水。即使你的UI沒有重要關(guān)注點，你可以給動效進行分級，讓用戶真正注意到重要的部分。

時間可能是最重要的原則之一。無論你在用什么做動畫，你的時間序列定義了用戶對動效的感知和理解程度，包括制作主要和次要動畫以及緩入緩出等效果。

動畫合成需要技巧和練習。時間的控制主要是速度曲線。AfterEffects 的一些腳本或者自帶的關(guān)鍵幀輔助功能都提供一些基本曲線（EASE IN / EASE OUT）。

標準緩動曲線查詢網(wǎng)址：http://easings.net/zh-cn

如果你剛開始接觸緩動曲線，那么應該多去鍛煉，找到動畫感覺，達到能夠快速分辨出動畫的緩動方式的水平就可以了。

跟隨和重疊原理是和同時發(fā)生多個動畫有關(guān)的。好多東西都不是一致性的運動，有些動畫比其他動畫更加引人注意。

跟隨原理的意思是 要讓屬于大的對象的部分跟隨其“父級” 有機和真實的運動。而?重疊?可以確保這一切同時發(fā)生。跟隨原理 可以提現(xiàn)UI構(gòu)件之間的層級關(guān)系，并給動畫設(shè)置優(yōu)先級，同時重疊原理 可以使動畫保持一致并在可控范圍內(nèi)協(xié)調(diào)運動。

輔助動畫原則和上面的原理很像。它可以幫助你確定哪些需要放在用戶眼前，哪些需要隱藏。選擇對用戶理解最重要的動畫為優(yōu)先的，并用輔助動畫進行潤色。

緩入/ 緩出?是引起用戶注意的基礎(chǔ)效果，同時能讓動畫感覺順暢和真實。這個原則，和時間+跟隨重疊原理結(jié)合，可以制作很自然且有層次感的動畫。

從物理性角度講，緩動動畫遵循的是 慣性定律——物體運動不會突然停止和瞬間加速（都有加速和減速過程）。動畫遵循物理定律可以讓用戶更加舒服。從功能性角度，不斷減速的物體會吸引人們的注意力，不斷加快速速度的對象會失去注意力。比如說 進來的動畫要先快后慢，出去的物體要先慢后快。

預判是可以在動畫的開始或結(jié)束階段都可用的原則。首先，它對預備一些要動的對象以及編排場景的部件，流露一些動畫的“線索”。預判效果的最簡單的實現(xiàn)辦法就是緩入。第二個預判方法就是在動畫轉(zhuǎn)場后提供手勢輔助，比如說出現(xiàn)“右滑菜單進行選擇”等提示語。

夸張?可以讓動畫變現(xiàn)得活潑有趣。不夸張的動畫有時會顯得精確，不過在有些場景中會很無趣，機械和僵硬?？梢愿鶕?jù)你對用戶體驗的感覺和要求程度確定該不該做夸張地動畫以及夸張地程度。動效的目標是讓你的按鈕/面板/菜單/內(nèi)容和用戶交互后的效果顯得更加生動。

感染力?是最為神秘的原則之一。我們每天都接觸N個APP和網(wǎng)站，他們解決著各種人的各種需求。而真正留住用戶，增加用戶粘性的卻沒幾個。真正能夠留住用戶的不僅有好的用戶體驗，還能使用戶對產(chǎn)品產(chǎn)生感情。

把動效做的統(tǒng)一又有感染力，需要在設(shè)計動畫時不僅讓用戶感覺真實，還要有自己的獨特風格。

結(jié)論

• 功能性：確定你的動效能夠解決用戶需求
• 物理性：設(shè)計高度統(tǒng)一的，能夠制作有空間意義轉(zhuǎn)場的用戶界面
• 趣味性：給你的動畫一些關(guān)愛（趣味），讓用戶愛上你的產(chǎn)品。

展示中的動畫作者（DRIBBBLE）: Leo Leung，superwhite, Eddie Lobanovskiy, Isil Uzum, Rebecca Ussai, Anish Chandran, Jason Teunissen, ?ukasz Frankiewicz, Sergey Valiukh, Konstantine Trundayev, Jelio Dimitrov, Ramotion, Jakub Antalik, Pavel Proshin, Kreativa Studio, Justin Ruckman, Nikita NIKI, xjw, Zee Young.

翻譯自：Jedi Principles of UI Animation，MEDIUM.

譯者：@敖廠長UX?.微信公眾賬號：交互動效設(shè)計。dribbble?BUCKETS：?https://dribbble.com/AOreal/buckets/321029-UI-UX

本文由 @敖廠長UX 授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理?，未經(jīng)許可，禁止轉(zhuǎn)載。