張鵬

北京信息科技大學(xué)

?

淺談項目設(shè)計中的移動UUII設(shè)計

張鵬

北京信息科技大學(xué)

摘要：要想做一個軟件的圖形界面設(shè)計之前一定要想明白一個問題，就是這個軟件做什么的，支持什么活動，解決什么問題，能提供什么價值。而且一定要明白用戶喜歡什么樣的操作，討厭什么樣的操作。所以，一定要研究你的用戶，研究用戶的任務(wù)，觀念?？紤]功能，最后才是界面。不要讓用戶做不自然的事。

1　uuii概述

UI 即是User Interface，其中包括所有人(User)與機器(Machine)打交道用的界面接口(Interface)。因此，如果你去設(shè)計一個起重機的操作面板、汽車儀表盤、電視搖控器，都可以稱為UI Design，他是工業(yè)設(shè)計中的一個術(shù)語。GUI 是Graphical User Interface的縮寫。是指在計算機(computing)出現(xiàn)后，在屏幕上使用圖形界面來幫助(User)與機器(Machine)打交道用的界面接口(Interface)，泛指在計算機上所做的界面設(shè)計。他們之間非常形象化的理解就是“遙控器屬于UI但是不屬于GUI。”

1.1UUII特性

UI是一種結(jié)合計算機科學(xué)、美學(xué)、心理學(xué)、行為學(xué)以及各商業(yè)領(lǐng)域需求分析的人機系統(tǒng)工程。它強調(diào)人、機、環(huán)境三者合為一個系統(tǒng)的設(shè)計，用戶界面的設(shè)計將直接影響軟件的市場。

界面是用戶使用軟件的第一個窗口，所以用戶界面的設(shè)計是開發(fā)中重要的一個環(huán)節(jié)。

對于軟件來說，用戶界面是面向用戶的。用戶需要的是開發(fā)者開發(fā)的軟件滿足用戶自己的需求，并且易于操作、界面簡潔。用戶界面設(shè)計走到今天經(jīng)過千錘百煉，要想做到易于操作而且脫穎而出可謂是難于登天。太多的開發(fā)人員以為自己是藝術(shù)天才，不遵循用戶界面設(shè)計的標準去做產(chǎn)品。他們錯誤的認為使用一套復(fù)雜的顏色的方案或繁瑣的操作能夠征服使用者。結(jié)果往往是適得其反。好的軟件是用戶不用閱讀用戶手冊或接受培訓(xùn)就能應(yīng)用的應(yīng)用軟件。這一點得益于軟件界面設(shè)計的人性化。

1.2Ui之與運用關(guān)系

我們做一個軟件就好比要蓋一座房子。為了面朝大海，春暖花開；房前的小徑如何方便進出增加人們交往與偶遇的機會，房間的格局如何讓大人小孩都能各得其樂，窗戶朝向如何布局來增加光照，這一切都是交互設(shè)計要考慮進去的問題。朋友中有個笑話，說一個交互設(shè)計師朋友去人家里做客，幾句話之后，開始評價人家的燈和開關(guān)設(shè)計是否合理的問題。其實這中間體現(xiàn)的是一種信息架構(gòu)、交互流程的問題。

房子的外觀看起來什么樣，營造出什么樣的視覺體驗，地板和門應(yīng)該是什么顏色才能顯得高端大氣，這是視覺設(shè)計要考慮的問題，布局、色彩、圖標等等。一座房子和人發(fā)生關(guān)聯(lián)的部分就是界面。即是User Interface就是用戶界面。顯然，這樣的接口需要交互和視覺的共同支持。

有人經(jīng)常會問：“交互設(shè)計和視覺設(shè)計是完全獨立的么？”答案是否定的。

蓋房子是個系統(tǒng)工程，交互和視覺都是其中一部分。交互設(shè)計師心中要有視覺映像，視覺設(shè)計師頭腦中要有流程和架構(gòu)，越是資深的設(shè)計師，這兩方面越是融合在一起，因為，原本的目的就是要蓋房子。我們的本質(zhì)是蓋出一所結(jié)實耐用的房子，不是華而不實的棚子。所以交互和視覺越是融合的密不透風越是精妙絕倫，所以說他是完全獨立的說法是不對的。現(xiàn)實中開發(fā)人員來說不要舍本逐末，為了華麗而放棄使用本身。我們要在保證實用前提下在為其搭建漂亮的外衣。

