伊人久久综合影院精品久久久中文字幕日韩精品一区二区三区免费视频99精品国产成人一区二区,一级做a爰片久久毛片a片蜜桃国产一区私人高清影院国产精品国内自产拍在线播放,日韩欧美不卡一卡二卡3卡四卡2021免费,日韩 欧美 在线 导航 亚洲 都市,久久国产精品99久久久久久丝袜

服務(wù)熱線:0755-83100310(7X24h)

APP軟件用戶體驗七種設(shè)計技巧

發(fā)布者:admin    發(fā)布時間:2019-08-16    人氣:2074

當(dāng)前位置:首頁 > 動態(tài) > 行業(yè)新聞

UI設(shè)計是一個移動互聯(lián)網(wǎng)或互聯(lián)網(wǎng)產(chǎn)品的門面,設(shè)計做得好是贏得用戶的第一步,因此設(shè)計是用戶體驗的關(guān)鍵。本文中我們所講到的是移動app開發(fā)用戶體驗的七種設(shè)計技巧?! ?/span>

在過去的幾年中,移動領(lǐng)域出現(xiàn)了很多變化。一些新的UI設(shè)計風(fēng)格開始涌現(xiàn),設(shè)備屏幕尺寸及處理器性能規(guī)格都在逐漸向桌面設(shè)備靠攏,輸入方式也發(fā)生了革命性的改變。  

在這種情況下,設(shè)計師們需要一直努力去嘗試更加先銳的、特色鮮明、性能卓越的設(shè)計方案。我們所說的設(shè)計與性能的關(guān)系,并非單純的指降低圖片尺寸一類;在設(shè)計流程的不同階段和不同層面中的各種決策,都會對產(chǎn)品的性能和功效造成影響。下面,就讓我們一起來了解一些可以在實(shí)戰(zhàn)中有效幫助我們打造高性能移動用戶體驗的設(shè)計準(zhǔn)則。

1.定義用戶界面的品牌特色移動app開發(fā)中的每一個可以與用戶產(chǎn)生互動的地方,無論是單一的交互元素,還是功能模塊整體,都應(yīng)該有助于提升產(chǎn)品的品牌認(rèn)知度、用戶忠誠度及滿意度;設(shè)計人員應(yīng)該有能力識別出它們當(dāng)中最關(guān)鍵的那些,例如特色功能、視覺風(fēng)格、文案、字體或動畫效果等。我們的團(tuán)隊經(jīng)手過很多不同的產(chǎn)品,雖然從整體角度講,它們具有各自的品牌風(fēng)格,但這些設(shè)計方案大多是由同一套基礎(chǔ)UI元素衍生發(fā)展出來的。我們可以將基礎(chǔ)UI元素組合成為界面模塊,而組件化、可復(fù)用的核心界面模塊,則可以進(jìn)一步構(gòu)成整個用戶界面。  

所以,經(jīng)由對這些UI元素的風(fēng)格設(shè)定,我們就可以逐步為界面整體打造出能夠體現(xiàn)品牌風(fēng)格的獨(dú)有特質(zhì)。在概念階段,試著將那些在以下幾個方面發(fā)揮關(guān)鍵作用的UI元素識別出來:  

有助于提升產(chǎn)品差異化競爭力的功能(例如Path中的照片檢視等)?! ‘a(chǎn)品核心功能(例如在線購物類應(yīng)用中的結(jié)帳功能)。模式化的設(shè)計語言。Windows Phone 7的Metro UI是一個典型的例子:具有強(qiáng)烈風(fēng)格的字體、布局和交互等方面的模式,構(gòu)成了其獨(dú)特的設(shè)計基因。這些能夠體現(xiàn)品牌特色的核心要素,本身要具有很強(qiáng)的響應(yīng)性。它們會被用戶不斷的看到、用到,而且會在產(chǎn)品不同的功能界面中被復(fù)用;移動app開發(fā)它們的性能將直接決定一款應(yīng)用的整體表現(xiàn)。將設(shè)計與開發(fā)的注意力放在這些關(guān)鍵要素上,將會是一件事半功倍的事情。

