作為一名設(shè)計(jì)師如何才能做出優(yōu)秀的設(shè)計(jì)作品?
在Facebook的校招中,我們和來(lái)自康奈爾的一名實(shí)習(xí)生進(jìn)行了一次交談。在我們簡(jiǎn)短的互動(dòng)中,我很欣賞他身上的一些點(diǎn),因?yàn)樗且粋€(gè)非常具有自我意識(shí)的人。他和許多剛參加工作的應(yīng)屆生一樣,都很好奇,作為一個(gè)設(shè)計(jì)師需要什么樣的能力,才能做出優(yōu)秀的設(shè)計(jì)。
作為一個(gè)資深的設(shè)計(jì)師,需要具備全面的專業(yè)技能,并且具備自我診斷意識(shí)——這是做出優(yōu)秀設(shè)計(jì)的關(guān)鍵,尤其是在Facebook。
他分享了他的設(shè)計(jì)作品,我們一起來(lái)看下,這是他剛剛開(kāi)始正式接觸設(shè)計(jì)的作品。

Jon Lee為Nearspace app設(shè)計(jì)的概念稿
在Facebook,我們經(jīng)常把視覺(jué)設(shè)計(jì)稱為執(zhí)行力和藝術(shù)的結(jié)合。為了評(píng)估Jon當(dāng)前的設(shè)計(jì)水平,并鼓勵(lì)他朝著資深設(shè)計(jì)師的方向努力,我需要在評(píng)價(jià)他的作品之前向他提一些問(wèn)題,這樣可以更好的了解他的設(shè)計(jì)意圖。
你是屬于什么風(fēng)格和類(lèi)型?
你思考過(guò)你的設(shè)計(jì)風(fēng)格嗎?在你的這個(gè)作品里,我看到兩種字體類(lèi)型(標(biāo)題和內(nèi)容),至少三種不同類(lèi)型的尺寸,兩種顏色的類(lèi)型,居中和左對(duì)齊類(lèi)型。
標(biāo)題的樣式是什么? 按鈕的樣式是什么?內(nèi)容模塊的樣式又是什么?
你使用的是什么樣式?
我看到兩種尺寸的文本按鈕,兩種高度的按鈕,兩種描邊和三種顏色,還有帶有圖標(biāo)的按鈕。

我看到兩種不同的列表設(shè)計(jì),其中一種和現(xiàn)有的卡片設(shè)計(jì)很相似,包含的元素有商家名稱,類(lèi)別和星級(jí)評(píng)分,而在個(gè)人主頁(yè)最近帖子的列表樣式,看起來(lái)則有點(diǎn)像線框稿。
按鈕和列表之間的區(qū)別是什么?個(gè)人信息頁(yè)面,卡片、按鈕和列表都用了相同的白色描邊背景和灰色底, 他們?nèi)咧苯邮遣皇菓?yīng)該有所區(qū)分?
你的設(shè)計(jì)樣式和已有的設(shè)計(jì)規(guī)范哪種更好?
如果選項(xiàng)可以切換,那么它們可以自動(dòng)切換嗎? 取消和應(yīng)用的按鈕是否是必要的?點(diǎn)擊取消和點(diǎn)擊返回是一樣的嗎? 右上角的取消能用x代替嗎?我看到有一個(gè)重置按鈕沒(méi)有起到任何篩選的作用,這個(gè)按鈕還有存在的必要嗎?應(yīng)用按鈕可以替代重置按鈕嗎?
從用戶體驗(yàn)的角度來(lái)看,這個(gè)底部導(dǎo)航有必要存在嗎?同一垂直線上的控件是否平行?它們都是必要的么?

