iOS平臺應用開(kāi)發(fā)的敏捷設計流程
本文翻譯自《Computer Arts》中對專(zhuān)注于iPhone和iPad應用開(kāi)發(fā)的設計師Sarah Parmenter的訪(fǎng)談錄,希望對iPhone應用開(kāi)發(fā)的朋友能有所幫助。
本文引用地址:http://dyxdggzs.com/article/201609/303650.htm以下為全部譯文:
對設計師來(lái)說(shuō),iPhone和iPad是全新的平臺。相比圖形和網(wǎng)站設計的經(jīng)驗積累,在iPhone和iPad上的設計進(jìn)化還都處于萌芽期。
在這里,Sarah跟大家分享了簡(jiǎn)單明了的火車(chē)時(shí)刻表軟件設計流程和基本原則,可能對你自己的設計項目有所啟發(fā)。為了簡(jiǎn)化過(guò)程,我們假設獲取火車(chē)運行數據的API是現成的。
1.首先,要確定你的創(chuàng )意還沒(méi)有人做過(guò)。如果你發(fā)現已經(jīng)有類(lèi)似的App,那你需要比它做的更好,有一些獨特的優(yōu)化設計。最好的調查方式是到iTunes Store上搜索已有的iPad程序。
2.當有了創(chuàng )意,你還需要有個(gè)明確的定位,它會(huì )在后續的設計過(guò)程中決定App的設計要點(diǎn)。App定位可以通過(guò)蘋(píng)果的人機界面指南(Human Interface Guidelines)圖來(lái)確定。

距離圖中坐標原點(diǎn)位置越遠的App,特點(diǎn)越明顯,越需要精美易用的界面設計,讓他們與其他競爭者明顯區分開(kāi)來(lái)。在這個(gè)案例中,我們把App定位在原點(diǎn)位置,即簡(jiǎn)單使用的輔助工具。
3.確定App定位后,接下來(lái)需要聚焦App的核心功能。在團隊合作設計時(shí),這一點(diǎn)尤其重要。團隊在提出各種功能需求時(shí),很容易陷入哪些功能要包含在第一個(gè)版本中的爭論。Apple把這個(gè)過(guò)程叫設計ADS(Application Definition Statement),或者叫設計精簡(jiǎn)的ADS。

4.走到這一步,很多人會(huì )認為對App的設計已經(jīng)想的很清楚,可以直接開(kāi)始設計圖形界面甚至編碼了。實(shí)際上,前面的過(guò)程,僅僅設計的導入階段。我們接下來(lái)要做的,是產(chǎn)品草圖設計。一般我們用紙和筆來(lái)畫(huà),它們是最簡(jiǎn)單,學(xué)習成本最低的工具。按照我們的設計經(jīng)驗,勾畫(huà)出用戶(hù)需要用到的界面,包括像按鈕之類(lèi)的界面交互元素;篩選出核心用戶(hù)最常用的,最適合移動(dòng)應用場(chǎng)景的功能。

5.我們要設計的是輔助工具軟件,通常,它只需要主界面,和一個(gè)在背面顯示相關(guān)信息的輔助界面,它通過(guò)信息按鈕觸發(fā)后翻轉顯示。如果你設計的是其他 App,可能還需要更多的界面。重點(diǎn)是要設計界面與界面之間的切換方式,這一點(diǎn)在設計交付給開(kāi)發(fā)人員時(shí)會(huì )顯得尤其重要。我們把這個(gè)過(guò)程叫做App功能穿越(App Functionality Walkthrough)。
6.現在,開(kāi)始App的低保真原型設計。重點(diǎn)是不要陷入過(guò)多的細節,低保真只是把你紙面上的草圖數字化,便于在電腦上持續的改進(jìn)。所以,盡量使用黑白,粗糙的線(xiàn)條和圖形來(lái)制作低保真,別在細節上糾結,浪費時(shí)間。

7.低保真原型完成后,開(kāi)始設計注重細節和精度的高保真原型。我使用PhotoShop,你可以選用自己熟悉的其他工具。一般,我會(huì )為iPad設置尺寸為1024X768的畫(huà)布,然后根據低保真原型進(jìn)行細節設計。
8.當我們設計App的主界面時(shí),顯示列車(chē)時(shí)刻表是設計的重點(diǎn)。它不需要包含所有功能,應著(zhù)重顯示列車(chē)到達時(shí)間,出發(fā)時(shí)間,列出延誤或者取消等必要信息。
9.鑒于A(yíng)pple提倡有質(zhì)感,有仿真度的圖形界面,我們讓App的界面設計盡量接近用戶(hù)熟悉的火車(chē)站時(shí)刻表。在配色上,使用灰色,黑色,亮黃和紅色,配合一些個(gè)性化的圖標來(lái)表示遲到和取消狀態(tài)。

10.很重要的一點(diǎn)是,App所展現的信息,必須簡(jiǎn)潔明了,沒(méi)有多余的文字。所以,在界面設計上,我們沒(méi)有引入任何華麗的圖形或者其他的信息來(lái)干擾用戶(hù),讓他們能一眼就看明白App的用途。在數據條目之間使用間隔色,用醒目的字體顯示到達和出發(fā)時(shí)間,這些都是很好的設計體現。主界面背后的相關(guān)信息界面,使用Apple的標準界面即可,為用戶(hù)提供搜索列車(chē)后加入關(guān)注的功能。
11.我使用了很多細微的漸變和一些材質(zhì),重要的是,確保所有的信息都一目了然,不隱晦,不誤導用戶(hù)。

12.現在可以開(kāi)始考慮icon的設計。這將決定App在A(yíng)pp Store上的辨識度。你可以從簡(jiǎn)單的輪廓設計開(kāi)始設計,先把核心創(chuàng )意表現出來(lái)。

13.除非有必要,你的icon最好不要包含文字,盡量使用跟你的App圖形界面一致的材質(zhì)和漸變。你如果想給用戶(hù)呈現高質(zhì)量的UI設計,別忘了把icon設計成29×29,72×72,和512×512三種尺寸。

14.如果你自己不開(kāi)發(fā)App的功能,還需要把清晰的設計指南交付給開(kāi)發(fā)人員。我會(huì )把界面和描述集中到一張大圖,并盡可能的把所有可遇見(jiàn)的情況都給開(kāi)發(fā)人員描述清楚。

15.最后,我們把低保真原型,所有的圖形界面設計圖(一般是PSD)和圖標打包在一起,做上清楚的標注,發(fā)送給開(kāi)發(fā)人員。有時(shí)候,你可能還需要對PSD進(jìn)行切圖,存成PNG,方便開(kāi)發(fā)人員直接使用。

評論