2.判定產(chǎn)品優(yōu)先級對“功效”一詞的理解可以上升到整個產(chǎn)品研發(fā)周期及市場的層面上。很多時候,公司會希望快速上線一款新產(chǎn)品,或是開發(fā)一個產(chǎn)品系列(例如基于一個平臺的多款同類產(chǎn)品,或面向不同平臺的單一產(chǎn)品),亦或是出于時間和資源的限制,必須從多個產(chǎn)品中選擇一款來優(yōu)先完成。在這類情況下,設(shè)計與優(yōu)化的工作力量就必須集中在那些最重要的產(chǎn)品上。優(yōu)先級矩陣可以有效的幫助我們理清頭緒。抉擇因素包括系統(tǒng)平臺、當(dāng)前用戶量、預(yù)期用戶量、競爭對手情況;當(dāng)然,我們還可以從其他更適合自己項目的角度來進(jìn)行權(quán)衡。如果產(chǎn)品受眾多數(shù)是Android用戶,而且你的競爭對手也在盯緊他們,那么與其將精力分?jǐn)傇诟鱾€平臺當(dāng)中,倒不如集中資源打造一款簡潔高效的Android應(yīng)用并盡快投入市場。

3.認(rèn)清用戶需求我們團(tuán)隊經(jīng)歷過的很多項目,在剛剛啟動時都面臨著一些相似的問題:功能需求列表過于冗長,焦點(diǎn)不明確,難以在項目截止時間之前搞定...客戶或需求方通常會對產(chǎn)品功能進(jìn)行天馬行空般的想象,卻往往忽視了用戶的真正需求?! ?/span>

舉例說,無論你是在一個小城鎮(zhèn),還是牛津大街,或是在互聯(lián)網(wǎng)中,血拼的本質(zhì)目的,都是尋找合適的商品并進(jìn)行購買。良好的用戶體驗可以為購物過程帶來更多的樂趣,但絕不能破壞這件事的核心目標(biāo)。用戶希望通過購物類的應(yīng)用來快速的找到某種商品,并順利完成購買;他們甚至?xí)鲆暷切┯糜谠鰪?qiáng)體驗和樂趣的額外功能,軟件設(shè)計與開發(fā)并沒有想象那么簡單。

下圖展示了一款購物應(yīng)用軟件開發(fā)的商品詳情頁面的兩種設(shè)計方案。左邊的原型中包含了一些“高級”購物功能,例如贈禮、相關(guān)商品和用戶評價;而右側(cè)的原型簡化了很多:去掉了贈禮功能;只顯示該商品的整體打分情況,如果用戶需要,可以點(diǎn)擊鏈接查看全部點(diǎn)評;省出的空間用以顯示商品介紹的全文,用戶無需進(jìn)一步點(diǎn)擊就可以完整瀏覽。顯然,右側(cè)的方案可以讓團(tuán)隊將設(shè)計與開發(fā)的注意力放在核心功能上;從產(chǎn)品的角度,這也是最符合用戶的直接需求、最具性能功效的方案。那些“錦上添花”性質(zhì)的內(nèi)容和功能,即使真的有必要存在,也應(yīng)該是在我們對產(chǎn)品核心功能做了最充分的優(yōu)化和最合理的設(shè)計之后,才陸續(xù)登場,并且不能影響核心功能的可用性及性能表現(xiàn)。

image.png

4.優(yōu)化用戶界面流程和元素用戶不喜歡等待。在Google的用戶體驗十大內(nèi)在原則中,時間方面的因素緊隨“用戶需求”排在第二位。對應(yīng)用的每一個界面流程及其構(gòu)成元素的優(yōu)化,都可以不同程度的降低加載及響應(yīng)時間。

A.增強(qiáng)可感知性在很多情況下,設(shè)計師和開發(fā)者確實(shí)無法控制產(chǎn)品性能:網(wǎng)速也許會很慢,系統(tǒng)后臺也許正運(yùn)行著多任務(wù),某個功能也許需要大量系統(tǒng)資源來支持運(yùn)算等等。無論怎樣,在延遲發(fā)生的時候,我們至少應(yīng)該讓用戶感知到應(yīng)用仍處于運(yùn)行狀態(tài)。即使在無法預(yù)料的壞狀況中,合理的設(shè)計方案也可以起到良好溝通作用?! ?/span>

