一個(gè)優(yōu)秀的設(shè)計(jì)師不僅僅只是熟練的軟件和工具操作者,更是設(shè)計(jì)方法和思維的深度思考者。在眾多新設(shè)計(jì)工具越來(lái)越普及,UI設(shè)計(jì)師競(jìng)爭(zhēng)越來(lái)越激烈的今天。面對(duì)設(shè)計(jì)工作中的苦惱和問(wèn)題,廣大設(shè)計(jì)師更應(yīng)該思考,如何讓自己變得更優(yōu)秀與“不一樣”。做設(shè)計(jì)就是做產(chǎn)品,本書(shū)分別從工具、設(shè)計(jì)方法與思維,以及交互與動(dòng)效三個(gè)方面來(lái)闡述設(shè)計(jì)師所經(jīng)歷的成長(zhǎng)過(guò)程,以產(chǎn)品思維為核心,不僅告訴讀者如何做,更重要的是告訴大家為什么這么做,在這個(gè)過(guò)程中如何思考,改善設(shè)計(jì)師自身的工作方式和思維,成為“不一樣”的優(yōu)秀設(shè)計(jì)師。
適讀人群 :從事UI設(shè)計(jì)及想轉(zhuǎn)行成為UI設(shè)計(jì)師的人。
本書(shū)由UI中國(guó)創(chuàng)始人董景博老師等多位知名設(shè)計(jì)人推薦,同時(shí)附贈(zèng)25集教學(xué)視頻,分量滿(mǎn)滿(mǎn),值得細(xì)細(xì)閱讀。
很抱歉,這不只是一本教設(shè)計(jì)軟件的“工具書(shū)”
親愛(ài)的設(shè)計(jì)師小伙伴們,很感謝你能購(gòu)買(mǎi)這本《不一樣的設(shè)計(jì)師》。相信每一位選購(gòu)這本圖書(shū)的讀者,一定會(huì)充滿(mǎn)好奇:怎樣才算是“不一樣”的設(shè)計(jì)師呢?為什么要做個(gè)“不一樣”的設(shè)計(jì)師呢?一個(gè)軟件就可以讓我成為一個(gè)不一樣的設(shè)計(jì)師嗎?
也許你是被這本書(shū)的標(biāo)題吸引而來(lái)的;也許作為一個(gè)UI設(shè)計(jì)的初學(xué)者,你想更快速地上手這款Sketch軟件;也許這本書(shū)的封面吸引了你。在寫(xiě)這本書(shū)提綱的時(shí)候,我思考了很久,怎樣才算是“不一樣”呢?不一樣,對(duì)于設(shè)計(jì)師又有哪些好處呢?寫(xiě)完《Sketch+Xcode雙劍合璧:移動(dòng)UI設(shè)計(jì)師快速上手指南》之后,我收到了很多設(shè)計(jì)師的意見(jiàn)和建議,有感謝,也有批評(píng);有鼓勵(lì),也有謾罵。但是不管怎樣,在這一年多甚至更長(zhǎng)的時(shí)間里,你和我都在成長(zhǎng),我們逐漸意識(shí)到一件事情,雖然大家通過(guò)Sketch相互認(rèn)識(shí)了解,但寫(xiě)一款軟件如何使用的工具書(shū),并不能更快更好地讓大家提升。每一位設(shè)計(jì)師朋友,都有一個(gè)美好的愿望,那就是成為能獨(dú)當(dāng)一面的優(yōu)秀設(shè)計(jì)者。但是否了解了一款當(dāng)今火熱的軟件,就能讓你成為這樣的人呢,那我只能對(duì)你攤攤手聳聳肩。
所以,很抱歉,這并不是一本教你如何使用軟件的“工具書(shū)”。那它到底寫(xiě)什么呢?別著急,讓我們聊聊另一個(gè)問(wèn)題。
設(shè)計(jì)師50%的苦惱,并不來(lái)源于技能本身
作為設(shè)計(jì)師,相信每個(gè)人都有不少的苦惱,可能是剛剛步入U(xiǎn)I設(shè)計(jì)師這個(gè)行業(yè),為自己欠缺經(jīng)驗(yàn)而苦惱;或者是工作一兩年,但是現(xiàn)實(shí)的殘酷讓你打了退堂鼓;或者是你投了無(wú)數(shù)份簡(jiǎn)歷,但依然無(wú)法找到一份合適的工作;或者是工作了五六年、七八年的設(shè)計(jì)師,看不到自己的未來(lái)。
于是你拼命地在網(wǎng)絡(luò)和書(shū)籍中尋找著各種各樣的案例文章,每天來(lái)一篇“N分鐘畫(huà)一個(gè)炫酷圖標(biāo)”的教程。然后,你看到了,照著做了,你學(xué)會(huì)了。接下來(lái),努力的你做了第二個(gè)、第三個(gè)、第四個(gè)教程案例,畫(huà)了很多看起來(lái)非常漂亮的界面。“嗯,非常有成就感!這些天的努力讓我進(jìn)步非?!加油!”你在心里暗暗地鼓勵(lì)自己。再然后,你把這些作品放到自己的簡(jiǎn)歷里,投給了用人單位。
一天過(guò)去了,沒(méi)有人理你。一周過(guò)去了,你滿(mǎn)心期待手機(jī)能響起面試邀約的電話鈴聲,可是通話記錄中卻空空如也。你開(kāi)始焦躁不安。兩周過(guò)去了,來(lái)北京的生活費(fèi)所剩無(wú)幾,上個(gè)月的工資即將花完,房貸和信用卡欠款等著還。你考慮著怎么過(guò)接下來(lái)的生活。你甚至想著借錢(qián)或者貸款參加一個(gè)學(xué)習(xí)幾個(gè)月就可以許諾你上萬(wàn)月薪工作的學(xué)習(xí)班。你依然努力著,因?yàn)槟阆嘈旁脚Φ娜嗽叫疫\(yùn)?墒乾F(xiàn)實(shí)的殘酷讓你開(kāi)始迷茫,你甚至想,UI設(shè)計(jì)這個(gè)行業(yè)一點(diǎn)都不好做啊,還不如轉(zhuǎn)行做其他的呢。
殊不知,也許你努力錯(cuò)了方向。因?yàn)槟闳钡牟辉偈羌寄埽撬季S方式和學(xué)習(xí)方法的提高。
“不一樣”源于“思維方式”及自身特色
在中國(guó),據(jù)粗略統(tǒng)計(jì),設(shè)計(jì)師從業(yè)者約500萬(wàn)人,當(dāng)然設(shè)計(jì)師包括各行各業(yè)的設(shè)計(jì)者,比如建筑設(shè)計(jì)師、服裝設(shè)計(jì)師、平面設(shè)計(jì)師等。如此龐大的基數(shù),面對(duì)著成千上萬(wàn)手中和你拿著一模一樣作品和簡(jiǎn)歷,沒(méi)有太多突出特點(diǎn)的設(shè)計(jì)師,也無(wú)怪乎想變得優(yōu)秀,會(huì)成為一件異常艱難的事情。
設(shè)計(jì)是一個(gè)創(chuàng)意行業(yè),沒(méi)有特色和獨(dú)立思考的精神,只會(huì)軟件操作和模仿,那么你永遠(yuǎn)都只是一個(gè)“用手干活”而非用腦工作的“設(shè)計(jì)師”,那么,或許叫做“美工”更合適—雖然這個(gè)詞是大部分設(shè)計(jì)師的大忌。
找到自身的“特色”,成為每一個(gè)設(shè)計(jì)師的當(dāng)務(wù)之急。所以,請(qǐng)不要掩飾自己的沒(méi)經(jīng)驗(yàn),因?yàn)檎l(shuí)都是從沒(méi)經(jīng)驗(yàn)到有經(jīng)驗(yàn)的。但特色,一定是可以不需要過(guò)多工作年限和經(jīng)驗(yàn)支撐的,存在于每一個(gè)人體內(nèi)的,待發(fā)掘或者可以培養(yǎng)的重要內(nèi)容。
所以,找到自身特色,配合思維方式的訓(xùn)練,擺脫思維惰性,讓自己成為一個(gè)不一樣的設(shè)計(jì)師吧。從另一個(gè)層面來(lái)講,你可能并不需要那么多軟件教程和例子,也許只需要那么一點(diǎn)“催化劑”,點(diǎn)燃大腦中的獨(dú)立思考精神。
“不走尋常路”并不僅僅用來(lái)描述一個(gè)品牌,放在設(shè)計(jì)師身上,也挺合適不是嗎?
這本書(shū)能為UI設(shè)計(jì)師帶來(lái)什么?
前文說(shuō)過(guò),這并不只是一本講軟件操作的“工具書(shū)”,但作為一本為移動(dòng)UI設(shè)計(jì)師準(zhǔn)備的“設(shè)計(jì)書(shū)籍”,我們還是期許他能為每一位購(gòu)買(mǎi)了本書(shū)的讀者帶來(lái)不一樣的閱讀體驗(yàn)。因此,權(quán)衡再三,我還是打算從“不一樣的工具”入手,帶著大家慢慢進(jìn)入這個(gè)不一樣的“特色”尋找和發(fā)現(xiàn)之旅。
本書(shū)第一部分,我們?yōu)榇蠹規(guī)?lái)了當(dāng)今火爆的移動(dòng)UI設(shè)計(jì)工具—Sketch4.0版本的新特性及圍繞軟件之外的各種話題的討論和解決方案。不要把它當(dāng)作中文軟件操作手冊(cè),因?yàn)槟銦o(wú)法在手冊(cè)上找到這些問(wèn)題的答案。如果你想學(xué)習(xí)軟件的基本操作內(nèi)容,建議您購(gòu)買(mǎi)《Sketch+xcode雙劍合璧:移動(dòng)UI設(shè)計(jì)師快速上手指南》。
第二部分,我們進(jìn)入大家非常關(guān)注的設(shè)計(jì)工作流程部分。這也是大部分設(shè)計(jì)師非常關(guān)注的內(nèi)容,也是作者在長(zhǎng)時(shí)間的工作經(jīng)歷中總結(jié)出的適合于絕大部分公司及工作情景的工作模式,希望能為你帶來(lái)不一樣的啟發(fā)。從另一個(gè)層面來(lái)說(shuō),Workflow(工作流)的優(yōu)化不僅僅體現(xiàn)在軟件操作層面的更新上,運(yùn)用合適的工作方法和流程,建立規(guī)范的思考方式和設(shè)計(jì)方法,會(huì)成為你工作中立于不敗之地的秘密武器。
工作流梳理完畢,我們回歸設(shè)計(jì)技能層面,看看當(dāng)今“不一樣”的工具能為我們帶來(lái)哪些交互和動(dòng)效層面設(shè)計(jì)的便利和提升。
最后一部分,回歸觀點(diǎn)及思考方式。來(lái)看看靜電作為作者的“不一樣”的設(shè)計(jì)觀點(diǎn)。作為有潛力善于思考的設(shè)計(jì)師,樹(shù)立自己的觀點(diǎn)和適合自身的工作方式至關(guān)重要,希望這些獨(dú)特的觀點(diǎn)能成為你在設(shè)計(jì)過(guò)程中的“催化劑”,引燃大家設(shè)計(jì)的方方面面。
讀完本書(shū),你會(huì)發(fā)現(xiàn):
1.看到一份心儀的設(shè)計(jì),懂得自我分析和思考做法了,而不是滿(mǎn)世界的“求教程”了。
2.遇到問(wèn)題的第一反應(yīng)是自己動(dòng)腦筋思考和搜索解決辦法,惰性消失啦。
3.接到一個(gè)設(shè)計(jì)任務(wù),不是對(duì)著空白的畫(huà)布腦袋中空空蕩蕩,而是靈感時(shí)不時(shí)地閃現(xiàn)了。
4.工作和生活好像開(kāi)始稍微順利起來(lái),苦惱解決了一大半。
那么,你讀這本書(shū)的目標(biāo)是什么?
一個(gè)前輩告訴我,在做任何事情之前,都要想好自己想要得到什么,目標(biāo)是什么。如果你腦袋空空,任何書(shū)籍都不可能為你來(lái)實(shí)質(zhì)的提升。目標(biāo)明確,才能做好事情,得到提升。比如在從事一份工作之前,就樹(shù)立一個(gè)短期可實(shí)現(xiàn)的目標(biāo)。當(dāng)然,在讀一本書(shū)的時(shí)候,也請(qǐng)樹(shù)立一個(gè)目標(biāo)吧!你的目標(biāo)會(huì)是什么呢?首先在大腦中設(shè)定這個(gè)目標(biāo),然后可以寫(xiě)在下面的橫線上,看看讀完后,你的目標(biāo)實(shí)現(xiàn)了多少?你從中得到了哪些感悟?
現(xiàn)在,在Sketchchina中國(guó)社區(qū)分享自己“不一樣”的目標(biāo),將有機(jī)會(huì)獲得作者簽名紀(jì)念品。
靜電,SketchChina中國(guó)社區(qū)創(chuàng)始人,靜Design.FM主播,京東智能?東課堂特約嘉賓講師,《Sketch+Xcode雙劍合璧:移動(dòng)UI設(shè)計(jì)師快速上手指南》作者,對(duì)設(shè)計(jì)及產(chǎn)品思維的結(jié)合有著深刻的理解,倡導(dǎo)感性設(shè)計(jì)與理性思維的融會(huì)貫通。曾于北京多家互聯(lián)網(wǎng)企業(yè)擔(dān)任首席設(shè)計(jì)師及管理職位,2016年底創(chuàng)辦公司,致力于互聯(lián)網(wǎng)UI設(shè)計(jì)行業(yè)在線教育與內(nèi)容傳播。
1 不一樣的Sketch 40
Sketch 40 新特性概覽 002
Sketch 40 的下載、安裝與購(gòu)買(mǎi) 004
Sketch 相關(guān)資源 007
元件與共享樣式的新特性 010
不一樣的插件―設(shè)計(jì)師的左膀右臂 016
全新的Share 和Sketch Mirror(Crystal) 028
照貓畫(huà)虎不可取―為什么要使用一倍圖做設(shè)計(jì) 034
什么? UI 設(shè)計(jì)稿要用300 分辨率?! 037
眼睛欺騙了我? Sketch 中的顏色處理方式 039
行高不對(duì)?聊聊Sketch 中的文本處理方式 043
“不一樣”的代價(jià)?將Sketch 文檔轉(zhuǎn)為PSD 文檔 046
2 不一樣的設(shè)計(jì)工作流
UI 設(shè)計(jì)師在整個(gè)工作流程中的位置 054
產(chǎn)品經(jīng)理、交互設(shè)計(jì)師與UI 設(shè)計(jì)師 058
設(shè)計(jì)師應(yīng)如何參與產(chǎn)品需求分析 062
為有理有據(jù)的設(shè)計(jì)做準(zhǔn)備―設(shè)計(jì)調(diào)研及研究 065
理清設(shè)計(jì)結(jié)構(gòu)―信息結(jié)構(gòu)圖與產(chǎn)品結(jié)構(gòu)圖的繪制 071
設(shè)計(jì)稿未來(lái)的模樣―低保真原型圖 075
一稿過(guò),你準(zhǔn)備好故事和場(chǎng)景了嗎? 082
設(shè)計(jì)如何產(chǎn)生價(jià)值?―用數(shù)據(jù)支撐設(shè)計(jì) 089
一致性的設(shè)計(jì):理解iOS 與Android 設(shè)計(jì)規(guī)范 094
通過(guò)多種形式建立UI 設(shè)計(jì)中信息的層次感 110
建立產(chǎn)品視覺(jué)規(guī)范 117
不僅僅是畫(huà)圖那么簡(jiǎn)單―優(yōu)秀設(shè)計(jì)師更理性 125
視覺(jué)走查―設(shè)計(jì)稿完美復(fù)現(xiàn)的必要步驟 127
3 不一樣的交互工具
不一樣的設(shè)計(jì)師,不只做靜態(tài)圖 134
交互和動(dòng)效工具,傻傻分不清楚 135
理解手勢(shì)與常用動(dòng)效曲線 143
快速玩轉(zhuǎn)交互―了解Flinto 基本功能 150
一起來(lái)玩連連看―Flinto 創(chuàng)建設(shè)計(jì)稿轉(zhuǎn)場(chǎng) 159
創(chuàng)建可滾動(dòng)的頁(yè)面 166
Behavior Designer 的應(yīng)用―無(wú)縫輪播圖實(shí)例 170
使用Flinto 制作Cover flow 實(shí)例 177
Flinto 滾動(dòng)頁(yè)面的進(jìn)階應(yīng)用 182
在Flinto 中使用視頻與動(dòng)畫(huà) 189
Behavior Designer 應(yīng)用―彈層提示效果 197
利用Keynote 創(chuàng)建頁(yè)面交互效果 200
后記 206