介面設計Prototyping 淺入淺出

關於prototyping(原型)設計,前陣子剛好在hpx的活動中有簡單的分享自己prototyping的經驗與想法,而這幾年也越來越多新的prototyping工具,對於介面設計師來說是喜憂摻半,喜是又有新的工具可以玩,憂則是又要花時間學新的工具,而且那麼多工具到底要如何選?而且也很難保證這些工具是不是能夠一直更新下去,如果停止更新那不就白花時間了…

你是做UI的,那懂不懂UX?

近來,身邊有很多朋友對於使用者界面設計師(UI Designer )跟使用者經驗設計師(UX Designer)感到混淆,在面試UI Designer時,除了一些介面設計相關的問題外,最常被問到就是:「你是做UI的,那懂不懂UX?」,懂?不懂?似懂非懂?總覺得UI Designer的工作內容愈來愈廣,不僅要懂UX,最好也懂程式,最好也懂行銷,最好也懂商業模式…這樣下去應該沒完沒了。撇開其他的專業不說,UI Designer 與UX Designer到底差在那裡? 該怎麼去定義UI Designer這角色呢?其實,這要回到最本質的問題,那就是身為一個設計師,有沒有思考過「設計」是什麼呢? read more

Daily UI 邁向更好的設計師之路

好一段時間沒寫文章,累積了不少的心得,但前陣子花了好多時間做Daily UI的挑戰,所以就先來一篇Daily UI的心得。

Daily UI的挑戰,開始於一位設計師Paul Flavius Nechita,這位老兄在dribbble上,每天都貼一個介面的作品(不分平、假日),在瘋狂的洗板下,我很難不注意到這位瘋狂的設計師。我不確定他是不是第一做這樣挑戰的人,但他確實成功的完成了它的挑戰,最重要的是,他的每一個作品都能夠維持一定的水準。 read more

視覺法則 – 格式塔原則

這篇延續上篇格式塔的理論,整理了一些常用的原則,如同上一篇最後面提到的,格式塔的四個基礎,就好比數學的加、減、乘、除,而它的原則就好比代數運算。所以只要能夠掌握基礎,或許也可以拼湊出一個設計原則。

格式塔的原則可以套用在不同的領域,例如:平面、介面、插畫、攝影、廣告、空間…等等,小到介面設計,大到建築設計,只要與視覺相關,就用的到。以格式塔作為基礎所發展出來的原則很多,但因身為介面設計師,所以下面就以介面設計常用的格式塔原則來進行討論。 read more

視覺法則 – 格式塔理論的四個基礎

gestalt這篇要來討論一下格式塔理論(Gestalt theory),也就是格式塔心理學,或稱「完形心理學」。只要學過平面設計理論的人,應該多多少少都聽過格式塔的相關理論,但真正要應用在設計上,其實也不容易,或許是其實已經用上了,只是沒有去仔細探究而已,因為它是一個人類視覺自然感知的過程與結果。

格式塔是德文Gestalt的譯音,意即「模式、形狀、形式」等,意思是指「動態的整體(dynamic wholes)」 –by wiki read more

圖標還是文字?

前一陣子與幾位比較資深的ux專家討論我們家的產品,提到一個我常常在思考的問題,那就是在介面設計功能的配置上,到底圖標、文字怎麼選擇呢? 所以這篇來討論一下怎麼選擇這件事。

從視覺設計的角度來看,圖標(icon)會被認為比較美觀,也容易被記憶,所以大多的設計師能用圖標就盡量不使用文字,但是圖標有時候很難辨視它的用途,這篇The Problem with Icon有提到,圖標如果意義不明確的話,使用者很難理解這些圖標的作用為何。 read more

設計的心理學 – 概念模型

閱讀這篇前,可以先再複習一下前面提到的設計的基本原則,文中我有提到二大設計目標,其中一項就是「易理解性」,而易理解性根據我在文中解釋指的就是「概念模型」,也是我歸納出六項設計原則的最重要的一個原則。

概念模型

概念模型(conceptual model):一個東西怎麼運作的解釋。-p.52

要理解概念模型,我們先做個簡單的練習。請想像並說明如何從提款機提領出一千塊的現金?

以下是我描述的提款流程:
首先插入金融卡 →依照提示輸入密碼 → 選擇提款金額 →依照提示取出卡片→拿回現金 → 完成交易

這就是我對提款流程運作上的解釋,也就是一個「概念模型」。但問題來了,操作提款機的概念模型從何而來 ? 假如我是第一次使用提款機,概念模型還不存在時,我要如何提款? 書中提供的解釋是: read more

設計的心理學 – 對應性、回饋、使用局限

繼上一篇介紹了預設用途與指意,這篇主要要來談一下另外三個設計原則:對應性、回饋、使用局限,最後一篇再來討論概念模型。

預設用途與指意的應用方式,其實就是在於與操作者之間關係的互動與指引,在本書在第三章,有提到關於人類大腦的記憶結構與行為模式;總而言之,結論就是「大腦有時並不是那麼靠譜」,因此需要其他的設計原則來進行輔助,降低大腦的記憶與行為操作的負擔。
而除了預設用途與指意外,對應性、回饋、使用局限也是常用的設計方法。 read more

設計的心理學 – 預設用途與指意

這篇來討論一下六大設計原則中的預設用途(affordance)、指意(signifiers)。

為什麼這兩項要一起討論,因為預設用途與指意某種程度上是一個很類似概念,不容易區分且容易混淆。先來討論預設用途。

預設用途(Affordance)

什麼是預設用途(affordance)? 書中的說明是:

預設用途是物體的屬性和操作者能否使用、如何使用這個物體的相對關係— p38

另在wiki上找到原文的定義的來源:

An affordance is a relationship between the properties of an object and the capabilities of the agent that determine just how the object could possibly be used.-Don Norman (2013). The Design of Everyday Things (Revised and expanded ed.). Basic Books. p. 11. ISBN 978-0465050659. read more

設計的心理學 – 設計的基本原則

這篇我要來整理一下這本書所提到的設計基本原則,雖然書中有提到「七個設計的基本原則」,但細讀此書後發現,有些地方不容易連貫,而且解釋上不容易理解,所以我先提出書中的觀點後,再整理成一個我認為比較好理解的概念。

首先,在本書中一開始就提到,一個優良的設計要滿足兩個特點:可發現性(discoverbility)、易理解性(understanding)。從字面上的意思來看,可發現性是指,使用者能夠容易發現那些是可以做的動作 、怎麼做;易理解性是指,使用者可以容易理解並知道該如何使用。這是設計師在設計任何裝置或介面,必須遵循的大原則,只要失去其中一個原則,就不能稱的上是優良的設計。 read more