POST TIME:2018-12-03 21:02
1. 為什么需要?jiǎng)有гO(shè)計(jì)?
什么是動(dòng)效設(shè)計(jì)?
動(dòng)效在產(chǎn)品設(shè)計(jì)的作用
動(dòng)效設(shè)計(jì)的好尺度
2. 如何設(shè)計(jì)動(dòng)效?
6 個(gè)構(gòu)思動(dòng)效的方法
6 個(gè)實(shí)現(xiàn)動(dòng)效的方法
3. 動(dòng)效的類別
4. 常用的動(dòng)效軟件
5. 讓動(dòng)效落地的 4 個(gè)方法
為什么需要設(shè)計(jì)動(dòng)效?我最開始接觸動(dòng)效設(shè)計(jì),只是覺得又炫,又酷,翻滾的,旋轉(zhuǎn)的,爆炸的。只是覺得新鮮,好玩,,可以炫技。可以讓設(shè)計(jì)更加酷炫。可能大部分同學(xué),在做剛開始接觸的時(shí)候多多少少都會(huì)有和我差不久不多的想法。這就是我們做動(dòng)效設(shè)計(jì)的目的嗎?應(yīng)該不是。
解決為什么要做動(dòng)效設(shè)計(jì)這個(gè)問題,就要搞清楚什么是動(dòng)效設(shè)計(jì)?動(dòng)效設(shè)計(jì)有什么作用?
1. 什么是動(dòng)效設(shè)計(jì)呢?
動(dòng)效大范圍興起,大概始于扁平化設(shè)計(jì)之后,扁平化設(shè)計(jì)的好處在于用戶的注意力可以集中在界面的核心信息上,將對用戶無效的設(shè)計(jì)元素去掉,不被設(shè)計(jì)所打擾分散注意力,使用體驗(yàn)更加純粹自然。這個(gè)思路是對的,回歸了產(chǎn)品設(shè)計(jì)的素質(zhì),就是提供更好的使用體驗(yàn),而不是提供更標(biāo)致的界面設(shè)計(jì)。但是,過于扁平化的設(shè)計(jì),也帶來了新的問題,一些復(fù)雜層級關(guān)系如何展現(xiàn)?用戶如何被引導(dǎo)和吸引?這與用戶在現(xiàn)實(shí)3D世界中的自然感受很紛歧致。所以Google推出了Material Design設(shè)計(jì)語言。
Material design 設(shè)計(jì)規(guī)范中,將動(dòng)效設(shè)計(jì)這一章命名為「Animation」,動(dòng)畫,活潑的意思。
動(dòng)詞 Animate 是「賦予生命」的意思,動(dòng)效可以定義為使用類似動(dòng)畫的手法,賦予界面生命和活力。
前面我們說過Material design設(shè)計(jì)語言,一部分作用是為了解決過于扁平化設(shè)計(jì)所帶來的毛病,復(fù)雜層級關(guān)系如何展現(xiàn),用戶如何被引導(dǎo)和代入。為了解決這個(gè)問題,Material design 設(shè)計(jì)風(fēng)格,充分利用Z軸,通過分層設(shè)計(jì)以及動(dòng)效相配合的方式,在扁平化基礎(chǔ)上提供給用戶更好理解的層級關(guān)系,賦予設(shè)計(jì)以情感增加用戶使用過程中的參與度。
2. 動(dòng)效設(shè)計(jì)對于產(chǎn)品設(shè)計(jì)有什么作用?
動(dòng)效設(shè)計(jì)的作用
如上圖所示,動(dòng)效對于產(chǎn)品設(shè)計(jì)的作用包羅:
傳遞層級信息 ;
傳遞狀態(tài)信息;
提示隱藏信息功能;
傳遞情感化信息。
知道了這些,那么,我們?yōu)槭裁葱枰獎(jiǎng)有гO(shè)計(jì)?
通過上面說的,結(jié)合我們自身產(chǎn)品設(shè)計(jì)的特性,我們可以總結(jié)出動(dòng)效設(shè)計(jì)的動(dòng)機(jī)主要有如下幾點(diǎn):
使等待不枯燥;
使變革不生硬;
使反饋不僅調(diào);
使體驗(yàn)有情感;
使用戶更愉悅。
好的動(dòng)效是什么?知道為什么做動(dòng)效設(shè)計(jì),那我們應(yīng)該做什么樣的動(dòng)效設(shè)計(jì)?或者說好的動(dòng)效設(shè)計(jì)是什么呢?是炫酷的,翻滾的,旋轉(zhuǎn)的,爆炸的嗎? 復(fù)雜程度是評判好與壞的尺度嗎?
國外一位著名的一線設(shè)計(jì)師,曾經(jīng)在分享會(huì)上對于好的動(dòng)效下過這樣一個(gè)定義:
好的動(dòng)效應(yīng)該是隱形的,好的動(dòng)效應(yīng)該是以提高可用性為前提,而且以令人覺得自然含蓄的方式提供有效用戶反饋的一種機(jī)制。
這句話其實(shí)就是,好的動(dòng)效設(shè)計(jì)是合適的,是對于用戶使用體驗(yàn)的提升,最終辦事的是體驗(yàn)而不是展示你的動(dòng)畫設(shè)計(jì)。
既然如此 ,那么讓我們總結(jié)一下好的動(dòng)效設(shè)計(jì)的尺度。
首先要具備一下幾點(diǎn)特性:
快速且流暢;
恰到好處的反饋;
提升操作感受;
提供良好的視覺效果。
動(dòng)效設(shè)計(jì)尺度
其次,好的動(dòng)效設(shè)計(jì)應(yīng)該是首先辦事于體驗(yàn),其次適當(dāng)設(shè)計(jì)(考慮全面,如性能,實(shí)現(xiàn)成本,是否干擾用戶等),再次就是要讓用戶感受到你輸出的情感互動(dòng),最后也是最基本的就是要具有視覺上的美感。