像個APP設(shè)計師一樣思考

uka
2 評論 5778 瀏覽 21 收藏 23 分鐘

uka導語:執(zhí)行力和自制力固然重要,但是首先需要有一種正確的思維方式,這也是人們更看重思辨能力的原因。作為一名移動產(chǎn)品設(shè)計師,如何適應APP設(shè)計世界的變化?下面推薦一篇可能會幫助到你改變思考問題方式的文章。你也可以在最下邊的評論區(qū)分享你的方法或建議。

移動產(chǎn)品設(shè)計沒有表面上那么簡單。我們需要對設(shè)備非常了解,甚至要改變思考問題的方式,這意味著丟掉我們從Web設(shè)計中學到的很多東西。

我跟很多設(shè)計師一樣從出版設(shè)計開始自己的事業(yè)。不久之后,我發(fā)現(xiàn)了令我著迷的網(wǎng)絡(luò)世界,并在某一時刻變成我的工作重心。在這個過程中我學習了在此之前完全陌生的交互設(shè)計和用戶體驗的概念。

某些時候,我感到自己被困在某種重復的工作循環(huán)里:我已經(jīng)找到了一種準則,一種使設(shè)計幾乎不出錯的方法,使我可以比之前更輕松更迅速的遞交每個新項目,但是用這樣或那樣的方式,所有的設(shè)計看起來都一樣。再此之后iOS和安卓的第一版本發(fā)布了。

隨后我的生活發(fā)生了出乎意料的變動,我開始專注于一些看起來完全不同的東西:移動App設(shè)計。那是我所需要的真正的挑戰(zhàn)。我不只要學習新東西,還要忘掉一部分我直到那時還在用的網(wǎng)站設(shè)計秘訣。

幾年以后,事實上是幾天前,蘋果智能手表新App發(fā)行,設(shè)計界百感交集。一方面,看到一個為新設(shè)計的出現(xiàn)提供了可能的設(shè)備。另一方面,理解一個史無前例的交互和用例的媒介令人望然生畏。

這不是我們第一次在市場上看到這樣的設(shè)備。但因為新技術(shù)越來越頻繁的需要新設(shè)計方法,我們必須適應這種越來越快的速率。

像智能手表一樣的新設(shè)備類別驅(qū)使設(shè)計師不斷的學習設(shè)計規(guī)范。

當然,第一個巨大的推動是20年前無處不在的第一批互聯(lián)網(wǎng)入口。在這以前,大多數(shù)像我一樣的設(shè)計師致力于出版行業(yè),互聯(lián)網(wǎng)的來到要求我們要學習怎樣設(shè)計交互媒體。用戶已經(jīng)變得不只是觀眾了。

這個轉(zhuǎn)型期某些比其他時期更困難,這就是為什么許多網(wǎng)站那個時候看起來像在出版物上面標記了按鈕——設(shè)計師并沒有立刻明白這種新媒介的特征。

BBC開發(fā)的App(左)和Hertz(右)與原生App相比更像網(wǎng)站,并且忽略一些移動設(shè)計慣例。

今天App發(fā)生了同樣的事情。經(jīng)常遇到像看起來像小網(wǎng)站的應用:他們構(gòu)建的應用像被轉(zhuǎn)譯到智能手機的網(wǎng)頁,在對比度、字體、觸摸目標、和手勢方面紛紛失敗。他們同樣沒有區(qū)分誰將用這個App,在哪里使用,在什么設(shè)備上使用。

當為移動設(shè)計時,需要脫離網(wǎng)站結(jié)構(gòu),因為它可能對我們不利。我們必須以一個不同的心態(tài)面對項目,并且為了充分發(fā)揮移動設(shè)備的優(yōu)勢和產(chǎn)出令人愉悅的體驗必須完全理解移動設(shè)備。

作為一個App設(shè)計師你需要做什么?除了知識和工具,你需要改變你想問題的方式。下面是為了適應App設(shè)計世界的幾條建議。

改變你的工作方式

