UI/UX入門書單分享(一)

WenChien Lee
9 min readJun 27, 2018
邊閱讀、邊思考,更能把書中的精華融會貫通到潛意識裡!

前言

不確定自己適不適合UI/UX這份職業嗎?

除了花錢直接到外面上課,我自己的方式是先從閱讀開始喔!

讓自己有一些些概念,除了更能了解這個職務外,未來在篩選課程或是購買課程學習的時候,相信也更能夠吸收吧!

先自我介紹一下!我叫Wen Chien,文茜!原職服裝設計師,轉戰電商後從攝影美編做起,轉網頁設計師後,現任UI/UX designer,負責平台專案新商務模式開發及舊商模網站維護。

這樣亂七八糟的背景想告訴你的重點只有一個:只要你有心想踏入某個領域,無論何時都不嫌晚!尤其在這資訊發達、線上資源爆炸多的年代,沒有什麼事情是不可能的!

由於這樣的工作背景,為了想解決更多的問題,除了上網找資料之外,也翻找了一些書。

那麼,廢話不多說(已經說很多了),開始今天的書單介紹吧!

何謂UI?又何謂UX?

「為什麼網站美美的卻留不住使用者?」這篇文章中我已大概簡述過UX了,這裡就不多提!何況,網路上的大神們個個資歷豐富熱愛分享,不差我一個來解釋的!

至於UI,我自己認為只要是與使用者對談的任何介面,都算是範疇喔!UI的全名是User Interface,也就是使用者介面,所以只要是試圖讓使用者理解資訊並操作的,對我來說都可以稱作是UI!其他更詳細的解釋,就請上網去找找囉!無論是圖還是文,資料都很齊全的!

關於這次的書籍…

我平常就是個愛書的人!喜歡閱讀文字和翻書的感覺。不同的書能夠給你不一樣的世界喔!

在閱讀書籍時,我習慣準備很多的標籤貼,用顏色分辨與標記不同的重點,這樣往後重新翻查這本書籍時,便能很快的找到我當初覺得寫得很好或是我該多注意的地方!

這個領域的書籍,我大略分成兩區:

一是視覺導向。所謂視覺,並不單指圖形介面好不好看,也包含了很重比例的使用者體驗概念在其中,換言之,想要做出好的UI,你得先了解你的使用者,無論是年齡、文化背景、過去認知、情感引導…等等各種因素,你掌握得越多,設計出來的UI就越貼近他們的需求!

二是技術導向。遙想當年那個涉世未深的我(?)只是純粹對切版有興趣,覺得寫code好玩,才轉網頁設計,所以一開始其實對UI沒什麼概念,實際入這行之後,我覺得身為一個UI設計師,你跟工程之間的溝通是非常重要的!就算你完全不會寫code,也要有一些概念,你得試著用工程師的語言去跟他們溝通,這樣才能確保最後的成品是你要的樣子,不致雞同鴨講浪費時間。所以,就算真的完全沒有任何一丁點興趣,我也建議你至少理解一些概念!

這次想分享的書籍,先以UI/UX為主!為數不多(應該說超少),未來如果有看到其他好書,我會繼續推薦給大家的!

書單一:不是你太笨,是爛UI的錯!非設計師也該學的介面設計常識

設計師畢竟是視覺生物,相信在入門之初若硬要你閱讀大量文字,可能有些人會有點痛苦(例如我同事總是說自己有閱讀障礙XD),雖然說,設計師到後期不只要閱讀大量文件,甚至需要產出很多說明文件!所以閱讀這項能力還是必備的!只是一開始好不容易有了些熱情,就讓我們小心呵護它吧!

這本書講得非常淺顯易懂,而且舉了很多很多生活例子來引導讀者去思考生活周遭的細節。

UI經常不限於網頁上、行動裝置上,任何你能夠看得見的操作方式介面其實都屬於UI的範疇。

生活中是不是有各種難以讓你達成目標的使用者介面?例如到一個觀光勝地想洗手,卻搞老半天打不開水龍頭之類的?(笑)

這本書中有很多很多,諸如此類生活中的例子!

身為一個UI設計師,思考的能力非常重要!且我認為不應該只是在工作上思考,生活中的每一個細節,都值得你去深思~

對我來說,UX就像是一種文化,他是一種深入團隊核心,大家都想把產品做好的一種思考方式!UX不會只有設計師該想,包含了產品規劃師、工程師或是任何團隊裡的角色,大家各司其職的,去把UX做好。

產品規劃師,試著思考自己想為使用者解決哪些問題,設身處地為User著想;工程師掌握系統流暢度,不斷鑽研怎麼樣才能讓產品更順手!在一個團隊中如果人人擁有這樣的思維方式,相信產品會不斷往好的方向優化!

當然,這本書不僅僅是舉了許多生活範例、網站範例,也帶領讀者進一步去想解決方法!甚至提供了一些設計概念在其中,包含了一些心理學與法則(詳見書中第四章,用這些概念來規劃UI超好用!),和其他設計方法。

除了保有好的思維,攝取一些設計概念,也能幫助你設計出好的使用者介面!