2　移動ui設(shè)計

移動UI是UI的一個分支，移動UI設(shè)計是可移動的操作操作系統(tǒng)和其UI設(shè)計的人機交互、操作邏輯、界面美觀的整體設(shè)計。置身于操作系統(tǒng)中人機交互的窗口，設(shè)計界面必須基于操作系統(tǒng)的物理特性和軟件應(yīng)用特性進行合理的設(shè)計。好的移動UI設(shè)計不僅能讓軟件變得有個性有品位，還能讓軟件的操作變得舒適、簡單、自由，充分體現(xiàn)軟件的定位和特點。

2.1移動ui設(shè)計細節(jié)

移動UI設(shè)計的特點是“小巧輕便”及“通信便捷”，這兩個特點決定了移動UI設(shè)計與其他UI設(shè)計的不同。以下給出的是實際移動UI設(shè)計中不可忽略的幾個的設(shè)計細節(jié)：

2.1.1盡量減少文字的輸入

因為移動端在輸入的低效性，在設(shè)計的過程中，應(yīng)盡量減少用戶的輸入，如果可能設(shè)為可選項，讓用戶選擇。

2.1.2結(jié)構(gòu)合理，邏輯清晰

由于手機屏幕相對較小，只能展示較少的信息量。只能有清晰的信息架構(gòu)。

2.1.3考慮移動端操作方式

考慮單手操作問題，要方便手勢翻頁，能否單手操作完成。

2.1.4考慮APP UI的操作方式與操作系統(tǒng)兼容現(xiàn)在移動端的操作系統(tǒng)主要有window，Android，iPhonnee OOSS

這幾款主流操作系統(tǒng)占有巨大的市場份額，要充分考慮到和操作系統(tǒng)的兼容性問題。

2.1.5考慮觸摸的問題現(xiàn)在的移動端大多數(shù)都是觸摸屏，所以設(shè)計時要充分考慮

堅持為觸摸而設(shè)計的理念。

2.1.6流暢性、響應(yīng)性考慮到應(yīng)用交互的手勢的流暢性，及反饋用戶的響應(yīng)速度

例如：一款計算軟件要3秒計算完結(jié)果并輸出，但是在這3秒內(nèi)并無任何反饋。在這3秒內(nèi)用戶不知道自己是否完成操作，而處于一種不安的狀態(tài)下。而另一款要6秒才能計算完，可是它卻在下一秒馬上反饋用戶讓用戶等待。這兩種情況用的情緒是不一樣的，第二種的做法對用戶更友好。

2.1.7考慮中斷問題考慮應(yīng)用的使用情景，確保在被中斷的情況下，能讓用戶恢復(fù)之前的操作，保留用戶勞動的付出

2.2移動ui設(shè)計總述

一個軟件，特別是對于應(yīng)用軟件來說，界面不需要太華麗。過于華麗的界面容易使人視覺疲勞，讓人心煩氣躁，把注意力過多的集中在花哨的圖案和顏色上，反而影響軟件的可信度和實用性。因此，界面設(shè)計的需要合理布局和友好的界面將會為軟件加分不少。要注意整合相似的功能，避免零碎UI；明確適用人群而不是所用用戶；用直接操作代替多個菜單。

要想做一個軟件的圖形界面設(shè)計之前一定要想明白一個問題，就是這個軟件做什么的，支持什么活動，解決什么問題，能提供什么價值。而且一定要明白用戶喜歡什么樣的操作，討厭什么樣的操作。所以，一定要研究你的用戶，研究用戶的任務(wù)，觀念?？紤]功能，最后才是界面。不要讓用戶做不自然的事，比如玩紙牌的時候需要翻頁。不要影響用戶，界面要促進學(xué)習，采用習慣的用法及模式。傳遞給用戶的是信息，而不是一推數(shù)據(jù)。要具有良好的響應(yīng)性，比起提高速度，成本低很重要。