邊距規(guī)范
附近頁(yè)面和個(gè)人主頁(yè)的內(nèi)容模塊之間都使用了不同的間距,篩選控件的外邊距更明顯,這些邊距使用的原則是怎么樣的?
附近頁(yè)面模塊的標(biāo)題文字左右邊距都很小,幾乎貼近了頁(yè)面邊緣,為什么不用柵格布局?
圖標(biāo)是否表意清晰
座位圖標(biāo)由單個(gè)、三個(gè)和六個(gè)的區(qū)別,這是一個(gè)座位的計(jì)數(shù)還是一些座位數(shù)的大約值?又或者是一系列的座位么?還有更好的方式來(lái)表達(dá)嗎?這是“團(tuán)購(gòu)”優(yōu)惠的意思么?有沒(méi)有另一種方式設(shè)計(jì)它?
為什么沒(méi)有明顯的標(biāo)志表示是兩個(gè)相反的意思?如果不是重要的元素,為什么你要顯示出來(lái)這種無(wú)足輕重的元素?初步結(jié)果難道不應(yīng)該包含所有可用的選項(xiàng)么?
派(pie)在這里是想表達(dá)派?還是指代甜點(diǎn)?又或是代指所有食物?飲料意味著什么?你是假設(shè)認(rèn)為每個(gè)餐廳都能夠提供飲料嗎?有更好的分組嗎?
你選擇的設(shè)計(jì)風(fēng)格是一致的嗎?
我看到在使用下拉篩選功能時(shí),有一些篩選按鈕選項(xiàng)的樣式有一些不同。有些按鈕包含圖標(biāo)有些又只有文字。
一個(gè)圖標(biāo)有角度,其他圖標(biāo)又沒(méi)有。 WiFi圖標(biāo)的線最粗,但是插線板的圖標(biāo)線又很細(xì)。 有些是像素化的, 有些不是。有些是黑色的,有些是灰色的。

大多數(shù)卡片和按鈕使用了相同的樣式:圓角、描邊、顏色填充和風(fēng)格。 他們是不是太一致了?畢竟是兩種不同的內(nèi)容模塊。
屏幕上所有的元素都是必要的嗎?
在搜索區(qū)域上方有一個(gè)分割線,還有每一個(gè)可選選項(xiàng)下方也有一個(gè)分割線。我還看到了其中一個(gè)按鈕用了綠色。導(dǎo)航使用了圖標(biāo)加文本的方式,它們真的需要同時(shí)存在嗎?
你怎么定義你的配色方案?
你的配色是比較簡(jiǎn)約的暖色調(diào),除了一個(gè)高亮的綠色按鈕。你的設(shè)計(jì)原則是怎么樣?并且是應(yīng)用在哪些地方?

你的拼寫(xiě)、語(yǔ)法和標(biāo)點(diǎn)符號(hào)都正確嗎?你的內(nèi)容有邏輯嗎?
附近和個(gè)人主頁(yè)的導(dǎo)航經(jīng)常出現(xiàn),但是這個(gè)添加是什么意思? 添加什么?“可用性”這個(gè)單詞拼寫(xiě)錯(cuò)誤了,而且它真的需要出現(xiàn)在這里嗎?
頁(yè)面的“閱讀量”是怎么計(jì)算的?你的頁(yè)面標(biāo)題是過(guò)濾器,但是你頭部顯示的是距離。另外這個(gè)頁(yè)面可以過(guò)濾出座位數(shù)量,Wifi可用性,可用空間和食品飲料。但是你能向你的朋友們解釋一下這個(gè)頁(yè)面的功能是什么嗎?這個(gè)頁(yè)面的結(jié)構(gòu)是合理的嗎? 他們的命名是否都是合理的?

頁(yè)面的設(shè)計(jì)可移植性高嗎?
如果你是為安卓或者PC平臺(tái)設(shè)計(jì),你會(huì)做同樣的設(shè)計(jì)決策嗎? 這兩者之間的決策有什么不一樣?

