移動端UI交互式動效設計教學分析

吉袁媛

摘 要：移動端UI交互式動效設計是基于網絡技術與移動終端誕生的一種新型設計手段，若是在大專院校中設置相應的課程，一方面可以革新教學方法，優化教學內容，調動學生的積極性和學習熱情;另一方面可以滿足互聯網公司對交互式動效設計人才的不竭需求，提升用戶的體驗感。故此，本文對移動端UI交互式動效設計教學進行了淺顯的分析。

關鍵詞：移動端UI;交互式動效設計;教學實踐

引 言

移動端UI是建立在用戶與設備之間的橋梁。如今，深受用戶喜愛的多種移動電子設備就是在移動端UI交互式動效設計的作用下實現信息傳達，帶給用戶全新的體驗，同時提升用戶的黏性程度。對于日常的教學而言，不論是學校還是教師，都應重視UI交互式動效設計課程的開展與實施，在教學中要順應移動互聯網的發展趨勢，運用多種教學方法進行授課。此外，為了保證學生后期就業，要求教師在教學中引導學生樹立“以用戶為中心”的意識，通過多種手段豐富學生的知識，拓寬他們的眼界，以促進學生創新能力、操作技能和綜合素質的全面提升[1]。

1. UI交互式動效的簡單介紹

材料設計語言（Material Design）認為：動效是以等同于動畫的手法，賦予界面活力和生機，使其更具真實性與體驗感[2]。通過對UI交互式動效的進一步研究，筆者依據自身的理解提出的觀點如下：UI交互式設計是以界面元素為導向，設計精細且恰當的動態效果，指引用戶操作，同時運用動態視覺化、相應觸覺化等方式提高用戶的操縱桿和代入感，以滿足用戶的多樣化需求，為其帶來良好的體驗。

2.交互式動效設計的功能及分類

2.1交互式動效設計的功能。據了解，動效設計功能可分為兩類，即操作功能和情感功能。其中，操作功能包括幫助引導、層級展現和使用反饋，引導用戶對App的信息構建、界面元素之間的關系進行深入了解，其目的在于降低學習時間和學習成本，為用戶提供便利的操作條件;情感功能包括流暢度、響應度和美觀度。流暢度可降低用戶因長時間等待而產生的焦慮感;響應度可強化用戶的操縱感;美觀度可強化用戶代入感，增加用戶體驗。

2.2交互式動效設計的分類。首先，轉場類。轉場類動效適用于場景切換和層級跳轉中，具有幫助用戶理解界面間的變化和層級關系的作用;其次，展示類。通俗來講，展示類動效就是產品的動態說明書，既可以幫助用戶快速理解產品，又能保證其在短時間內可以靈活運用;再次，引導類。引導類動效可以通過界面中的元素變化，吸引用戶的注意力，指導用戶依據相應的提升步驟進行操作[3];最后，反饋類。系統的及時反饋會出現在用戶通過交互觸發界面行為時，依據用戶的觸發行為對相應的動態效果進行展示，其目的在于防止用戶進行無意義的操作。

3.交互式動效設計教學應遵循的原則

3.1功能性。在進行交互式動效設計時，應關注動效功能，分析其存在的意義，同時要善于提出多種多樣的問題，如設計移動端UI交互式動效的作用？如果替換成其他設計形式會出現何種情況？等。

3.2一致性。移動端UI交互式動效設計的一致性包括以下兩點：（1）動效元素風格統一，為用戶提供最佳狀態;（2）動效節奏一致，確保產品中的動效元素有同樣的時間、節奏和速度。在進行移動端UI交互式動效設計時唯有嚴格遵守一致性原則，才能縮短用戶信息獲取時間，幫助他們更好、更快地理解產品屬性，從而強化用戶的體驗感。

3.3個性化。對于受眾廣泛的移動設備來說，獨特的動效不僅可以防止產品雷同，在眾多App中占據主導地位，還能吸引用戶的注意力，提升其使用熱情，同時形成品牌效應。比如說，因抖音所具有的視頻短小精煉、功能豐富、易操作等優勢，使其在眾多的短視頻社交軟件中脫穎而出，并且享譽海外，即中國地區的“抖音短視頻”和海外的“Tik Tok”。