界面布局一定要注意用戶注意力問題。用戶的注意力一般集中在光標閃爍周圍的一小塊地方，重要信息，或者提示信息不能跑太遠（頂部或者底部），注意力以外的地方很難被用戶觀察到。要建立視覺層次結(jié)構(gòu)，有邏輯關(guān)聯(lián)。采用高亮顯示重要信息時候，在顯示完畢，獲取注意后，要及時取消高亮效果，以免造成視覺干擾，獲取不到其他的信息。不要顯示很多雷同信息，不然信息會被淹沒?？偠灾换ピO(shè)計的初衷是讓用戶更便捷的使用產(chǎn)品。

程序響應(yīng)性要注意，冗長的操作要有真實的進度操作，而不是虛假的。要讓用戶有可以停止的權(quán)力，防止用戶陷入無限的等待。不要給用戶提前加載不完全界面，哪怕只是幾秒，不要給用戶自己的設(shè)備不能完美兼容這個產(chǎn)品的錯覺。

2.3移動UI設(shè)計的幾個重要原則

2.3.1不能偏離用戶的任務(wù)

不能讓用戶像程序員一樣思考，要明白程序員花幾個小時的目的是讓用戶用幾分鐘的產(chǎn)品解決自己花幾個小時，甚至更長時間還有可能解決不了的事情。不要增加學(xué)習成本。用戶至上。

2.3.2減少不必要的操作

我們要不怕繁瑣的為用戶減少操作。要學(xué)會記錄用戶輸入的東西，避免再次輸入。要記住登錄只能有一次，但你可以多次授權(quán)。只讓用戶輸入必要的信息，其他信息然用戶自己高興的時候自己輸入，你可以適當?shù)慕o一些獎勵。但記住必要信息要和其他信息分開。不要讓用戶做出一些廢棄的選擇。不要讓用戶記憶東西，重要的說明，圖片，步驟要一直顯示，別指望用戶記住它。

2.3.3要讓用戶掌握控制權(quán)。要讓用戶有拒絕和選擇的權(quán)利。

2.3.4要注意權(quán)衡要權(quán)衡各個設(shè)計的統(tǒng)一性，權(quán)衡中要記住人的需求總是優(yōu)先于技術(shù)。

3　結(jié)語

整個移動UI的設(shè)計原則都是本著一條“用戶至上的原則”，所有的運用都是為了設(shè)計出來給用戶用的。只有那些能夠輕松的解決用戶痛點的設(shè)計才是完美的設(shè)計。這就是UI設(shè)計當中最重要的用戶原則。最后的總結(jié)是UI設(shè)計不一定是要你有多高的美學(xué)天賦多么強大的功能設(shè)計理念，而是要你能善于分析。你要能分析清楚你的用戶的群體，用戶的需求，用戶的理念，要做到以用戶為本。如果你在UI設(shè)計上做的不好，不一定是你的美學(xué)的天賦不夠高，也可能不是你的功能模塊建設(shè)的不夠周全，更有可能是你不善于分析你的用戶。美學(xué)素養(yǎng)可以靠后期培養(yǎng)，你的分析能力也是可以靠后天培養(yǎng)的。

參考書籍

[1]《UI黃金設(shè)計法則：觸動人心的100種用戶界面》拉杰.拉爾中國青年出版社。

[2]《影視特效在視覺設(shè)計中數(shù)字化運用研究》余曉妮常州大學(xué)。

[3]《信息界面中UI設(shè)計的優(yōu)化研究》方一平華東師范大學(xué)。

[4]《社交化電子閱讀軟件UI設(shè)計》柏鷹廣西師范大學(xué)。

鳴謝

特別鳴謝北京信息科技大學(xué)2015年人才培養(yǎng)質(zhì)量提高經(jīng)費（財務(wù)編號）支持

特別鳴謝朝陽區(qū)健翔橋家樂福肯德基餐廳對項目需求的提示完善和后期系統(tǒng)測試的幫助

特別鳴謝北京信息科技大學(xué)大學(xué)生科技創(chuàng)新組對本次創(chuàng)新項目的經(jīng)費支出和工作引導(dǎo)

特別鳴謝徐莉老師對本次項目開發(fā)的細心指導(dǎo)以及論文修改各方面的全面負責

特別鳴謝周文猛，唐朝，劉占奇，高安諾幾位組員對本次開發(fā)項目的支持和共同奮斗