那么回到我們最初的問(wèn)題來(lái),如何在產(chǎn)品設(shè)計(jì)上獲得更好的效果?
能回答以上這些問(wèn)題,只是作為一個(gè)好的設(shè)計(jì)作品的開(kāi)端。成為一個(gè)好的設(shè)計(jì)師,一個(gè)牛逼的產(chǎn)品設(shè)計(jì)師,需要持之以恒。這意味著你已經(jīng)在以一個(gè)設(shè)計(jì)師的角度在思考和解決問(wèn)題,而不是等待別人去發(fā)現(xiàn)這個(gè)問(wèn)題,那時(shí)就太晚了。
接下來(lái)的工作就是針對(duì)性的去回答這些問(wèn)題,確保你的設(shè)計(jì)意圖是基于堅(jiān)實(shí)的設(shè)計(jì)原則、研究和對(duì)細(xì)節(jié)的關(guān)注,不過(guò),對(duì)于設(shè)計(jì)風(fēng)格和偏好這種問(wèn)題會(huì)比較棘手,因?yàn)椴⒉皇敲總€(gè)設(shè)計(jì)師都有這些意識(shí)或者充足的理由。這很正常,因?yàn)樵谔岣吣愕脑O(shè)計(jì)能力這條道路上,首先要做的就是接受你的設(shè)計(jì)作品還并不完美。
Ira Glass對(duì)此有著奇妙的看法:
“沒(méi)人會(huì)向別人吐槽菜鳥(niǎo),就算有人看出我很菜,我也希望他不要嘲笑我,畢竟大家都是做設(shè)計(jì)的。我們從事這行,是因?yàn)槲覀冇泻玫钠肺丁5總€(gè)設(shè)計(jì)師都會(huì)有瓶頸期,最初幾年的設(shè)計(jì),現(xiàn)在看來(lái)會(huì)不會(huì)認(rèn)為很一般?確實(shí)是做的一般。但是你在努力的向前走,并且有信心能做更好,雖然你的作品真的沒(méi)那么好。你的品味,作為設(shè)計(jì)師的裝備,以及你的審美,它們就是當(dāng)你看到你所創(chuàng)作的成果時(shí)心中略過(guò)的那絲絲縷縷是失望,我知道你懂我的意思。”
1、如果你有品味,那么它會(huì)告訴你還有多少提高的地方,以及應(yīng)該怎么提高你的設(shè)計(jì)。
2、多看看其他人優(yōu)秀的設(shè)計(jì)作品然后形成自己的見(jiàn)解,什么是好的,什么不好的,在你的見(jiàn)解上加強(qiáng)基礎(chǔ)的設(shè)計(jì)原則。
3、多看看現(xiàn)有的設(shè)計(jì)規(guī)范,比如Material Design和人機(jī)界面指南。
4、多練手!多練手!多練手!重要的事情說(shuō)三遍。
5、多瀏覽設(shè)計(jì)社區(qū),多下載優(yōu)秀的APP,多去Dribbble看看優(yōu)秀的設(shè)計(jì)作品,不要去復(fù)制,而是去思考他們?yōu)槭裁催@么做?然后再去揣摩背后的答案。
6、向那些有設(shè)計(jì)見(jiàn)解的人展示你的作品,并且傾聽(tīng)他們對(duì)你的作品的評(píng)價(jià),然后去思考他們所說(shuō)的話,再應(yīng)用到你的設(shè)計(jì)上。
7、不斷的自我反思,比如我們剛剛提到的問(wèn)題。
8、現(xiàn)在我可以給Jon一些建議,比如你的“設(shè)計(jì)風(fēng)格不統(tǒng)一”、“綠色按鈕太突兀”。我還給了他一些解決方案,比如“左對(duì)齊所有過(guò)濾器類(lèi)別的按鈕”、“縮小按鈕的圓角半徑”、“給你的品牌顏色選擇一個(gè)亮色調(diào)”,如果想使你的作品更好,就要不斷打磨,細(xì)細(xì)雕琢。
9、別人對(duì)你作品的反饋和指導(dǎo)可以起到一定的作用,但是進(jìn)步最快的方法還是要多練習(xí),實(shí)踐出真知,而不是一味的照搬規(guī)范。
10、練習(xí)才能進(jìn)步,不斷的努力嘗試,鍛煉出強(qiáng)大的執(zhí)行能力,是初學(xué)者們首先要需要的,一旦設(shè)計(jì)師這個(gè)角色在你心中形成,它會(huì)一步一步指導(dǎo)你進(jìn)步。
相關(guān)文章