現(xiàn)在每一刻都有上百App進入市場——你沒有時間去浪費。

作為專業(yè)人員,項目開始之前我們不再能花幾周或者幾個月的時間在新奇的設(shè)計細節(jié)上直到發(fā)現(xiàn)其他Apps已經(jīng)把這個問題解決了(并且更有可能的是用同樣的方法解決)。

在這里一種敏捷的的開發(fā)循環(huán)——精益用戶體驗(lean UX)的概念被引進而來。這種方法在持續(xù)迭代設(shè)計和發(fā)展中是必須的,保證了腦袋中只有一個關(guān)注點:用戶試用之前沒有什么是確定的。

Lean UX基于一個無限循環(huán)迭代的圈

因此,app設(shè)計不能從用Potoshop或者Illustrator的界面設(shè)計開始。在此之前需要畫線框圖原型。這樣的話,如果有變化只需要花費很短的時間而不是幾個月去實現(xiàn)。

設(shè)計師們一般傾向于從視覺設(shè)計開始:那是對我們來說最有意思的階段。某種程度上,我們通常習慣于這樣做因為這是唯一能力所及的。

近期與許多設(shè)計師聊天我建議他們項目開始的時候不用電腦工作,只需要在紙上畫。這聽起來太原始了以至于從未想過這種可能性。事實證明這樣設(shè)計有效防止我們被其他形式的可變因素干擾(比如設(shè)計文檔的大小,顏色和字體使用,等等)——可變因素和細節(jié)在項目開始的時候?qū)嶋H上限制了我們的創(chuàng)造力。

就個人而言,我發(fā)現(xiàn)在紙上速寫非常有用,因為我們只關(guān)注于想法和問題的解決上,防止在第一步就陷入考慮細節(jié)的陷阱。

“移動先行”,或者從小屏開始是一個很好的策略。即使你的App需要同時在智能手機和平板上運行,從比較小的手機開始設(shè)計更高效。從移動的立場開始設(shè)計使我們專注于區(qū)分優(yōu)先級,選擇并且首先改變習慣于以大屏幕的臺式電腦做為起點的心理結(jié)構(gòu)。

“移動先行”做為出發(fā)點基于為智能手機設(shè)計之后轉(zhuǎn)移到更大的屏幕。

第一次我用這種方法開始一個項目,我差點兒因為一個令人頭疼的事情結(jié)束了??赡苓@跟你第一次去體育館差不多情況;由于任務(wù)很難,肌肉還暫時沒有適應而受傷。如果你沒有完成它,改天再試。你會發(fā)現(xiàn)優(yōu)先級的變化,并且迅速察覺什么是你App中真正重要的東西。

你同樣可以對比帶行李箱旅行。如果你有一個小箱子,你會帶什么東西?你會帶最重要的,當然,是你確定旅途中會用到的東西,并且把其他東西丟掉。無論你相不相信,這個普通的例子與我們?yōu)橹悄苁謾C設(shè)計是類似的。

 

向另一半學習

一個App的成功與否取決于設(shè)計師和開發(fā)者,他們共同協(xié)作盡可能高質(zhì)量完成工作。為了高效工作,你可以通過并行工作縮短迭代周期。這樣你必須意識到設(shè)計和實現(xiàn)的復雜性。

一種實現(xiàn)方法是去學習使用開發(fā)工具,不需要從頭到尾開發(fā)App,但至少建立起可以如實和迅速的交流設(shè)計意圖的途徑。

我是唯一的設(shè)計師,許多開發(fā)者正在等我完成,就造成了很多瓶頸。

到巴塞羅那不久之后,我開始在技術(shù)創(chuàng)業(yè)公司工作。非常吃驚的發(fā)現(xiàn)我是那兒唯一的設(shè)計師——我簡直被開發(fā)者環(huán)繞這,一開始遇到的瓶頸是每個人都在等我去完成設(shè)計從而繼續(xù)他們自己的工作。

