移動端UI交互式動效設(shè)計教學分析

吉袁媛

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

關(guān)鍵詞：移動端UI;交互式動效設(shè)計;教學實踐

引 言

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

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

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

2.交互式動效設(shè)計的功能及分類

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

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

3.交互式動效設(shè)計教學應(yīng)遵循的原則

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

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

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

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

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

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

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

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

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

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

5.結(jié)束語

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

參考文獻

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

[2] 周揚帆.構(gòu)建《UI動效》課程教學資源庫的研究[J].科技創(chuàng)新導(dǎo)報，2018，15（20）：210-211，213.

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

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

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