3.4以用戶為中心。移動端UI交互式動效設計時不僅要有明確的目標，還要具有較強的針對性，以交互出發，立足于客戶的角度進行思考，如操作目的、操作習慣和視覺呈現效果等。當用戶在使用移動設備時，能夠產生自主控制的意識，并非根據機械化的跳轉而達到自己的實際需求。

4.移動端UI交互式動效設計教學存在的弊端及解決對策

4.1移動端UI交互式動效設計教學存在的弊端。

（1）缺少對動效設計應有的重視。在資源、資金、人才等因素的影響下，使得移動端UI交互式動效設計只能停留在設計階段，難以進行深入的滲透和實施[4]。此外，部分公司缺少對動效設計應有的重視，并未給予資金和人力上的支持，導致動效設計效果與預期目標存在較大的出入。在這種情況下，即便大專院校為相關企業輸送優秀人才，也是無濟于事。

（2）過度使用動效。據了解，部分教師在實際教學中，過于注重動效在移動應用中的運用，沒有結合自身情況對動效進行研究，生搬硬套動效具有的功能，并未考慮用戶體驗、品牌延展性等。在這種教學理念引導下設計出的動效，非但無法吸引用戶的注意力，還會使其產生厭煩心理。

（3）感官反饋有限。在現實世界中，人們可以通過自己的五官與事物進行交互，而在移動網絡中，用戶在操作應用時，觸覺占據著較大的比重。但在實際發現，教師在教學中過于強調視覺上的沖擊，忽視了觸覺、聽覺等方面的精細化處理，導致用戶的體驗感降低。

4.2移動端UI交互式動效設計教學中的對策。基于移動端UI交互式動效設計教學中存在的缺陷，教師應做到以下幾點：首先，加強校企合作。大專院校的辦學宗旨不僅僅是為學業不佳的學生提供學習的機會，還在于培養優秀的技術型人才，滿足社會發展對人才的多樣化需求[5]。對此，學校在開展移動端UI交互式動效設計課程時，應通過校企合作的方式加強與企業之間的聯系，在企業的用人需求和自身發展所需的雙重作用下合理設置課程內容，這樣既可以提高企業對移動端UI交互式動效設計的重視程度，還能解決移動端UI交互式動效設計中存在的現實問題。其次，優化教學過程。移動端UI交互式動效設計課程的開展與實施中，教師除了要革新教學理念，注重理論與實踐的雙向教學外，還要優化教學過程，告知學生在動效設計中要遵循針對性、適應性等原則，同時要具備一定的意識，如創新意識，站在用戶角度思考問題的意識等。此外，教師還應引導學生在設計時要注重觸覺、視覺和聽覺的立體享受，適當控制動效的數量與幅度，這樣有助于提升產品質量，收獲用戶的目光和青睞。

5.結束語

綜上所述，對于移動端UI交互式動效設計教學而言，若想逐步實現人才培養目標，除了要遵循功能性、一致性、個性化以及視用戶為中心等原則外，還要追尋當前移動互聯網的發展方向，正式教學中存在的問題和缺陷，并施以可行性的對策予以解決，只有這樣才能提高教學質量與教學效果，促進學生綜合素質與能力的提升，最終滿足企業的用人所需，實現大專院校的長久發展。

參考文獻

[1] 孟旭，鄭曉慧.移動端UI交互式動效設計教學探究[J].中國多媒體與網絡教學學報（上旬刊），2019，（07）：161-162.

[2] 周揚帆.構建《UI動效》課程教學資源庫的研究[J].科技創新導報，2018，15（20）：210-211，213.

[3] 余曉瑜.移動智能終端中的動效設計原則和設計方法[J].工業設計研究，2018，（11）：434-439.

[4] 葛田.基于移動UI界面的交互式設計探索[J].電腦知識與技術，2019，15（09）：207-208.

[5] 白旭，羅小芳.基于移動終端的智能交互式課堂教學模式研究與實踐[J].中國教育技術裝備，2016，380（02）：19-21.