工業(yè)產(chǎn)品展示軟件界面設(shè)計研究

張雪雙 劉李明 史倩云

摘 要 面對工業(yè)的發(fā)展以及產(chǎn)品和技術(shù)的不斷更新，工業(yè)產(chǎn)品的智能化與自動化已被廣泛應(yīng)用。這些變革也正驅(qū)使著產(chǎn)品需要一個有效的展示平臺。本文通過對產(chǎn)品展示軟件這一平臺的界面布局進行研究，對于界面的引導(dǎo)性和帶給人的印象深度進行科學的分析，進而總結(jié)出美學與科學相結(jié)合的界面布局，突出產(chǎn)品特色，傳遞產(chǎn)品理念，進而吸引更多的用戶。

關(guān)鍵詞 產(chǎn)品展示平臺 界面布局 視覺引導(dǎo)

中圖分類號：TP31 文獻標識碼：A

Industrial Products Show Software Interface Design Research

ZHANG Xueshuang, LIU Liming, SHI Qianyun

(Industrial Design Department, School of Mechanical Engineering,

Jiangsu University of Science and Technology, Zhenjiang, Jiangsu 212003)

Abstract With the development of industry and the products and technology constantly updated, the products of industry intelligence and automation has been widely used. These changes are driven products need to be an effective display platform. This article through to the products show the platform of the software interface layout, the leading and bring about the interface impression of depth by scientific analysis, and sums up the combination of art and science interface layout, outstanding product features, the transfer product idea, and attract more users.

Key words Product exhibition platform; Interface layout; Visual guide

隨著科學技術(shù)的不斷發(fā)展和信息技術(shù)的廣泛應(yīng)用，數(shù)字化產(chǎn)品、軟件開發(fā)已隨處可見。對此，產(chǎn)品展示軟件界面設(shè)計更是應(yīng)該得到重視和創(chuàng)新。通過對產(chǎn)品設(shè)計師等相關(guān)人群使用的新型軟件界面布局的研究和分析，以提高設(shè)計人群對產(chǎn)品展示平臺的認識和重視。進而展現(xiàn)產(chǎn)品魅力，制造無限商機。

1 工業(yè)產(chǎn)品展示平臺

展示平臺多種多樣，工業(yè)產(chǎn)品展常見的示方式有展廳展示、Web網(wǎng)站展示、軟件平臺展示等，它們不僅擁有自己的特色，同時還要統(tǒng)一根據(jù)產(chǎn)品的特殊功能、使用方式、色彩搭配、使用環(huán)境等因素來將平臺配合產(chǎn)品展示。具體產(chǎn)品展示平臺類別概況及關(guān)系總結(jié)如圖1。

展廳展示，就是在相對獨立的空間內(nèi)將所設(shè)計的產(chǎn)品通過展板、實物模型等方式展示供觀賞者欣賞與評價。展廳布置同樣需要專業(yè)知識和科學理論。展品的擺放、展廳的設(shè)計、整體環(huán)境和氛圍的營造都是影響產(chǎn)品展示的重要方面。其優(yōu)點在于讓受眾“零距離”走進產(chǎn)品和公司文化，讓別人欣賞、觸摸、購買產(chǎn)品，可以說最直觀、高效的產(chǎn)品展示方式。但是對于現(xiàn)今的網(wǎng)絡(luò)及信息化時代，展廳展示不排除有地域局限及信息擴展度小等弊端。

網(wǎng)站展示平臺，信息量大，更新及時，能夠塑造品牌形象，傳遞面極廣。不僅符合現(xiàn)今生活的高效準則，更是一種內(nèi)容豐富并且容易掌控管理的交流平臺。對于工業(yè)產(chǎn)品的推廣，這一平臺高效且方便。網(wǎng)站的界面設(shè)計，一般在內(nèi)容上較為豐富，但是對于產(chǎn)品展示的網(wǎng)站應(yīng)該有較新穎的元素和較強的視覺沖擊以達到吸引消費者的眼球，內(nèi)容量適度，信息傳遞明確即可。

