動畫設計技巧

1. 動畫設計不僅應當優美,更應當服務於功能。

2. 是關注一個應用本身、還是更關注這個應用的元素從 A 點到 B 點轉變的過程????

3.動畫設計的目的: 有效地引導用戶的注意力

4.原則
    原則一:視覺連貫性
      在兩個視覺效果不同的頁面之間的轉場應該平滑、輕快,更重要的是使用戶感覺清晰而非困惑
- 新入元素(Incoming elements):完全新的元素需要有新手引導,從已有場景中轉變而來的元素需要重新被識別
- 淡出元素(Outgoing elements):與當前場景不相關的元素應當以恰當的方式被移除
- 通用元素(Shared elements):指那些從轉場開始到結束都沒有發生變化的元素。可以是細微至單個圖標,也可以是顯著到佔據屏幕的圖片展示

    原則二:有層次的時序
     在建立轉場的時候,對於元素移動的順序和時機都要詳加考慮。要確保這個動畫能使信息的展示具有層次感。也就是說,它能引導用戶的關注力,將最重要的內容傳遞給用戶。元素轉場的時序要平滑並且避免脫節的感覺。所有元素同時變動的話會使得重要的內容無法突出展示

     原則三:連貫的編排
     由於轉場元素在整屏範圍裏移動,他們需要以協調的方式運動。起到引導視覺焦點作用的元素,其整個移動過程都要有意義、有秩序隨機的動畫會分散注意力。一個編排好的應用也能夠給用戶提供學習的時機。如果轉場的所有元素都很好的協調,用戶對於這個應用的理解也會增強。他們「理解」這個應用, 不會因爲動畫而無所適從。

5.思考點
     在設計動畫的時候,可以從以下幾點開始考慮:
- 用戶的注意力應該被如何引導?什麼元素和動畫能輔助實現這個目標?新入元素、淡出元素和通用元素在這個轉場中應該怎樣被強調或弱化?
- 在設計場景時考慮到轉場,並且儘量通過色彩和通用元素在不同場景轉化間建立視覺聯繫
- 審慎地添加動畫,思考如何移動一個特定的元素,從而使這個轉場更明晰並使人愉悅
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章