隨著時間的推移,我學會了使用像Xcode和其他基礎(chǔ)程序語言。這樣做,你會覺得辦公室所有都用同一種語言說話。設(shè)計師和開發(fā)者經(jīng)常用不同的詞語說同一件事使得理解變得困難。

 

意識到團隊合作的價值

稍往回一點兒看之前內(nèi)容,團隊合作絕不止分享辦公空間這么簡單。它包括了團隊成員合作和持續(xù)的溝通。精益App設(shè)計結(jié)束了那種一個人從他人結(jié)束的地方開始工作的串聯(lián)過程。

但事實上大多數(shù)團隊習慣于一種更加有效率的敏捷組合流程,開發(fā)者遵循一種敏捷化方法(在特定截止日期完成一個目標),設(shè)計師遵循精益方法(快速迭代,通常沒有一個特定截止日期)。

但是這里依然有瀑布開發(fā)的遺留,設(shè)計師通常比團隊其他人工作靠前一點兒,開發(fā)者當然可以在所有設(shè)計準備好之前開始。

這就是為什么App設(shè)計師必須意識到合作者特別是程序員是同盟不是敵人。一個更好更協(xié)調(diào)的結(jié)果是理解彼此并且培養(yǎng)一起工作的習慣。

我們經(jīng)常害怕分享我們的工作。我們某種程度上傾向于防備可能被提出的評論,特別是來自要接手的設(shè)計師的。事實上別人講的很多東西包括那些像程序員沒有設(shè)計背景的人的反饋對改進我們的提案非常重要。他們的視角通常比我們更實際,可以保證更好的平衡。

一個我方才拜訪過的公司的人員告訴我設(shè)計師和開發(fā)者在不同的樓層工作,通過不同版本的即時通訊系統(tǒng)溝通。我建議他們嘗試換一種方式:一個項目中的設(shè)計師和開發(fā)者應該安置在一起。幾個月之后他們告訴我產(chǎn)品質(zhì)量甚至團隊成員的關(guān)系都戲劇性的提高了。

 

用各種各樣的操作系統(tǒng)

當你設(shè)計移動應用的時候不能只參考自己的手機。如果你的目標是全球移動市場,你必須至少用包括Android, iOS 和 Windows Phone設(shè)備,并且不斷的習慣于使用他們完全明白每個平臺不同的使用場景。

事實上世界上的設(shè)計不從iPhone開始和結(jié)束。很多設(shè)計師把自己局限在iOS里面,當設(shè)計安卓的時候,他們只是轉(zhuǎn)譯——通常幾乎逐字逐句轉(zhuǎn)譯原始的App。

一個像tab一樣簡單的導航資源以不同形式應用于iOS,Android 和Windows Phone

交互模式(例如設(shè)計中已經(jīng)確立的解決問題的方法)在每個操作系統(tǒng)中是不同的。同樣的,設(shè)計師必須頻繁的換系統(tǒng)從而了解和正確的使用他們。

舉幾個例子,在每個操作系統(tǒng)中tab的位置,怎么樣去展示菜單,什么時候、怎樣展示首要和次要動作都是不同的。

你可以跟隨這里的幾個實用的小練習學習每個系統(tǒng)的模式:在不同的手機上下載和安裝同一App,并用仔細分析他們的異同;他們的模式將是不同的。所以,如果你發(fā)現(xiàn)一個App在iOS和Android看起來運行起來幾乎一樣,可能哪個做的不太正確。

Instagram在iOS和Android上看起來極其相似。開發(fā)者看起來將沒有遵循基本交互模式的app傳到Android。例如,tab在安卓版本中應該在屏幕的上部。

此外,不斷的看和試玩別人的應用是一個解決你自己界面問題的很好的方法。比如說很多時候當我們感到創(chuàng)作受阻或者不知道如何解決一個問題,我會玩我的手機看看它們?nèi)绾谓鉀Q我正面對的問題。

如果你身邊沒有手機,可以點開包含豐富案例網(wǎng)站像PttrnsAndroid?App?PatternsWindows?Phone?UI?Design?Patterns,可能對你有幫助。

 

