Skip to main content

UI/UX 學習資源

· 10 min read
Zoe Huang

在自學的路上,面對各種大量的資訊,有一些是自己接觸過,覺得值得推薦分享的資源,在這裡拋磚引玉,部分也附上自己的心得短評,希望能夠提供給同樣曾經迷惘的同好,作為參考:

好書共讀

認知與設計-理解UI設計準則

note

其實老早就排了好度要寫這本書的讀後感,卻難以下筆,絕非這本書的內容或架構哪邊有問題,而是很怕自己寫不好,無法充分表達這本書的優點,最後想想,初衷不就是要誠實記錄自己讀完這本書的感想跟啟發,何必如此糾結。

總結來說,這是UI Design/Web Design的必讀經典

UI Design相繼其他,算是較為新起的領域,以前自己總覺得找不到相關資料可以閱讀,無從入門(爾後才慢慢發現是自己見識太少,不知道該怎麼去挖資料)。若想加強UI Design的基礎知識,推薦好好讀過幾次這本書,把準則看熟牢記在心,往後可於實作時避許多基本錯誤。這本書很適合一讀再讀,或當工具書翻閱,不論是初學者用來打底,進階者用來加強概念,半路出家者想搞懂UI Design是怎麼一回事,老少咸宜。

這本書從最基本的定義闡述起,列出許多現象或刻板印象,以科學實驗為基礎,衍伸完整的理論去佐證現象或推翻刻板印象。其實每個章節我都覺得很有用,可以拿出來hilight ,每個準則後面都其理論依據,而不是用“這樣看起來比較好看”或“大家都這樣做”帶過。自己印象很深刻的是,有一段提及人類大腦的反應時間,套用於UI Design,便是要去思考該如何設計產品在大腦反應時間內給予適當回饋,或是要怎麼做才不會讓使用者產生混淆感。附錄還貼心地收錄了著名UI Design準則,整本書的精華都列點於此,不影印下來貼在書桌前天天朗誦都不行。

眾妙之門︰網站UI設計之道

note

最初想說看簡中版應該會比較容易瞭解概念,看完一遍以後的感想是還是乖乖再啃一次英文比較實在...畢竟很多術語跟程式語言都是英文,專業術語被翻成簡中用法反而一時之間無法會意,如果是怕自己英文程度不夠或閱讀速度太慢,推薦先讀一次簡中抓住主軸概念,然後再讀一次原文,確認專業術語和細節。

總結來說,大推!在這個領域混的至少要讀過,書中幾乎把網頁設計的基本概念都講過一輪,某些部份頗為深入,除了概念探討甚至牽涉到程式,適合給對網頁設計已經有一些底子的設計師/工程師讀。覺得Smashing magazine是個很棒的綜合知識網站,從web design,coding到UI/UX都有豐富的知識和技術分享,除了訂閱電子報follow最新潮的觀念之外,看幾本概念書加強基礎也很不錯,如果不知道要從哪邊起頭,推薦直接讀幾本Smashing book打底。

這本書的前半部比較偏重CSS跟Layout,個人覺得很有用的是關於字體對於版面構成的影響,自己以往的經驗其實對於使用哪種字體相互配合,並沒有真正深入探究,看了才知道字體其實也是門很深的學問,光是襯體與否就看到眼花撩亂,下次執行專案打算好好配合這個部分的理論,去挑選適合的字體。

中後半部較多程式或概念分享,例如在設計版面時應該要參考遵守哪些準則等等。有幾個地方我覺得很受用,像是“容錯性”的重要,必須讓使用者可以直覺且流暢的操作,且避免不可逆的操作發生。或是在設計網站時,設計人員應該要站在使用者角度去構思發想,而不是以自己身為"設計師"或"工程師"的角色出發,畢竟絕大部分是要開發功能性網站給特定族群使用,要完全展現自己的想法跟設計理念,把這些東西留給個人portfolio就可以了。

瑕不掩瑜之處:畢竟出版年份稍早,範例網站的風格和樣式跟目前最流行最前端的有些差距,不過並不影響準則跟概念的應用。或是關於RWD跟AWD,甚至是CSS framework的選擇,現今有許多卓越的技術和framework可供選擇(像鼎鼎有名的Bootstrap),有些疑慮或是技術性需克服的地方已獲得解決,不過同樣的,這些並不會跟原則或概念相衝突,在閱讀過程中,或許能順便想想現在能用哪些工具解決這些問題。

Thinking

在探討字體跟排版的章節,有一段提到連文句的垂直對齊都必須考慮,是否不同區塊的段落每一行都能對齊。試著假想一下,真心覺得這是一個費工的魔鬼細節,可能調校個老半天,使用者根本無感,或是投下去的功跟達到的成效不成比例,尤其是又在專案時間壓力緊迫的時候,這件事情的可行性和CP值到底能到哪種程度,真是個問號...

書裡提及許多面向,的確有很多工具能應用,的確有許多細節須調校,有許多流程和內容要構思。但說到底,若在執行專案時,環境或人為因素影響,讓執行者難以達到這些標準,該怎麼去拿捏取捨,好像又是另外一回事了。

點石成金:訪客至上的網頁設計秘笈(Don∨t Make Me Think)

資訊架構學:網站、App與資訊生態系統規劃


線上課程

Coursea - Scott Klemmer / University of California San Diego

note

免費的線上課程,老師講話平緩、語速偏慢,可以了解理論基礎,適合初學想接觸UIUX領域者,不過課程略微催眠,推薦可以直接找自己想要了解的部分聽


社群/講座/演討會

note

算是同一團體經營的一系列社群,有分享性質的小型講座,線上社群和較為正式的研討會,如果是想要了解最近台灣在流行怎樣的UIUX知識,是一個滿推薦的接觸管道。

可惜因為疫情影響,這幾年的實體活動比較少,講座個人還是偏好參加實體,比較有互動,推薦可鎖定自己有興趣的講者/主題,參加相關講座。