所以入門的第一本書,我會推薦這本!不只是設計師可以讀,我也推薦給我的行銷和企劃同事們喔!

書單二:手機網站設計美學

主要也是以大量範例圖片為主,除了整理出各種設計風格,另外帶了一些設計理論、佈局規劃和程式框架知識。

無論是哪個領域的設計師,多參考其他人的優秀作品是很重要的,就像我們經常都要上Dribbble一樣!

在這本書中,非常用心的分類各種風格與元素,而且很多範例都幫你把手機版、Pad版和網頁版展開來,讓你可以細細去探討視覺動線和版面的變化,每個範例也都會附上網址,讓你可以自行去體驗你認為不錯的網站!

由於這本書的作者費盡苦心搜集大量線上作品(甚至很多是官網)比起Dribbble來說,不單單是視覺呈現,你可以去觀察每一個網站的資料量和頁面切換、資料分類方式!

設計師最重要的職責,就在於怎麼把冗長的資料或大量的內容,用最簡單易了解的方式呈現給使用者。多觀摩別人的作品,除了練習在視覺上抓住眼球,也試著學習如何將自家的大量資訊做統合整理,對未來規劃全站頁面會非常有幫助!

在本書的最後,更把網站依類型做分類,這是我覺得很棒的地方!承前述,當你越了解你的使用者,你能夠做出適合他們的UI!所以了解你的網站是要針對哪些使用者做設計,你就越能揣摩他們的使用情境,在你的頁面上提出適當的巧思!

書單三:打造最強網頁UI/UX設計腦:設計師都該懂的絕佳設計.溝通法則

前面兩本書主要都在個人設計力的提升,這本書除了設計思維之外,還帶入了團隊合作方式!

好的設計師除了對外能夠讓使用者有好的體驗,也要能與內部團隊溝通流暢,在第一個章節,就切入了這個問題,即是設計在產品開發階段的參與度能夠有效減少溝通落差!

對我來說,就連工程師的參與都很重要,一方面,高參與度夠讓團隊更有向心力;另一方面,不同領域的專業也能互相配合也能少走冤枉路…我想應該有很多人拿著美美的設計圖結果被工程師狠狠打回來而覺得工程師都好難溝通?相信我,有時候會打槍你的才是好同事!(偷懶不想做的除外啦XD)

這本書同樣舉例了很多頁面上的優化方式,並且又更著重在網頁UI上。整本書著重於對外(對使用者)與對內(在團隊中)溝通的重要性,因為我個人也覺得溝通在團隊中非常非常重要,所以推薦這本書給大家!

書單四:別做天兵設計!傾聽、思考、表達,滿足使用者體驗的0盲點設計關鍵

比起前面幾本,文字量稍微多了一些!內容也更廣!

這本書在設計職務分責、職涯上做了非常詳盡的介紹,另外也針對設計師應有的心態作進一步的說明。

我覺得這本書很好的地方是,他非常積極的建議你設計應該化被動為主動,在產品當中,其實蠻常把執行者晾在一邊(至少我遇到不少這樣的情況),但這樣卻會造成後續很多溝通落差的問題。

書中強烈建議設計師拿回產品主導權,想要拿到主導權,設計師需要掌握的面向就更廣!你得思考更多,才能在拿回主導權後統籌好團隊!(有機會拿到主導權的話啦XD”…也是可以用來鞭策自己啊是不是~)

這本是我在這次的書單裡面最推的一本,涵蓋程度比其他本都廣,設計論、工作態度、思維、測試、易用性…都在書中有提及!之所以會放在第四個書單,只是因為前面三本我覺得比較好入門,且對平時比較少看書的人來說,負擔比較輕!閱讀最重要的是「讀下去」,如果我第一本就放字這麼多的書,我怕大家直接關了我的文章XDDD(開玩笑的)

有時候我覺得能力要有,但表達溝通、團隊合作態度會比能力更加重要!當然,當了解得越多,設計師也比較能綜觀全局甚至說服團隊中的其他人,這部分我也還在努力中!與大家共勉~

結語

咦!這麼快就來到總結!?

恩…對!因為其實很多資訊,我都是從網路文章得來的!網路上有很多非常好的平台例如設計大舌頭AAPDHPX…或是你正在看的這個網站~

其實如果你都有在關注相關消息,無論是Facebook線上社團、實體活動或是其他任何方式,你都會一直不斷地看到很多新知和新概念!如果你英文不錯的話,就能夠看到國外更多的資訊了!

除了看這些與工作有相關的書,我也很喜歡看心理類、旅遊札記類、攝影類喔!如果大家有興趣的話,下次我再來分享~

  • 如果你覺得這篇文章不錯,還算有幫到你,請別吝嗇給我一些拍手~
  • 如果你還希望看到其他類別的書籍,可以拍10個以上讓我知道喔!我會努力整理的!
  • 如果有其他意見歡迎下方留言,在我能力所及範圍內我都會回覆喔!

--

--

WenChien Lee

一個喜歡分享的 UIUX 設計師!這裡分享各種講座與工作坊心得、工具教學、推薦書單、職涯觀點和生活體驗!