全畫(huà)幅不是半畫(huà)幅的兩倍有什么區(qū)別? 聊聊相機(jī)的傳感器尺寸
說(shuō)到相機(jī)畫(huà)幅,估計(jì)平時(shí)聽(tīng)到最多的可能就是全畫(huà)幅與半畫(huà)幅了,以至于不少人認(rèn)為中畫(huà)幅比全畫(huà)幅要小,為了避免這種常識(shí)性錯(cuò)誤,這篇文章就來(lái)和大家說(shuō)說(shuō)相機(jī)的不同畫(huà)幅,所謂2025-04-07
a5紙與a4紙?jiān)趺催x? a5紙與a4的區(qū)別介紹
4紙和A5紙因其尺寸適中,使用尤為廣泛,但你知道它們之間有何區(qū)別嗎?今天,就讓我們一起來(lái)探討這個(gè)話題2025-02-01
各類(lèi)商務(wù)印刷品的尺寸怎么選? 印刷設(shè)計(jì)常用的尺寸紙張/克重都在這里了
日常經(jīng)常印刷各種東西,哪些尺寸,紙張更合適呢?本文為大家整理了常用印刷尺寸,方便圖文廣告店、印企在日常接單生產(chǎn)中能夠快速掌握客戶關(guān)鍵性信息,詳細(xì)請(qǐng)看下文介紹2024-02-10
常用照片尺寸有哪些 常見(jiàn)證件照尺寸對(duì)照表及用途介紹
現(xiàn)如今,證件照已成為我們生活中不可或缺的一部分,無(wú)論是求職應(yīng)聘,還是入學(xué)注冊(cè),亦或是辦理各種證件,都需要提交符合規(guī)定格式和要求的證件照,那么,這些證件照的尺寸和2024-02-10
平面設(shè)計(jì)是一個(gè)注重視覺(jué)效果的設(shè)計(jì),簡(jiǎn)單的排版方式有時(shí)候不能滿足視覺(jué)突出的效果,業(yè)務(wù)很難達(dá)到吸引用戶的眼球,下面我們就來(lái)看看8個(gè)平面設(shè)計(jì)技巧分享2023-10-08
如何選擇平面設(shè)計(jì)工具? 這10款軟件應(yīng)該收入囊中
每個(gè)設(shè)計(jì)師都有自己最喜歡的設(shè)計(jì)軟件,并把軟件作為自己的第二語(yǔ)言,今天我們來(lái)推薦10款UI設(shè)計(jì)不可或缺的工具,詳細(xì)請(qǐng)看下文介紹2023-10-08
夏日電影風(fēng)怎么調(diào)色調(diào)色? 適合夏季的柔和綠色調(diào)調(diào)色分享
夏日電影風(fēng)怎么調(diào)色調(diào)色?夏天快到了,想要調(diào)節(jié)夏季電影風(fēng)的畫(huà)面,該怎么操作呢?下面我們就來(lái)看看適合夏季的柔和綠色調(diào)調(diào)色分享2023-04-02
什么是真RAW 什么是偽RAW? 簡(jiǎn)單說(shuō)說(shuō)真 RAW 和 偽RAW
隨著索尼α7RV(ILCE-7RM5)正式發(fā)售,近期有不少網(wǎng)友跟我咨詢索尼相機(jī)“無(wú)損壓縮(M)”和“無(wú)損壓縮(S)”RAW的問(wèn)題,今天做一個(gè)統(tǒng)一答復(fù)2022-12-24
手機(jī)UI設(shè)計(jì)尺寸有哪些? 超全面的UI元素尺寸設(shè)置指南
手機(jī)UI設(shè)計(jì)尺寸有哪些?作為新手在設(shè)計(jì)手機(jī)ui的頁(yè)面的時(shí)候,發(fā)現(xiàn)自己設(shè)計(jì)的尺寸都很奇怪,如果能有元素尺寸介紹就好了,下面就來(lái)看看我們匯總的超全面的UI元素尺寸設(shè)置指南2021-08-06
常用照片尺寸有哪幾個(gè)? 照片標(biāo)準(zhǔn)尺寸/像素對(duì)照表匯總
常用照片尺寸有哪幾個(gè)?我們經(jīng)常說(shuō)一寸照片,二寸照片,這些照片的尺寸是怎么計(jì)算的?下面我們就來(lái)看看照片標(biāo)準(zhǔn)尺寸/像素對(duì)照表匯總2021-08-06