第一步是要識別出哪些功能流程有可能造成延遲,例如那些需要獲取后臺數(shù)據(jù)或是執(zhí)行大量運(yùn)算的運(yùn)行過程。接下來,在這些關(guān)鍵流程中添加必要的狀態(tài)反饋標(biāo)識,例如loading動畫效果,或是一些文案小提示。下圖演示一個比較典型的內(nèi)容搜索流程:用戶在這個流程中經(jīng)歷了四個步驟:  

點(diǎn)擊搜索按鈕?! ?/span>

看到loading動畫提示。  

看到了搜索結(jié)果中的文字內(nèi)容;

這時圖片還在加載?! ?/span>

看到全部圖文內(nèi)容?! ?/span>

顯而易見,比起從第一屏開始經(jīng)歷一段等待時間然后突兀的直接進(jìn)入第四屏,將流程分為幾個短暫的步驟并給予狀態(tài)反饋的用戶體驗要好的多。即使中間耗費(fèi)了同樣的時間,分步的設(shè)計方案也可以使應(yīng)用的性能在感覺上更加流暢高效?! ?/span>

另外一個典型的情景是應(yīng)用剛剛啟動的時候。首先顯示一張適合該應(yīng)用風(fēng)格和布局的圖片,會降低用戶對加載時間的感知;同時配合loading動畫提示一起使用的話,效果會更好。

B.優(yōu)化UI元素任何一個UI元素都會影響到產(chǎn)品整體的性能表現(xiàn),每個點(diǎn)滴之處的優(yōu)化工作都可以對性能的提升起到推動作用??梢灾攸c(diǎn)關(guān)注以下幾個方面:  

元素的類型:不同類型的UI元素對產(chǎn)品性能的影響程度也不同;優(yōu)化工作可以按照一定的優(yōu)先級進(jìn)行,例如可以集中資源首先處理那些音頻、視頻、地圖等類型的媒體文件?! ?/span>

元素的規(guī)格特性:拿圖片文件來說,分辨率或色深會對渲染時間造成影響。在Android中,任何可繪制資源(jpg、png)都會被解碼為位圖格式。所以,每一張在分辨率或色深方面經(jīng)過優(yōu)化處理的圖片都可以節(jié)省出幾KB的樣子?! ?/span>

元素的輸出方式:這方面可以針對具體情況做不同的處理,例如對于需要一整張圖片作為背景的應(yīng)用來說,如果主要內(nèi)容部分有自己的非半透明背景樣式,那么大背景圖片就沒有必要全部輸出了。

image.png

5.定義界面元素的權(quán)重規(guī)則精心打造設(shè)計方案的過程,就好像在一片充滿障礙物的陸地上進(jìn)行探索;我們必須時刻對功能、外觀、可用性、性能表現(xiàn)等方面的因素進(jìn)行權(quán)衡和取舍。對于某些系統(tǒng)平臺來說,設(shè)計師要做更多的妥協(xié)。然而,無論系統(tǒng)方面具有怎樣的限制,產(chǎn)品都必須保持自身的品牌特色?! ?/span>

我們可以通過一定的方法來判斷UI元素之間的重要程度關(guān)系。有些元素對于品牌效應(yīng)的貢獻(xiàn)程度是很大的,而合理的移除那些相對次要的元素,也是提升產(chǎn)品性能的有效方式。我們的團(tuán)隊從這個角度對UI元素進(jìn)行了如下分類:

必不可少的:最能體現(xiàn)品牌特征的核心UI元素,例如包含了logo和產(chǎn)品名稱的標(biāo)題欄。具有可替代性的:在相對高端的設(shè)計方案中,這類元素可以由性能負(fù)載相對較低的輸出方式代替。例如去掉標(biāo)題欄的半透明效果。

非必要的:這類元素通常用來增強(qiáng)用戶體驗,在必要的時候可以簡化或移除。例如將搜索結(jié)果條目的數(shù)量由25個減為10個。