軟件展示平臺，種類繁多，特別是虛擬現(xiàn)實技術(shù)的應(yīng)用，為我們提供集圖片、動畫、可交互式應(yīng)用程序于一體的開發(fā)平臺。使得我們面向特定受眾定制相應(yīng)的展示平臺成為現(xiàn)實。以面向設(shè)計產(chǎn)品展示平臺為例。如圖2。

通過這類軟件不僅能夠全面了解產(chǎn)品信息，更能從產(chǎn)品的形態(tài)、色彩、材質(zhì)等變化上進行對比和改進，可以很好地用于產(chǎn)品設(shè)計的方案展示與評價，虛擬現(xiàn)實，身臨其境。但是，工業(yè)產(chǎn)品展示軟件平臺集文字、圖片、聲音、動畫、交互程序于一體。為了更加合理、有效地傳遞所要展示的信息，界面設(shè)計在軟件使用和操作上的要求尤為重要。只有將界面的圖標、布局、特效等很好的應(yīng)用到軟件中才能將交互實現(xiàn)，進而完成產(chǎn)品展示的整個過程。

2 界面設(shè)計中的視覺引導(dǎo)與印象深度

2.1 界面設(shè)計中的視覺引導(dǎo)

面對某一界面，視線首先會落在何處？是什么元素吸引了人們的視線？接下來又要看向何處？這些問題就與“視覺引導(dǎo)”①相關(guān)。視覺引導(dǎo)指引用戶更好地去了解產(chǎn)品，了解其內(nèi)容以及所要表達的含義。它就好比指示路標，在人們迷失方向時，給予正確的引導(dǎo)。

在界面設(shè)計中，視覺引導(dǎo)這一應(yīng)用，是主次分明且順暢的引導(dǎo)方式，能夠順利地引導(dǎo)用戶視線在頁面上移動。從而產(chǎn)生有規(guī)律的視覺方向，避免了視線在各種各樣的元素之間隨意跳轉(zhuǎn)，使用戶的注意力能夠有意識的投注在目標物上。這種有效的“干擾”，為用戶提供了更好的選擇，方便了用戶更好地去了解產(chǎn)品所傳達的信息。

視覺引導(dǎo)在界面的設(shè)計中起著不可替代的作用。在工業(yè)產(chǎn)品軟件展示平臺的界面設(shè)計中，如何正確地使用視覺引導(dǎo)使軟件的界面準確地表達產(chǎn)品所包含的內(nèi)容以及內(nèi)在涵義，是值得我們深思的問題?，F(xiàn)今我們看到的展示界面一般都呈現(xiàn)了大量的信息，而這些信息通常都不分主次，導(dǎo)致人們接受信息的思維被打亂，最終影響產(chǎn)品的展示。通過文獻以及實驗研究發(fā)現(xiàn)，一般用戶的視覺習慣為：左上角優(yōu)先，從左到右、從上到下。這就是我們常說的古騰堡原則（The Gutenberg rule)，②如圖3、圖4。

2.2 界面設(shè)計中的印象深度

印象，一般是指接觸過的客觀事物在人的頭腦里留下的跡象。③印象深度即是留下跡象的深淺程度。假如一樣事物讓人印象深刻，那么這樣事物肯定存在著讓人回味的內(nèi)容。什么樣的內(nèi)容會讓人留下深刻的印象呢?通過經(jīng)驗學習和實踐調(diào)查總結(jié)概括出兩個主要方面：風格和個性。

2.2.1 風格

風格，是從事物的整體出發(fā)，表現(xiàn)出來的一種帶有綜合性的總體特點。風格是識別和把握作品之間區(qū)別的標志。對于產(chǎn)品展示軟件界面設(shè)計，風格，講求的是界面給人的整體印象，比如簡潔、理性、可愛、時尚等。界面風格的體現(xiàn)靠的是設(shè)計者對色彩、圖形以及意境的把握。設(shè)計者通過對界面色彩、圖形、整體色調(diào)等方面進行協(xié)調(diào)、統(tǒng)籌兼顧，并進行相應(yīng)的設(shè)計表現(xiàn)，使界面能夠在整體上顯示其一致性但又不失其韻味。風格對于工業(yè)產(chǎn)品展示軟件界面設(shè)計來說，是其成功的必要條件之一，界面設(shè)計要體現(xiàn)一定的風格才可以使人印象深刻，從而影響消費者心理，進而產(chǎn)生購買欲望。

