網(wǎng)頁端搜索引擎的簡單易用一直是網(wǎng)頁產(chǎn)品設(shè)計中的優(yōu)秀范例。 它巧妙地利用大片留白，一個搜索框入口，鏈接排布形式和品牌LOGO的互相搭配，在一個頁面里為用戶提供了絕佳的用戶體驗。強大的產(chǎn)品特性也使其成為上網(wǎng)沖浪必不可少的工具之一，幫助用戶挖掘到未知的網(wǎng)絡(luò)世界。

隨著移動互聯(lián)網(wǎng)的快速發(fā)展，移動信息量也迅猛膨脹，用戶對手機搜索引擎的需求也與日俱增。因此搜索引擎也紛紛開始醞釀自己的手機產(chǎn)品。和PC機相比，手機端硬件更加局限，使用場景更加多樣，交互形式更加豐富，因此簡單的網(wǎng)頁頁面移植已經(jīng)不能滿足用戶對于手機搜索引擎的需求。所以簡單頁面也開始了華麗變身，紛紛設(shè)計了自己的獨立客戶端。 當(dāng)將簡單的頁面轉(zhuǎn)變?yōu)榭蛻舳塑浖�時，應(yīng)該如何設(shè)計呢？下面將會為您逐步揭曉這些產(chǎn)品設(shè)計的攻略。

“組織”產(chǎn)品架構(gòu)，讓品牌特性凸顯出來

移動客戶端的設(shè)計和網(wǎng)頁設(shè)計不同。由于屏幕大小的限制和移動端性能的影響，產(chǎn)品的結(jié)構(gòu)和網(wǎng)頁相比會更復(fù)雜， 層次也會更多。產(chǎn)品將面臨的挑戰(zhàn)是：用戶已經(jīng)習(xí)慣了網(wǎng)頁排布的使用方式，他們不愿意花費精力去適應(yīng)一款全新交互的產(chǎn)品。那么當(dāng)把搜索引擎從PC端移植到展現(xiàn)形式多變的手機端時，如何組織這些結(jié)構(gòu)和層次，讓用戶能夠迅速地摸清產(chǎn)品結(jié)構(gòu)，清晰感知它的品牌特點，就尤為重要。

Google的產(chǎn)品架構(gòu)主要由4個大部分構(gòu)成，如上圖所示： 搜索區(qū)域， 更多應(yīng)用程序入口， 分類切換以及瀏覽工具欄。與網(wǎng)頁相比，產(chǎn)品的組織結(jié)構(gòu)更多，客戶端不能再使用網(wǎng)頁端全局靜態(tài)留白的布局形式。但是設(shè)計師巧妙地利用了手勢操作進(jìn)行層與層之間的疊加變化，為搜索區(qū)域搭配出了和網(wǎng)頁端幾乎相同的布局形式。“Google化”的組織方式，讓用戶在初次使用手機Google搜索產(chǎn)品時就能共用網(wǎng)頁端的心智模型，減少了學(xué)習(xí)成本。

Bing的移動搜索客戶端組織方式不僅延續(xù)了它在網(wǎng)頁上的布局特色，而且也突出了其極具品牌特色的Daily Picture 服務(wù)（每日圖片推送）。 通過每天向客戶端推送一張高清精美圖片， 配合著圖片上的附注信息， 加強了客戶端與用戶的互動性，同時也通過其提高了用戶對軟件的期待度與黏性（比如用戶會有期待：明天的圖片會是什么呢？ 我一定要記得看看） 。

其次Bing 的一些細(xì)節(jié)上的配色使其非常具有自身移動平臺Windows Phone 7的特色。 如上圖所示的設(shè)置頁面， Bing將iOS上的Navigation Bar和List的樣式進(jìn)行了重新組織布局， 和右圖WP7的界面對比，是不是有異曲同工之妙呢？這樣的組織設(shè)計，抓住了品牌擁護(hù)者的使用習(xí)慣，也從產(chǎn)品設(shè)計上體現(xiàn)出了自身的特點。

標(biāo)簽： 交互設(shè)計 手機交互設(shè)計 單頁面設(shè)計 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。