动效设计中的隐喻-2
這次我們再看一些別的有關隱喻(或曰明示)的設計。
示意關系
所謂示意關系,就是通過特定的動作來表明界面中控件之間的某些關系,包括包含關系、前后關系和位置關系。其實就是我們以前討論過的連接的一種。有一些比較常見的連接動作,可以很明確的表明界面變化過程中控件之間的關系。
如下圖的游戲《Wonderbox:冒險制造者》中的“級別提升”的動效,就是一個表現控件關系的隱喻:所獲得的點數直接飄到經驗條上,接著進度條出現增長動畫。這就很直接的表現兩者之間的從屬關系。
?
如下圖所示的游戲《刺客信條:起源》中的“技能升級”界面動效。就通過動態過程解釋了技能之間的遞進關系:一個技能的解鎖動效之后,會有黃色線條出現,將已解鎖技能圖標與下一個可解鎖圖標相連接。雖然如果沒有這個動態過程,兩者之間的關系也可以直觀的看到,但這種動態過程其實是對“逐漸升級”的最佳隱喻。所以這段動效其實是不可或缺的。
?
如下圖所示的游戲《羞辱2》中的“黑市”界面動效。這個界面巧妙的利用了場景動畫與界面動畫結合的方式來解決物品的方位與圖標識別性的問題:左側的畫面中,貨架上的物品與右側面板中物品圖標的位置一一對應,切換右側的圖標時,左側的畫面鏡頭就對焦到具體的物體上。這樣即便右側的圖標較小,也可以通過左側的畫面物品看清楚物品。而且右側圖標的布局設計一目了然,玩家也不會因為左側是特寫鏡頭而搞錯選擇方向。
?
示意層級
這也屬于連接的一種,屬于一種邏輯關系連接示意。一般通過平面二維展開,也會結合一些縱深空間關系來明確這一點。
如下圖所示的游戲《刺客信條:起源》中的人物裝備操作界面。二手手游賣號這里的裝備詳情控件的出現動效,就是在前一個界面“人物詳情”往縱深后退之后出現的。并且裝備圖標本身還有一個位移動畫,為附屬控件騰挪控件。整個過程的空間感比較強,兩層界面之間的層級關系,在這個動態過程里被解釋得一清二楚。
如下圖所示的游戲《殺出重圍:人類分裂》的“郵件”界面里的切換動效。這是個非常常見的表示界面層級關系的效果:切換第一級,展開第二級。操作第二級,會有第三級內容進行相應。
?
除上邊這些從屬邏輯的層級外,另外一些層級是屬于遞進邏輯的,比如不同等級的情緒。這種蘊含了情緒的層級,需要比較綜合的動態設計手段。
如下圖所示的游戲《無畏契約》(Valorant)中連續爆頭提示動效:
?
這幾個擊殺圖標的設計本身就有層級關系,連續擊殺一個的圖標和連續擊殺三個的圖標顯然并不一樣。除了靜態樣式的不同,在圖標的動態設計上也需要有所差別,以便增強相關操作發生時的反饋強度,更深入的去表達這一提示所蘊含的情緒。
示意情緒
動效的存在目的之一就是表達情緒。而一些細微的情緒表現,也被附著在動效設計之中?;騼炑呕蚣痹?#xff0c;或催促或安撫,都可以通過不同的動作設計來表現。當然,這離不開視覺設計上的一些情緒元素去輔助。
如下圖的游戲《Wonderbox:冒險制造者》中的“獲得冒險之心”的動效,就是一個表現強烈獲得感情緒的隱喻。動態的彩帶噴出與諸多光效的結合設計,都在靜態圖的情緒表現上有了很大提升。
?
關于更多情緒表達的東西,我們會專門有系列文章來討論,這里不再展開更多。
還有哪些關于動效的隱喻設計曾經幫助你解決設計上的難題?歡迎評論指出,也期待你的意見和反饋。
以上。
總結
以上是生活随笔為你收集整理的动效设计中的隐喻-2的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 动效设计中的隐喻-1
- 下一篇: 科技感的动态设计方法-1