2.2.2 個性

個性即個別性、個人性,個性化是人的存在方式。④對于界面來說，個性相當于界面的特色，也是界面能夠給人留下深刻印象的方式。相對于風格而言，個性追求的是產(chǎn)品界面的閃光點，是作品與眾不同的地方。個性是在整體風格基調(diào)的基礎(chǔ)上，突出局部特征，展示特有內(nèi)容。在界面設(shè)計中，大多優(yōu)秀案例都各具特色或個性鮮明。這些特色、個性大多體現(xiàn)在圖標、按鈕、操作方式等細節(jié)上。帶有設(shè)計者獨特創(chuàng)意的圖標設(shè)計、操作方式設(shè)計、人與產(chǎn)品界面間的交互方式設(shè)計等都能夠?qū)缑娴某蓴∑鸬疥P(guān)鍵性的作用。將獨特的創(chuàng)意融入到整體風格之中，不僅能夠引人入勝，更讓人印象深刻。

3 工業(yè)產(chǎn)品展示軟件界面布局設(shè)計

沒有規(guī)矩，不成方圓。界面布局的原則和方式就是界面設(shè)計中的“規(guī)矩”。把握好規(guī)矩，對界面進行合理的布局，會讓用戶對產(chǎn)品的使用產(chǎn)生愉悅、舒適的感覺。在產(chǎn)品展示軟件界面中，合理的布局能夠使軟件便于用戶控制以及操作，還能夠更好地使所展示的產(chǎn)品語意得到表達。良好的界面布局是優(yōu)秀界面實現(xiàn)的基礎(chǔ)。每一個優(yōu)秀的軟件界面，都是通過類似的精心設(shè)計和綜合考慮才達到理想的界面布局效果。

3.1 工業(yè)產(chǎn)品展示軟件界面布局設(shè)計基本方式

3.1.1 簡潔性布局

說到簡潔性，KISS（Keep It Simple And Stupid）原則⑤就是一個比較合理且通用的原則，簡潔和易于操作才能讓體驗者感受到軟件的可用性和合理性。簡潔不是盲目的簡單，更不是隨意的設(shè)置。這種原則同樣需要我們上面所分析的視覺引導(dǎo)和印象深度來支配布局。適度的留白，合理分配板塊大小，面板整體錯落有致而不單調(diào)死板等，都是設(shè)計一款簡潔性界面時所需要考慮的重要因素。簡約極致的風格往往給人以舒適、開闊、干凈和清新的感覺。這類風格的界面設(shè)計，關(guān)鍵在于注重保持外邊緣的水平或垂直，盡量不用鋸齒形的邊緣，更不要采用圖片重疊的方式，否則會使版面變得更加復(fù)雜。就現(xiàn)今的界面設(shè)計趨勢來看，簡潔性界面布局已經(jīng)越來越受用。

3.1.2 協(xié)調(diào)一致性布局

一個統(tǒng)一協(xié)調(diào)的界面設(shè)計，會給用戶以舒適、和諧的感覺。同時，界面整體風格的一致性，往往在視覺引導(dǎo)上起到自然過度的作用，也會將印象深度提升，給人以直觀，明確的感覺。在風格設(shè)計上已經(jīng)具備了基本的協(xié)調(diào)一致性，只需進一步深化和提升。而對于個性化的設(shè)計，在給人以新鮮感和視覺沖擊效果的同時，同樣需要遵循整體協(xié)調(diào)一致性原則，只是將局部個性鮮明即可。只有按照這種原則設(shè)計界面才不會讓整體看起來雜亂無章，即使在內(nèi)容和圖片都很豐富的情況下也同樣如此。正如圖5所示的XBOX studio軟件界面設(shè)計，整體風格極具時代感，布局清新爽朗，從每一個詞條到圖片的擺放，從每一個功能按鈕到板塊的規(guī)則性布置，都能主次鮮明，協(xié)調(diào)一致。

