iPad應(yīng)用程序UI設(shè)計的五大要素
原創(chuàng)【51CTO譯文】我們介紹過如何在iPad上的進(jìn)行游戲設(shè)計，iPad的應(yīng)用程序UI設(shè)計非常出色。但是，你如何讓你的應(yīng)用融入iPad的風(fēng)格中呢？本文為http://mobile.tutsplus.com上一篇點擊非常高的文章《Top 5 Tips for Designing iPad Apps》，探討的五大要素有望幫助你設(shè)計出令人著迷的iPad應(yīng)用程序。
以下全部譯文：
1、自定義用戶界面完全可以，但要把它做好。
身為一名設(shè)計人員，我顯然完全贊同自定義用戶界面，但也明白在設(shè)計時很快就會偏離軌道!如果你想設(shè)計一個自定義用戶界面，就要關(guān)注以下幾個方面：
◆提供立即讓人沉浸于其中的體驗
Flipboard就是一個典例，這個應(yīng)用程序毫無傳統(tǒng)的導(dǎo)航設(shè)計，而是完全讓你沉浸在使用體驗中。你不會為沒有傳統(tǒng)的導(dǎo)航而感到惋惜，因為你直接進(jìn)入內(nèi)容。
◆多少的探索才算多?
自定義界面讓你可以通過所謂的分層布局(layered layout)來做許多很酷的事情，這時候布局的各個部分彼此獨立滾動。在一些情況下，只有用戶明白了這幾個層各自是如何移動的，所有內(nèi)容才顯露給用戶。所以，你要回答的問題是：你把多少內(nèi)容交給用戶去探索、去發(fā)現(xiàn)?
在Cool Hunting應(yīng)用程序中，用戶可以通過單指滑動操作，左右滑動頂部圖像，那樣可以顯示更多的圖像;如果你不單指滑動，不知道原來還有圖像在那里。至于上下滾動的文章區(qū)域，用戶可以通過單指滑動操作，上下滑動文本，但頂部圖像未必能夠這樣。
有什么解決辦法嗎?不斷嘗試。你問我花了多長時間才摸索出了通過單指滑動操作，左右滑動頂部圖像，可以顯示更多圖像?大概嘗試了一分鐘后吧。結(jié)果呢?我實際上驚喜地發(fā)現(xiàn)這個看圖功能，并不怪設(shè)計人員沒有把這個功能做得明顯些。
多個瀏覽選項
CNN應(yīng)用程序有一項很酷的特性，那就是能夠按住手指，并滑過底部的新聞報道，就可以預(yù)覽新聞報道標(biāo)題。太棒了!這使用戶不用老是按“返回”鍵，即可瀏覽所有報道。
2、指示說明盡量少些。
從設(shè)計的角度來看，iPad酷就酷在你有機會成為離經(jīng)叛道的人。用戶們在毫不猶豫地接受不使用“標(biāo)準(zhǔn)”導(dǎo)航操縱方式的應(yīng)用程序。訣竅在于設(shè)計出頗有吸引力的用戶體驗，又讓用戶可以輕松地操縱應(yīng)用程序。
你在嘗試采用“另類的”布局時，要考慮的首要方面之一就是：
盡量讓用戶不需要“幫助”。
這就意味著沒有幫助按鈕，沒有問號，沒有“i”信息按鈕。這一切統(tǒng)統(tǒng)都沒有。一種深思熟慮的設(shè)計不需要這些多余的信息(很多讀者看到這里可能不同意了)。
稍安毋躁，這并不意味著你不能給予“提示”。提示應(yīng)該是微妙的、與上下文相關(guān)的指點;那樣當(dāng)用戶在考慮下一步該怎么做時，能夠給予一點幫助。
3、要考慮到方向會改變布局。
將設(shè)計的應(yīng)用程序從縱向模式轉(zhuǎn)換成橫向模式(或者反過來)很麻煩。這簡直好比是設(shè)計一個全新的應(yīng)用程序，至少從布局的角度來看是這樣。這方面要記住的關(guān)鍵一點就是，不要改變用戶體驗!
比如說，不是許多應(yīng)用程都像Note Taker應(yīng)用程序這樣能夠在這兩種模式之間輕松自如地轉(zhuǎn)換，這個應(yīng)用程序幾乎做到了精確匹配：
Cool Hunting應(yīng)用程序是一個更常見的例子，它表明了基于內(nèi)容的應(yīng)用程序如何從網(wǎng)格視圖轉(zhuǎn)變成列表視圖。它并沒有顯著改變用戶與應(yīng)用程序的交互方式：
4、別忘了動態(tài)內(nèi)容會影響設(shè)計!
在裝入動態(tài)內(nèi)容的應(yīng)用程序中，你總是一定要留意每當(dāng)打開應(yīng)用程序時，動態(tài)內(nèi)容可能會怎樣改變用戶的體驗。CNN應(yīng)用程序就是一個典例，它表明了兩點：
◆凌亂的界面
◆很好的英雄圖像
界面自己是不會隨機應(yīng)變的。界面看起來與新聞報道一樣混亂，圖像彼此緊挨著，新聞標(biāo)題實際上很難看到。你在處理動態(tài)內(nèi)容裝入時，要給它一些充分伸展的空間。你從來不知道界面內(nèi)容每天會有怎樣的不同，所以應(yīng)該從文案/圖像的角度來考慮絕對***值，以便為可能要出現(xiàn)在界面上的任何一種內(nèi)容留出足夠空間。
另外就是英雄圖像。我不確信下面屏幕上的界面是不是純屬巧合，但你的眼睛肯定被紅色的英雄圖像所吸引。第二大關(guān)注的是那位女性的紅色上衣。想一想動態(tài)裝入的圖像可能會引起用戶的眼球出現(xiàn)怎樣的移動。
有什么解決辦法嗎?創(chuàng)建吸引注意力的圖形內(nèi)容，覆蓋裝入到應(yīng)用程序中的任何圖像。CNN試圖用“頭條報道”通欄標(biāo)題來達(dá)到這種效果，但通欄標(biāo)題彈出來后還是蓋不住大大的英雄圖像。
5、深入用戶的內(nèi)心。
這對任何開發(fā)人員、設(shè)計人員、甚至用戶界面專家來說都是最困難的任務(wù)之一!但是它對iPad應(yīng)用程序來說又顯得特別重要;因為對iPad應(yīng)用程序而言，用戶界面不是很標(biāo)準(zhǔn)化。預(yù)測用戶的下一步操作可能困難重重，不過我倒是有個訣竅，對各位讀者可能大有幫助。
我們假設(shè)你設(shè)計了一款應(yīng)用程序，可以幫助人們找到有猴子的動物園。你測試了用例場景，甚至知道你的目標(biāo)受眾確確實實喜愛猴子。下一步就是，根據(jù)這些用戶會如何與應(yīng)用程序交互、找到喜愛的猴子，繪制場景和線框。
你繪制好了線框，并把線框添加到墻壁上。它看起來確實很好。一切都沒問題——你覺得“我完成了!”。下面告訴你這個寶貴的要點。
兩天內(nèi)不要去碰這個想法!
說真的，不要去碰它，不要去想它，不要通過郵件來表述。從你的詞匯表中刪掉“猴子”這個字眼。OK，這是有那么一點愚;但問題是，除非你有了全新的眼光，否則就無法深入用戶的內(nèi)心。
而我們根本不會有什么全新的眼光，但我自己在設(shè)計應(yīng)用程序時發(fā)現(xiàn)：如果暫時放下手頭的設(shè)計項目，把注意力放到其他事情上，能夠讓我更快地繞過思路上的障礙，站在用戶的角度來看待應(yīng)用程序。
【51CTO譯稿，非經(jīng)授權(quán)謝絕轉(zhuǎn)載，合作媒體轉(zhuǎn)載請注明原文出處、作者及51CTO譯者！】
【編輯推薦】
