提交需求
賽事與廣告咨詢合作,請?zhí)顚懶枨蟊韱?,我們會在第一時(shí)間與您聯(lián)系!
時(shí)光如梭,筆者在UI / UX設(shè)計(jì)領(lǐng)域從業(yè)已經(jīng)超過10年了?;叵朐缙谠O(shè)計(jì)師們的主要工具都是單機(jī)軟件(如Sketch、Photoshop等),其他工具主要都是圍繞它們的一些插件。而10年后,整個(gè)設(shè)計(jì)行業(yè)已經(jīng)明顯接受了工具Web化的模式,各種設(shè)計(jì)場景的解決方案均開始使用Web-App作為新的載體。
如果你是一位想要進(jìn)入U(xiǎn)I和體驗(yàn)設(shè)計(jì)行業(yè)的新人,筆者認(rèn)為2024年的UI工具學(xué)習(xí)路徑相比之前已經(jīng)有了明顯的變化。后文我將從:主力UI設(shè)計(jì)、特定素材制作、團(tuán)隊(duì)設(shè)計(jì)工作流、素材和規(guī)范管理這四個(gè)方面總結(jié)15款當(dāng)下UI設(shè)計(jì)師必會的工具,供各位讀者參考。
一、主力UI設(shè)計(jì)
1、政治正確 - Figma
官網(wǎng):https://www.figma.com/
2021年之后的UI行業(yè),F(xiàn)igma幾乎就是政治正確的代名詞。甚至可以說Figma已經(jīng)重塑了整個(gè)行業(yè)的偏好、邏輯和使用習(xí)慣。在2024年如果一個(gè)行業(yè)新人完全不會Figma,甚至對Figma中的一些特有的設(shè)計(jì)前端化概念沒有基本的認(rèn)知,你將很難進(jìn)入一個(gè)相對成熟的中大型設(shè)計(jì)團(tuán)隊(duì)。如果你是剛進(jìn)入U(xiǎn)I行業(yè)的新人,從Figma開始學(xué)是最佳的選擇。
推薦指數(shù):????????
上手難度:??????
產(chǎn)品類型:Web在線工具
2、國產(chǎn)設(shè)計(jì)平替 - 摹客DT
官網(wǎng):https://www.mockplus.cn/dt
Figma對于國內(nèi)用戶有幾個(gè)老大難問題:一是無官方漢化和任何本地化適配,二是訂閱價(jià)格極其離譜,三是國外服務(wù)器的直連效果很差。所幸國內(nèi)一些老牌設(shè)計(jì)工具研發(fā)商也提供了平替Figma的產(chǎn)品,這其中筆者最推薦的還是摹客DT。
摹客DT這款產(chǎn)品完全免費(fèi),功能上覆蓋了Figma的95%以上,全中文界面對于國內(nèi)設(shè)計(jì)師也更友好。摹客DT還可以和摹客旗下的CC和RP聯(lián)動(dòng),打通產(chǎn)品原型、設(shè)計(jì)、交付開發(fā)整個(gè)流程,一站式解決產(chǎn)品設(shè)計(jì)團(tuán)隊(duì)的所有問題。
推薦指數(shù):??????????
上手難度:????
產(chǎn)品類型:Web在線工具
二、特定素材處理
1、通用圖像處理 - Photoshop
雖然現(xiàn)在的UI設(shè)計(jì)師已經(jīng)不再使用Photoshop來做UI了,但設(shè)計(jì)過程中仍然可能需要對圖像進(jìn)行一些處理,無論是摳圖、調(diào)色還是裁切,甚至是利用AI更改原畫面的局部內(nèi)容,借助Photoshop來處理仍然是最佳方案。尤其是需要和其他設(shè)計(jì)師合作、或是臨時(shí)處理網(wǎng)上的一些素材包時(shí),大概率還是要應(yīng)對PSD格式的文件,這個(gè)時(shí)候沒有PS的知識就會非常尷尬。
推薦指數(shù):????????
上手難度:????
產(chǎn)品類型:本地軟件
2、3D視覺設(shè)計(jì) - Spline
Spline是一款輕量的在線3D編輯器,學(xué)習(xí)成本相比傳統(tǒng)的C4D和Blender都要更低不少,且在國內(nèi)的教程也已經(jīng)相當(dāng)豐富,完全滿足UI設(shè)計(jì)師日常的3D需求。3D工具最大的痛點(diǎn)就是軟件上手難度高,安裝環(huán)境和相應(yīng)渲染器、插件比較消耗時(shí)間。而在線的3D編輯器可以開箱即用,大大降低了新人的學(xué)習(xí)門檻,輸出內(nèi)容品質(zhì)也足夠UI使用,和開發(fā)的對接也更方便。所以在2024年,筆者更推薦UI新人從Spline開始學(xué)習(xí)和使用3D效果。
推薦指數(shù):????????
上手難度:??????
產(chǎn)品類型:Web在線工具
3、快速營銷設(shè)計(jì) - 稿定設(shè)計(jì)
稿定設(shè)計(jì)是一款在線的營銷物料制作工具,提供了大量可以直接使用的模版素材。模版的設(shè)計(jì)感十足,可編輯性也非常好,同時(shí)素材的更新頻次也比較高,非常適合UI設(shè)計(jì)師快速應(yīng)付一些日常營銷設(shè)計(jì)需求。
推薦指數(shù):??????
上手難度:??
產(chǎn)品類型:Web在線工具
4、動(dòng)態(tài)素材制作 - AfterEffect
多年以來,筆者一直嘗試尋找可以替代AE來制作UI動(dòng)態(tài)素材的產(chǎn)品,但很遺憾行業(yè)內(nèi)似乎沒有任何一款產(chǎn)品能撼動(dòng)AE的地位。雖然一些在線編輯器可以一定程度上降低學(xué)習(xí)門檻,但其功能和輸出能力還是沒辦法和AE相比。常見的APNG、WebP、Gif、Lottie / SVG等格式的動(dòng)效素材依然需要用AE來導(dǎo)出,這也就注定了UI設(shè)計(jì)師需要制作動(dòng)效素材時(shí),AE幾乎是唯一的答案。
推薦指數(shù):????????
上手難度:??????
產(chǎn)品類型:本地軟件
5、微動(dòng)效演示 - Principle
如果需要向其他人快速演示一個(gè)逼真的、可操作的微動(dòng)效demo,使用Principle應(yīng)該是最合適的選擇。這款產(chǎn)品可以一鍵將Figma / Sketch中的設(shè)計(jì)導(dǎo)入到編輯區(qū),然后使用多畫板創(chuàng)建開始和結(jié)束狀態(tài),中間的動(dòng)效會自動(dòng)補(bǔ)間生成。Principle的制作效率高,且符合UI設(shè)計(jì)師的思維方式,自帶的時(shí)間軸編輯器極大地提升了動(dòng)效細(xì)節(jié)的控制能力,非常適合制作視覺要求高,但時(shí)長較短的交互動(dòng)效。
推薦指數(shù):??????
上手難度:??
產(chǎn)品類型:本地軟件
6、視頻處理 - 剪映
時(shí)代確實(shí)很卷,當(dāng)下的UI設(shè)計(jì)師也可能需要處理視頻類型的素材。此時(shí)筆者最推薦的還是使用業(yè)內(nèi)評價(jià)不錯(cuò)的輕量剪輯工具“剪映”。這款工具充分吸收了Final Cut Pro和Premier的優(yōu)點(diǎn),操作簡單,內(nèi)置素材和各種常用設(shè)置功能豐富,完全能應(yīng)付一般的視頻內(nèi)容處理。
推薦指數(shù):????????
上手難度:????
產(chǎn)品類型:本地軟件
7、AIGC生成 - 文心一言
AIGC產(chǎn)品目前市面上非常多,這里推薦國內(nèi)的用戶還是使用綜合實(shí)力領(lǐng)先的文心一言。這款產(chǎn)品在生成文字和圖像時(shí)表現(xiàn)都比較好,只需要填寫合適的Prompt(提示詞),就可以獲得相應(yīng)的文字或者圖像。此外,現(xiàn)在的AI產(chǎn)品普遍還加入了文件上傳、生成PPT等功能,通過這些功能可以更快處理文件內(nèi)容,并節(jié)約制作PPT的構(gòu)思時(shí)間。
推薦指數(shù):??????
上手難度:??
產(chǎn)品類型:Web在線工具
三、團(tuán)隊(duì)設(shè)計(jì)工作流
1、設(shè)計(jì)檢查 - Copixel
官網(wǎng):
https://copixel.bytedance.com/
Copiexl是字節(jié)出的一款高效走查開源工具。它的使用很簡單,就是打開需要走查的前端web頁面或項(xiàng)目,接著使用工具上傳該頁面的高保真設(shè)計(jì)稿;然后通過降低設(shè)計(jì)稿的對比度,與開發(fā)出來的前端效果進(jìn)行對比,達(dá)到快速走查發(fā)現(xiàn)問題的目的。頁面哪里有問題通過對比馬上就能發(fā)現(xiàn)了。
推薦指數(shù):????
上手難度:??
產(chǎn)品類型:Web在線工具
2、協(xié)作交付 - 摹客協(xié)作
官網(wǎng):https://www.mockplus.cn/idoc?home=1
摹客協(xié)作平臺支持主流的目前主流的設(shè)計(jì)工具設(shè)計(jì)稿上傳,包括Sketch、PS、XD、Figma、Axure,同時(shí)也支持摹客自家的RP和DT設(shè)計(jì)稿上傳。上傳后的設(shè)計(jì)稿可以共享到團(tuán)隊(duì)中進(jìn)行評審和開發(fā)交付。對于團(tuán)隊(duì)來說,還可以把設(shè)計(jì)稿之外的規(guī)范、文檔、素材等內(nèi)容均上傳到同一個(gè)項(xiàng)目中進(jìn)行分享,讓所有團(tuán)隊(duì)成員都能獲得最新的資源。
推薦指數(shù):??????
上手難度:??
產(chǎn)品類型:Web在線工具
3、用戶溝通和調(diào)研 - 騰訊會議
騰訊會議是國內(nèi)普及率比較高的在線會議和溝通工具。設(shè)計(jì)團(tuán)隊(duì)可能需要在產(chǎn)品立項(xiàng)、驗(yàn)收、上線后等關(guān)鍵節(jié)點(diǎn)快速獲取用戶的反饋,而此時(shí)騰訊會議就顯露出了他的核心優(yōu)勢:用戶的接受程度比較高。產(chǎn)品支持投屏、錄屏、遠(yuǎn)程控制等功能,設(shè)計(jì)團(tuán)隊(duì)可以將和用戶溝通的視頻錄制下來,后續(xù)再深入分析和挖掘。
推薦指數(shù):??????
上手難度:??
產(chǎn)品類型:本地軟件
四、素材和規(guī)范管理
1、素材靈感查找 - 花瓣
花瓣是國內(nèi)老牌的免費(fèi)素材搜索網(wǎng)站,相比同類型的其它網(wǎng)站,花瓣在素材下載上的體驗(yàn)上更好:用戶可以直接右鍵復(fù)制圖片并使用到其它產(chǎn)品中,甚至無需下載。由于多年的合理經(jīng)營,花瓣在素材質(zhì)量、素材數(shù)量和用戶活躍度上始終處于國內(nèi)第一梯隊(duì),部分素材開啟會員后可以直接下載源文件,豐富的題材類型能滿足各種設(shè)計(jì)師的需求。
推薦指數(shù):??????
上手難度:??
產(chǎn)品類型:Web在線工具
2、本地素材收納 - Pixcall
Pixcall是一款跨平臺的云端的全格式資源收納工具,可以幫助個(gè)人和團(tuán)隊(duì)更好地管理圖片、視頻、文檔等數(shù)字資產(chǎn)。相比起其他的資源收納和預(yù)覽工具,Pixcall可以自由選擇本地或云端存儲素材,也可以自由選擇使用客戶端還是云端來進(jìn)行素材的預(yù)覽。
推薦指數(shù):??????
上手難度:??
產(chǎn)品類型:Web在線工具
3、團(tuán)隊(duì)規(guī)范管理 - Zeroheight
Zeroheight是一款設(shè)計(jì)規(guī)范工具,能幫助團(tuán)隊(duì)創(chuàng)建和管理設(shè)計(jì)規(guī)范文檔。在云端平臺中設(shè)計(jì)師、開發(fā)人員和產(chǎn)品經(jīng)理能夠協(xié)作創(chuàng)建和維護(hù)設(shè)計(jì)規(guī)范,確保團(tuán)隊(duì)在設(shè)計(jì)過程中保持一致性。Zeroheight的在線文檔功能強(qiáng)大,還可以和其他設(shè)計(jì)工具進(jìn)行實(shí)時(shí)同步,讓規(guī)范維護(hù)過程變得更輕松。
推薦指數(shù):??????
上手難度:??
產(chǎn)品類型:Web在線工具
以上就是筆者選擇的2024年UI設(shè)計(jì)師必會的15款工具。可以看到,設(shè)計(jì)工具的國產(chǎn)化和Web化是大勢所趨,年輕的設(shè)計(jì)師們明顯更接受輕量化、專業(yè)化、協(xié)同化的工作方式。如果你即將開啟UI設(shè)計(jì)師的旅程,不妨從上述的工具開始學(xué)起。熟練掌握這些主流工具之后,你一定會得到一個(gè)更廣闊的就業(yè)前景。
Powered by Froala Editor
大牛,別默默的看了,快登錄幫我點(diǎn)評一下吧!:)
登錄 立即注冊