3.1.3 突出重點布局

在進行界面布局的過程中，合理排布各種信息，在繁雜的信息中突出重點，是布局的重要一步。在產(chǎn)品展示軟件界面設(shè)計中，如何使主要內(nèi)容一目了然，同樣需要設(shè)計師的精心安排。首先，將展示的內(nèi)容置放于用戶的視覺中心，使使用者能夠在第一時間了解到產(chǎn)品所要傳達的信息；其次，可以通過一定的對比方式來突出重點，比如框架分割大小對比、排布內(nèi)容的多少對比、色彩應(yīng)用對比等。突出重點的方法有多種，使用過程中需根據(jù)布局內(nèi)容而定。布局只有突出重點，才能夠使界面得到好的應(yīng)用，實現(xiàn)其功能性，從而起到信息傳遞的作用。強調(diào)重點、突出重點，界面布局才能夠主次分明，避免反復(fù)以及堆砌而造成的信息混亂。如XBOX studio軟件界面設(shè)計的布局，主要功能放置明顯位置，主要信息所占畫面的比例較大，使信息得到了很好的傳達。

總之，優(yōu)秀的軟件界面布局都是在遵循一定原則基礎(chǔ)上，根據(jù)自身需求和目的而設(shè)計的。工業(yè)產(chǎn)品展示軟件的界面設(shè)計更是需要在了解工業(yè)產(chǎn)品特色基礎(chǔ)上，通過軟件界面這一平臺將其展示和傳播。了解用戶的心理感受，抓住人們的視覺注意力，方便使用者快捷操作等，都是設(shè)計產(chǎn)品展示軟件界面布局所要了解和追求的。⑥

3.2 工業(yè)產(chǎn)品展示軟件界面設(shè)計實踐

首先，進行產(chǎn)品用戶分析、風格定位。然后，了解用戶需求，進行軟件功能設(shè)置。主要功能包括：產(chǎn)品設(shè)計說明（特色）、視圖（主、俯、側(cè)、尺寸工程圖）、形態(tài)（整體、細節(jié)）、材質(zhì)（金屬、塑料、木材、皮革等）、色彩、動畫展示、使用場景等。最后，將界面設(shè)計實踐。注重細節(jié)，考慮全面，在創(chuàng)新的基礎(chǔ)上，以上述理論為原則，把產(chǎn)品軟件界面設(shè)計出來。

4 結(jié)束語

現(xiàn)在已是網(wǎng)絡(luò)高速發(fā)展的信息社會，軟件產(chǎn)品已廣泛使用，所以，軟件的界面設(shè)計應(yīng)得到更多的關(guān)注與重視。工業(yè)產(chǎn)品展示軟件界面設(shè)計作為計算機科學與藝術(shù)設(shè)計等學科相結(jié)合的一個嶄新的研究領(lǐng)域和發(fā)展方向，其界面布局更是有著無限的研究和優(yōu)化空間。設(shè)計師需要從研究用戶心理出發(fā)，根據(jù)視覺引導(dǎo)規(guī)律，遵循形式美法則，優(yōu)化界面布局，使產(chǎn)品展示軟件界面設(shè)計走上更長遠的發(fā)展之路。

注釋

① AQ.視覺引導(dǎo):給視線加上路標[J].中國廣告,2002(10).

② 百度空間.包包.古騰堡原則（The Gutenberg rule)[EB/OL].[2009-05-27].http:

//hi.baidu.com/baozhipengwdz/blog/item/bc8933c6f6811a139d163db9.html

③ UCDChina.UCD火花集2：有效的互聯(lián)網(wǎng)產(chǎn)品設(shè)計 交互/信息設(shè)計用戶研究[M].人民郵電出版社 ,2011.5.

④ 劉松濤等翻譯.交互設(shè)計精髓[M].電子工業(yè)出版社,2008.11.

⑤ 馮麗霞,屈陽.論廣告英語的KISS原則的有效實現(xiàn)[J].商場現(xiàn)代化,2008(26).

⑥ 周陟.UI進化論移動設(shè)備人機交互界面設(shè)計[M].清華大學出版社,2011.1.