6.使用信息面板團(tuán)隊之間的信息溝通,對于打造成功的產(chǎn)品來說是必不可少的。我們經(jīng)歷過的很多項目中,設(shè)計、開發(fā)、市場等部門的相關(guān)人員對同一款產(chǎn)品的理解有著很大的不同。從不同職能角度出發(fā)的各種功能需求與資源限制都會影響到最終產(chǎn)品的性能表現(xiàn),所以保持信息溝通的順暢是很重要的。  

信息面板是一種用于增強(qiáng)團(tuán)隊間交流溝通的解決方案。它可以幫助我們對產(chǎn)品當(dāng)前的狀態(tài)進(jìn)行度量和監(jiān)測,并設(shè)定下一階段的目標(biāo);一目了然的呈現(xiàn)方式更加便于團(tuán)隊之間對產(chǎn)品狀態(tài)、功能預(yù)期和設(shè)計開發(fā)重點(diǎn)等方面的信息進(jìn)行及時的交流?! ?/span>

我們通常在信息面板中標(biāo)識以下幾個方面的因素:

核心功能需求:列出用戶在使用產(chǎn)品時將要經(jīng)歷到的核心功能。

基準(zhǔn)評分:列出重點(diǎn)競爭對手的同類產(chǎn)品在這些核心功能方面的性能表現(xiàn)數(shù)據(jù)。

當(dāng)前完成度:列出自己的產(chǎn)品在當(dāng)前階段中在這些核心功能方面的性能表現(xiàn)數(shù)據(jù)。

目標(biāo):列出自己的產(chǎn)品在這些核心功能方面的目標(biāo)期望。

進(jìn)展?fàn)顟B(tài):標(biāo)明產(chǎn)品的當(dāng)前狀態(tài)是否已經(jīng)達(dá)到了目標(biāo)期望。  

類似的方法和工具還有很多,包括Android SDK本身,或是TraceView等。

7.UI工程技術(shù)將優(yōu)秀的設(shè)計方案通過相應(yīng)的技術(shù)方法實(shí)現(xiàn)出來,也不是一件易事。除了忠實(shí)的還原設(shè)計方案之外,要使代碼同時可以帶來高效的性能表現(xiàn),通常需要專家級別的技術(shù)能力,尤其對于移動應(yīng)用產(chǎn)品來說,需要相關(guān)人員擁有豐富的前后臺開發(fā)經(jīng)驗,同時對視覺及交互設(shè)計等方面具有深刻的理解?! ?/span>

布局、圖像、動畫的輸出和實(shí)現(xiàn)方式都會牽扯到功效方面的問題;在選擇實(shí)現(xiàn)方案時,最好從一些具體的方面進(jìn)行考慮,例如:  

智能化的內(nèi)容加載:可以在合適的地方使用例如lazy loading這樣的方式,首先加載當(dāng)前可視部分的內(nèi)容,并通過用戶的瀏覽行為觸發(fā)其他內(nèi)容的加載。這種方式可以很有效的提升界面功效,使體驗更加流暢?! ”尘皥D形的加載:背景的實(shí)現(xiàn)方式對界面性能的影響也是很關(guān)鍵的;通常情況下,背景圖形可以通過整張大圖、小圖重復(fù)平鋪或純樣式代碼等方式實(shí)現(xiàn)。對于不同類型的界面,需要采用最合適的實(shí)現(xiàn)方式?! ?/span>

某些項目中,軟件設(shè)計和開發(fā)等相關(guān)部門對于一款產(chǎn)品的責(zé)任是分離的;這種情況下,最終產(chǎn)品的用戶界面在外觀及性能等方面的表現(xiàn)必然也是缺乏統(tǒng)一性的。因為每個團(tuán)隊都有他們各自的目標(biāo),所以在那些必須通力配合的地方,例如用戶界面性能優(yōu)化等方面,執(zhí)行力量往往無法集中。對于移動app開發(fā)這樣的情況,我們的一種解決辦法是,將前端開發(fā)方面的職能角色并入設(shè)計團(tuán)隊,這可以讓涉及到界面還原和前端效能等方面的開發(fā)工作更加符合用戶體驗設(shè)計的工作思路。