和街旁設(shè)計(jì)師劉洋對(duì)話(huà)
(本文由盒外原創(chuàng),與懶人有禪聯(lián)合發(fā)表)
劉洋是懶人有禪的新成員,也是街旁的移動(dòng)產(chǎn)品設(shè)計(jì)師。他的設(shè)計(jì)經(jīng)歷非常豐富,包括 t-shirt、海報(bào)、書(shū)籍和網(wǎng)站?,F(xiàn)在他在負(fù)責(zé)街旁多個(gè)移動(dòng)平臺(tái)的 app 設(shè)計(jì)。下面是果合團(tuán)隊(duì)和他的訪(fǎng)談?dòng)涗洝?/p>
問(wèn):你覺(jué)得最近移動(dòng) app 產(chǎn)品設(shè)計(jì)的發(fā)展方向有什么變化?
從?Instagram開(kāi)始,就很不一樣了。因?yàn)檫@個(gè) app 把圖片當(dāng)成 feed 的主題,就變成了說(shuō)社交事件是用圖片一張一張傳下來(lái)的,就好像給?Flickr 加上了一個(gè)時(shí)間線(xiàn),又像是把?Facebook 的時(shí)間線(xiàn)變成了一張一張的圖片。圖片變成了一個(gè)很重要的部分。
我覺(jué)得這也符合現(xiàn)在智能手機(jī)發(fā)展的趨勢(shì):現(xiàn)在手機(jī)都越來(lái)越強(qiáng)大了,拍照是一件很自然的事情。在觸屏手機(jī)打字都不是很方便的情況下,拍照傳圖就變成很自然的事情。像后來(lái)的?Path 和?Color 都是這一個(gè)系列概念的演化。
在街旁的 app 里面,實(shí)際上我們也有借鑒 Intstagram 的設(shè)計(jì)。我們沒(méi)有做那種傳統(tǒng)的地點(diǎn)相冊(cè),好像一個(gè)圖片墻的概念,而是按照時(shí)間軸把照片放進(jìn)去。
問(wèn):你之前的設(shè)計(jì)經(jīng)歷對(duì)你現(xiàn)在做移動(dòng)產(chǎn)品設(shè)計(jì)有什么影響和幫助?
其實(shí)我設(shè)計(jì)的背景很雜,沒(méi)有說(shuō)一開(kāi)始就專(zhuān)注于某一部分的設(shè)計(jì)。因?yàn)閷W(xué)軟件,所以 Web 設(shè)計(jì)肯定是很大的一部分,但是也做過(guò)平面,比如海報(bào)、書(shū)籍封面。
傳統(tǒng)的設(shè)計(jì)大部分是給人看的,交互模式比較簡(jiǎn)單,比如 Web 設(shè)計(jì)基本上是鼠標(biāo)點(diǎn)擊。移動(dòng)設(shè)計(jì)的交互比較多樣,比如有手勢(shì)啊。還要考慮到移動(dòng)性和網(wǎng)絡(luò)的問(wèn)題。如果是 Web 設(shè)計(jì),用戶(hù)會(huì)坐在那兒,電腦插著網(wǎng)線(xiàn),你不需要考慮很多,但是移動(dòng)設(shè)備上的設(shè)計(jì),就要考慮到各種異常情況,比如有的時(shí)候手機(jī)會(huì)沒(méi)有信號(hào),走路的時(shí)候用戶(hù)交互會(huì)不那么精準(zhǔn)之類(lèi)的事情。這些都是移動(dòng)設(shè)計(jì)要注意的事情。如果一開(kāi)始從 Web 設(shè)計(jì)轉(zhuǎn)過(guò)來(lái),需要考慮容錯(cuò)性。相對(duì)而言,移動(dòng)設(shè)備上交互的可能性會(huì)更多。
另外就是移動(dòng)設(shè)備的屏幕。除了尺寸上會(huì)有局限之外,也包括硬件平臺(tái)的差異。比如 Android 上很少有 app 會(huì)做下拉刷新(Pull to Refresh)這個(gè)交互,而在 iOS 上卻很常見(jiàn)。Android 上的刷新率是 20 幀,而 iOS 是 60 幀每秒。Android 不同的硬件配置差異很大。在 iOS 上滾動(dòng)一個(gè)列表,很容易一次滾動(dòng)到頭,而在 Android 上滾動(dòng)速度和阻尼的變化都很難預(yù)期。所在不同的手機(jī)上適配會(huì)很難。Android 在不同 OEM 的“改進(jìn)”下,UI 已經(jīng)變得很“散漫”,所以一個(gè)設(shè)計(jì)放在不同的 Android 手機(jī)上可能會(huì)不一定適用。
與其說(shuō)之前的設(shè)計(jì)經(jīng)驗(yàn)對(duì)我的幫助大不如說(shuō)是作為一個(gè)重度用戶(hù)的經(jīng)驗(yàn)對(duì)我的幫助大。本身你要去用不同的 app,潛意識(shí)里面你要去做對(duì)比。當(dāng)你看到一個(gè) app 做一件事情的時(shí)候,你要去想為什么以前的 app 沒(méi)有做這件事情,而現(xiàn)在這個(gè) app 這樣做了,然后以前的 app 是怎么做的。形成一種很自然的對(duì)比。在這種前提下,你就能把握 iOS 平臺(tái)上的 app 是什么樣的,哪些東西是好的,哪些是不好的,新的概念出來(lái)怎么去避免就的錯(cuò)誤。這種對(duì)設(shè)計(jì)進(jìn)化的思想是要不斷的更新,保持自己一直在體驗(yàn)和思考新的東西。
問(wèn):你認(rèn)為在不同的移動(dòng)平臺(tái)上進(jìn)行產(chǎn)品設(shè)計(jì)的區(qū)別是什么?哪一個(gè)移動(dòng)平臺(tái)上的設(shè)計(jì)是最舒服的?
我覺(jué)得肯定是 iPhone,因?yàn)?iPhone 開(kāi)創(chuàng)了觸屏交互的先例。新聞上都會(huì)經(jīng)常說(shuō) iPhone 最近注冊(cè)了一個(gè)專(zhuān)利,然后 Android 又要給蘋(píng)果交專(zhuān)利費(fèi)。所以你會(huì)看到 iPhone 是一個(gè)從零開(kāi)始把交互做起來(lái)的平臺(tái),而 Android 和 Windows Phone 7 都是在 iPhone 的基礎(chǔ)上做一些變化,創(chuàng)造一些不同的東西。你會(huì)看到(在 Android 和 Windows Phone 7 的平臺(tái)上)有一些刻意的或者是修飾性的改變,不是非常自然。
每個(gè)交互都會(huì)有一個(gè)流程。在每個(gè)平臺(tái)上都會(huì)有一套導(dǎo)航的模式。做 app 特別是社交類(lèi)的 app,一定要先定義你的 app 在這個(gè)平臺(tái)上怎么做導(dǎo)航。導(dǎo)航包括哪些?就是每個(gè)頁(yè)面中的信息架構(gòu),比如:標(biāo)題要放在哪里,頁(yè)面之間如何跳轉(zhuǎn),這個(gè)頁(yè)面如果有菜單的話(huà)要怎么做,這個(gè)頁(yè)面如果要有一些不太重要的東西要把它藏到哪里去。這套東西是在做每一個(gè)頁(yè)面的時(shí)候都會(huì)遇到的問(wèn)題,所以要在最先把它搭建起來(lái)。在 iOS 和 Android 上的這種差異是非常大的。因?yàn)?iOS 沒(méi)有物理按鍵,而 Android 上有。這個(gè)問(wèn)題是一直被討論的,但是我覺(jué)得不太會(huì)有答案。因?yàn)楝F(xiàn)在 Android 的硬件也不斷向 iPhone 的方向發(fā)展,硬件越來(lái)越好,甚至超過(guò) iPhone 的硬件。所以現(xiàn)在會(huì)有越來(lái)越多的 iOS 交互搬到 Android 上來(lái),比如:iOS app 上會(huì)有一個(gè)導(dǎo)航,左邊放返回鍵,右邊放功能鍵。在 Android 上有人會(huì)用到下面的菜單按鍵,也有些人會(huì)直接用 iOS 的設(shè)計(jì),把按鍵做到 UI 里面,而不用物理按鍵。如果把框架想清楚,然后就可以專(zhuān)注在內(nèi)容上。
所謂的框架就是一種很共通的交互模式。比如在 iPhone 上,除了一些游戲之外,很多 SNS app 都是用同一種框架。如果你選擇做一件不一樣的事情,就要考慮風(fēng)險(xiǎn):用戶(hù)習(xí)慣于原有的框架,在新的框架下就可能找不到習(xí)慣的交互方式,就會(huì)問(wèn)為什么這個(gè)功能被藏起來(lái)了。
記得有一句話(huà)是說(shuō)最好的 UI 就是沒(méi)有 UI,就是讓用戶(hù)感覺(jué)不到交互的存在。我覺(jué)得最好是在一個(gè)用戶(hù)感覺(jué)不到的 UI 的框架下,再去關(guān)注內(nèi)容,就會(huì)是對(duì)內(nèi)容一種比較好的提升。
不同平臺(tái)的差異實(shí)際上是一些非常細(xì)節(jié)的問(wèn)題。我會(huì)把這些差異考慮在框架的設(shè)定當(dāng)中。其實(shí)移動(dòng) app 的設(shè)計(jì)都是在一塊觸摸屏上,很多不一樣的東西都是在 OS 的 DNA 中體現(xiàn)的。設(shè)計(jì)應(yīng)該盡可能的去貼近這些特性。再說(shuō)遠(yuǎn)一點(diǎn),在設(shè)計(jì) app 的時(shí)候,盡管不一定要遵循,但是一定要了解并且思考不同系統(tǒng)在用戶(hù)界面上的 UI Guideline,才能知道有些東西為什么要這么做,才能做取舍。
最近我看了 Android 2.3 的用戶(hù)界面設(shè)計(jì),覺(jué)得在新版本上的設(shè)計(jì)和之前的版本非常不同。代表性的 app 比如 Twitter 和 Facebook 都不一樣了。從 UI 上講,Android 是一個(gè)非常自由的系統(tǒng),所以在設(shè)計(jì)上會(huì)一直有新的變化。其實(shí)我感覺(jué)這個(gè)變化是越來(lái)越像 iOS,特別是在導(dǎo)航的設(shè)計(jì)上。以前的設(shè)計(jì)是在頁(yè)面的最上方會(huì)有 20 像素是放 app 的名稱(chēng),現(xiàn)在就會(huì)是放 logo 和兩個(gè)導(dǎo)航按鈕,和 iOS 更加類(lèi)似。此外,整個(gè)的設(shè)計(jì)風(fēng)格都在向這個(gè)方向遷移。我認(rèn)為這也是因?yàn)?Android 更加開(kāi)放,所以一些大公司會(huì)希望自己的 app 在不同的平臺(tái)上界面更加一致。而現(xiàn)在 Android 手機(jī)的性能越來(lái)越好,其實(shí)在一塊液晶屏上的表現(xiàn)在不同的平臺(tái)上也會(huì)越來(lái)越接近。
問(wèn):對(duì)于個(gè)人開(kāi)發(fā)者或者小型開(kāi)發(fā)團(tuán)隊(duì),你會(huì)對(duì)他們?cè)诋a(chǎn)品設(shè)計(jì)上有什么建議?
一些小的團(tuán)隊(duì),可能只有兩個(gè)人,一個(gè)人做開(kāi)發(fā),一個(gè)人做設(shè)計(jì),可能沒(méi)有一個(gè)人是專(zhuān)門(mén)做產(chǎn)品的,其實(shí)這樣的模式很好。國(guó)外一些很不錯(cuò)的 app 設(shè)計(jì)和開(kāi)發(fā)是由一個(gè)人完成的。如果說(shuō)建議的話(huà),我認(rèn)為開(kāi)發(fā)者和設(shè)計(jì)者之間的溝通是第一位的。在設(shè)計(jì)的時(shí)候一定要考慮在技術(shù)實(shí)現(xiàn)的時(shí)候會(huì)不會(huì)有什么問(wèn)題。因?yàn)閳F(tuán)隊(duì)很小再加上缺乏經(jīng)驗(yàn),如果沒(méi)有很好的溝通,設(shè)計(jì)出來(lái)之后會(huì)發(fā)現(xiàn)技術(shù)實(shí)現(xiàn)出來(lái)有一些問(wèn)題是沒(méi)有考慮到的。最好是能夠在每一個(gè)設(shè)計(jì)上都進(jìn)行充分的溝通,保證每一個(gè)想法都是(在技術(shù)角度上)“安全的”。越小的團(tuán)隊(duì)越要保持這樣的溝通,才能提供產(chǎn)品設(shè)計(jì)和開(kāi)發(fā)的效率。其實(shí)即便是像街旁團(tuán)隊(duì)的 app 也是這樣的雙人模式,同樣需要這樣的溝通。
另外就是要去聽(tīng)用戶(hù)的意見(jiàn)。當(dāng)然其中有些是噪音,但是很多人提一個(gè)建議的時(shí)候,可能就是有價(jià)值的。但是作為設(shè)計(jì)師要會(huì)思考和過(guò)濾這些意見(jiàn)。如果沒(méi)有這些思考和過(guò)濾,用戶(hù)提到了一個(gè)問(wèn)題,設(shè)計(jì)師卻沒(méi)有考慮到這個(gè)問(wèn)題,那么這就是一個(gè)需要反思的事情了。用戶(hù)在很多時(shí)候都不會(huì)提出需要什么,只會(huì)說(shuō)這樣做是不對(duì)的,你這樣做不好。比如有些頁(yè)面結(jié)構(gòu)比較復(fù)雜,有些按鈕的位置不太對(duì),可能點(diǎn)不到,在設(shè)計(jì)的時(shí)候可能沒(méi)有考慮到,在碰到這樣的問(wèn)題時(shí),可能就是一個(gè)把按鈕的尺寸放大的解決辦法,但是這樣做也可能會(huì)影響頁(yè)面其它部分的布局。這時(shí)可能就要考慮是不是要重新考慮一種布局,從零開(kāi)始去思考這個(gè)結(jié)構(gòu)是什么,因?yàn)橛行┰O(shè)計(jì)是聯(lián)動(dòng)的。
問(wèn):你的 iPhone 首屏上都有什么 app?你在設(shè)計(jì)中會(huì)參考什么樣的 app?
我的 iPhone 首屏基本保持 Apple 的出廠(chǎng)設(shè)置。
因?yàn)槲易鼋峙?,所以比較多參考的是社交類(lèi)的 app。我覺(jué)得最完美的是 Facebook 的 iOS app。這個(gè) app 把一些別人認(rèn)為已經(jīng)達(dá)到完美的功能一步一步去升級(jí),讓你覺(jué)得說(shuō)我怎么沒(méi)有想到這個(gè)設(shè)計(jì),而 Facebook 的改動(dòng)就越來(lái)越好。比如 Facebook 的搜索,會(huì)在點(diǎn)擊搜索欄之后就顯示 3 種可能的搜索分類(lèi),而不是讓用戶(hù)在看到大量的搜索結(jié)果后再進(jìn)行篩選。再比如發(fā)送新信息的時(shí)候,F(xiàn)acebook “啟動(dòng)輸入框打開(kāi)鍵盤(pán)”這件事可以做到非常順暢沒(méi)有延時(shí),其它任何主流 app 都沒(méi)辦法做到同樣的程度。但 SNS app 的用戶(hù)可能最常用到的就是發(fā)消息,所以這一點(diǎn)點(diǎn)的進(jìn)步很容易會(huì)被察覺(jué)到并被認(rèn)為有價(jià)值。
問(wèn):你怎么找到這些好的 app 幫助形成設(shè)計(jì)?
各種科技博客,好的 app 都會(huì)被炒的很熱,然后就可以在科技博客中發(fā)現(xiàn)。但其實(shí)大部分好的 app 都是那些比較老的,它們都會(huì)不斷改進(jìn)自己的設(shè)計(jì),我覺(jué)得這種改進(jìn)才是真正值得學(xué)習(xí)的東西。我喜歡在一件事情上反復(fù)思考,不斷的改變,把設(shè)計(jì)進(jìn)化到很好,而不是一拍腦袋想到一個(gè)設(shè)計(jì)。
博客我看得比較多的是?Engadget 和?Core77,這些不一定是談設(shè)計(jì)本身,但是可能會(huì)有很多想法上的幫助,包括?TechCrunch 都會(huì)經(jīng)???。
問(wèn):你用什么軟件和硬件完成設(shè)計(jì)工作?你的夢(mèng)幻配置是什么?
- MacBook Pro 15-inch。Mac 的屏幕色彩比較準(zhǔn),我覺(jué)得對(duì)設(shè)計(jì)來(lái)講很重要的是屏幕的顏色,我覺(jué)得這個(gè)屏幕還沒(méi)有很好,我希望有更好的屏幕。
- Razer Deathadder。我用鼠標(biāo)只有一個(gè)標(biāo)準(zhǔn),就是這個(gè)鼠標(biāo)要很大,貼我的手
- Photoshop CS5。但是我覺(jué)得應(yīng)該更多的用?Illustrator 和?Fireworks 做,因?yàn)楝F(xiàn)在 iOS 和 Android 的屏幕分辨率都越來(lái)越高,所以應(yīng)該有矢量的輸出,更容易改變尺寸。
- Windows 7 +?Microsoft Word。編輯文檔的時(shí)候,萬(wàn)不得已我不會(huì)用 Mac,因?yàn)橐紤]對(duì)方大部分用 Windows 打開(kāi)的時(shí)候,看到的格式字體是不是一致,而且?Office for Mac 太爛了。
- Gmail 用來(lái)收發(fā)郵件
- Skype 和?iChat 作為即時(shí)通訊工具。但是我不喜歡新版 Skype for Mac 在UI上的改變,變的很笨重。我也嘗試過(guò)用 Adium 之類(lèi)的 IM 聚合軟件,但現(xiàn)在覺(jué)得把各個(gè)群體都整在一起并不適合我當(dāng)下的使用需求。
夢(mèng)幻配置的話(huà)就是全部都是固態(tài)硬盤(pán)吧,我討厭等待,我想如果有固態(tài)硬盤(pán)我可以提高一倍的設(shè)計(jì)效率。
來(lái)源:http://www.lanrenux.com/?p=427
- 目前還沒(méi)評(píng)論,等你發(fā)揮!