規(guī)范所有東西

敏捷開發(fā)的方法需要理解一些東西將會呈現(xiàn)出什么樣子和功能實現(xiàn)之前的樣子。同樣的,原型幫我們評估產(chǎn)品的可用性(通過用戶測試)。理想上,我們搭建第一個原型不需要太長時間。

原型可以是覆蓋著紙的木板,像這個例子中掌上電腦原型。

可能很少有人記得掌上電腦:第一個原型之一是木板帶著畫著界面設(shè)計的紙。員工可以像真實設(shè)備一樣把它放在行李里帶著。

它的目的是測試尺寸和使用的舒適程度,這個原型已經(jīng)足夠了。問題在于測試你構(gòu)思到什么程度才可以開始設(shè)計,然后著手工作。

如今出現(xiàn)了許多原型工具甚至可以在智能手機上看起來像完成的產(chǎn)品一樣。也就是說,原型不止展示靜態(tài)設(shè)計;它同樣包括圖片、轉(zhuǎn)場效果和手勢。

POP可以讓你拍攝紙上的設(shè)計并且在幾分鐘之內(nèi)建起可交互原型。

通過你的工作流程、你想實現(xiàn)的和你期望的結(jié)果來決定選擇最合適的工具。比如說,當只有紙上的簡單線框圖時我常常用POP。用這個App我可以為設(shè)計拍照,添加手勢和轉(zhuǎn)場效果,又快又簡單!

但是當一個概念更超前時我發(fā)現(xiàn)使用像Sketch這樣的設(shè)計專用軟件更加方便,用Marvel,FlintoInVision,可以做出更優(yōu)美的原型。(注意有些時候它未必比另一些好。選擇哪個在一定程度上取決于你覺得哪個用起來更順手。)

之前提到過,現(xiàn)在出現(xiàn)了大量的原型App,幾個月前我決定建立一個小網(wǎng)站列出所有我知道的。網(wǎng)站提供每個工具特征的概述幫助你選擇。

我的個人項目Prototyping Tools

另一方面,像安卓系統(tǒng)的“material design”將更多關(guān)注細微交互效果。設(shè)計制作細微交互效果的原型是今天很多設(shè)計師的職責。(像Keynote這樣的工具可以讓你輕松制作這種細節(jié)。Keynote魔法動作選項遲早派的上用場。)

 

不要相信你看到的

當設(shè)計web端產(chǎn)品的時候,可以在工作的時候看到它運作起來的樣子。但是App你必須在移動設(shè)備上測試才能看到界面的樣子(功能)。首先,這種測試對決定對比度和尺寸是必要的。

針對Android和iOS幫助設(shè)計師在不同分辨率的移動屏幕上看他們的作品的工具,對于iOS,最有名的是LiveView。另一個我用的最多的是帶臺式機版本可以在Mac上使用的Skala(Android和iOS同樣適用),如果你用Sketch你可以嘗試Sketch Mirror。

不幸的是,這種工具沒有適用于Windows和Windows?Phone?(至少我不知道)。

Pixate擁有一個app可以將電腦和手機預覽你的作品。

在的工作流程中,每下一步開始前我常在手機上預覽設(shè)計以確保它是我想要的樣子。同樣的,我通常一次以一個系統(tǒng)的設(shè)計作為開始,而且大部分時間將手機放在身邊。這樣我可以時常檢查我的作品將怎樣在屏幕上呈現(xiàn),同時完成第一批線框圖,我確定尺寸(圖形、文本和控件),對比度和顏色是不是我預期的樣子。如果你不這樣做,可能當你后來發(fā)現(xiàn)問題的時候?qū)⑿枰嗟臅r間修正。

同樣重要的是用與預覽作品的手機同樣尺寸(長和寬)設(shè)計文檔開始工作。(注意:如果你為不同屏幕尺寸設(shè)計,請記住像素不再是測量尺寸的做好方式,因為不同系統(tǒng)他們會發(fā)生變化——例如,注意iOS上的點和安卓中的density-independent?pixels。某種程度上你必須完全理解如何設(shè)計和在移動應用領(lǐng)域制作圖片的不同。)

當你的設(shè)計已經(jīng)被開發(fā)者實現(xiàn),檢查App在不同的手機和不同版本系統(tǒng)上看起來和運行起來的樣子,而不是只是你手邊最好的手機。

 

謙卑的設(shè)計

App設(shè)計師必須拋棄創(chuàng)作最終版產(chǎn)品的觀念。App永遠不會完成,因為它是隨著時間進化的數(shù)字產(chǎn)品。正是由于這個原因,我們不能站在絕對的立場從事界面設(shè)計。而應該通過可用性測試和破譯用戶遭遇的問題來定位。

當用戶在使用App的過程中犯錯并感到困惑時我們設(shè)計師有時候傾向于逃脫責任。但事實上很有可能是我們錯了。

檢測到問題(并發(fā)現(xiàn)我們的錯誤)不是一件壞事。當然,這是一次學習和糾正工作的機會,從而改進它使它更好用。做設(shè)計必須保持謙卑的態(tài)度。

在曾經(jīng)工作過公司,每次告訴老板我完成了一個設(shè)計,他就會問我:“你已經(jīng)找用戶測試過了嗎?”我通常沒有測試過,但是最后我把它變成一個習慣,并且每次我測試的時候都準備好開放的頭腦,愿意看到發(fā)現(xiàn)的問題。

這個只有等你成熟到能夠接受你的錯誤并從中學習的時候你才能做到。這很難,但是為了成功這樣做是值得的。

 

保持在最前沿

當為明天而設(shè)計時信息數(shù)量使得事物幾乎不可能保持原樣。然而,做為App設(shè)計師,我們必須對新鮮事物和將要發(fā)生的事情保持好奇。

這包括App設(shè)計趨勢、系統(tǒng)新版本。無論喜歡與否,為了保持前沿看到最新的App設(shè)計我們不得不安裝新系統(tǒng)。

閱讀系統(tǒng)新版本官方設(shè)計指南是一種獲取多種多樣設(shè)計信息的好方法。你同樣可以像行業(yè)先鋒學習像Josh?ClarkLuke?Wroblewski。

保持在前沿同樣意味著嘗試使用市場上出現(xiàn)的,能夠簡化設(shè)計和使我們工作更高效的工具。我們不能害怕離開心理舒適區(qū)或不敢拋棄工作和設(shè)計的老路。

Sketch是一個相對新的工具,用起來同樣相當簡單。

按照這些原則,不久前我終于敢用Sketch。最開始有一點難,因為從頭開始學新東西,當我不得不用它時候我對這已知的工具已經(jīng)用著順手了。

幾個月之后的現(xiàn)在我發(fā)現(xiàn)這個軟件擁有一個容易接受的學習曲線。它節(jié)省了我的時間并且使我工作時頭腦靈活,這是對我愿意學習新東西的一種獎勵。

小結(jié)

最后,從心底里適應App設(shè)計。沒有人強制你這樣做,如果你不適應,你將有可能除了做icon外別無所長,而這只是一個巨大設(shè)計流程中小小的一環(huán)。

首先,App設(shè)計需要一種新的思考方式。是時候離開網(wǎng)站設(shè)計的牢籠并理解智能手機與便筏甚至手表是完全獨立與不同的。這是真正這是設(shè)計完整、復雜的移動產(chǎn)品的唯一途徑。

 

作者:Javier Cuello

原文鏈接:http://www.smashingmagazine.com/2015/04/10/thinking-like-an-app-designer

翻譯:石洋

來源:簡書

網(wǎng)站鏈接:http://www.jianshu.com/p/03d879f9d65d

http://www.jianshu.com/p/9a70238c722a

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 學習啦

    來自廣東 回復
  2. ??

    來自山東 回復