設計原則(Design Principles):引導產品設計的中心價值

Yi-An Lai
Flow話不完
Published in
10 min readNov 25, 2020

為什麼需要設計原則?什麼是產品設計原則?用五個例子來分析什麼是好的產品設計原則和如何運用這些原則

前陣子幫某部份產品設計了新的landing page,主要目的是科技的更新,所以剛好有機會重新架構這個頁面,遵循設計團隊已建立的設計系統,還滿順利的就構思出三版設計提案和PM及其他設計師討論,針對使用需求、易用性、和其他相關產品landing page一致性等等討論並加以修正後,決定捨棄提案C,剩下的好像有人比較喜歡A方案,有人喜歡B,但兩個提案其實都沒什麼問題,所以然後呢?

不知道你是否偶爾也曾遇到這種狀況,試著用一些通用的標準法則來檢視設計後,還是會有一些不相上下的選項,或者和其他人的意見相左的討論,其實各有道理,只是你們的原則不同,這時,就是「設計原則」能派上用場的地方了。

Photo by Ben Robbins on Unsplash

為什麼需要設計原則

根據公司的規模、產品的性質、與使用者需求,設計原則可能專注在品牌、設計語言(設計系統)或團隊該如何操作。本篇文章想談的設計原則將專注在輔助上述情況的討論,它們能在團隊面臨不同選項的時候成為指引方針,它們是所有設計批判(Design Critique)或設計審查(Design Review)的基礎,它們能幫助設計師們不斷的相互提問、辯論,以達到最好的設計結果。

Product design principles are intended to help us make decisions when faced with competing options that seem valuable along different dimensions. — Intercom

什麼是產品的設計原則

你可能會想起Dieter Rams的10 Design PrinciplesJakob Nielsen 提出的十項易用性原則、或各種產品設計相關的設計準則,這些當然都是設計的葵花寶典,但針對你所正在設計的產品,它的目的和精神到底是什麼?它與其他競爭對手的差異是什麼?

Jakob Nielson 提出的十項易用性原則

在看到許多設計原則的定義中,我最喜歡<Design Systems A practical guide to creating design languages for digital products>這本書的看法:

Design principles are shared guidelines that capture the essence of what good design means for the team, and advice on how to achieve it. — Alla Kholmatova

這些原則不只是關於好設計是什麼,而是對整個團隊和這個產品領域來說,什麼是好設計,還有引導團隊該如何使用這些原則。

接下來我想用一些例子來講解設計原則可能的形式和能如何被使用:

例一:Medium早期的設計原則

Direction over Choice. This principle was often referred to while we were designing the Medium editor. We purposely traded layout, type, and color choices for guidance and direction. Direction was more appropriate for the product because we wanted people to focus on writing, and not get distracted by choice.Appropriate over Consistent. This might seem controversial, but when applied across devices, its purpose is clear. We were willing to break consistency if it was more appropriate for the OS, device, or context.Evolving over Finalized. This is exemplified in the ability to share Medium drafts, write responses, and leave notes. The content on Medium should be antifragile, improving with use and evolving overtime. We did not want to design printed books for the internet.

這些設計原則清楚點出Medium對於好設計的觀點,並幫助團隊做設計決策,在設計批判(Design Critique)或設計審查(Design Review)時,團隊可以依循這些法則,適當的討論這些功能是否恰當的引導使用者讓他們專注在書寫文章?還是使用者必須花太多時間在做選擇?這些原則也能讓設計師在掙扎手機版的設計時可以更有效的優化設計而不被過度侷限於產品的一致性。

例二:Salesforce lightning design system — Design Principles

Clarity: Eliminate ambiguity. Enable people to see, understand, and act with confidence.Efficiency: Streamline and optimize workflows. Intelligently anticipate needs to help people work better, smarter, and faster.Consistency: Create familiarity and strengthen intuition by applying the same solution to the same problem.Beauty: Demonstrate respect for people’s time and attention through thoughtful and elegant craftsmanship.

這組設計原則同時也強調他們的優先順序,清楚為首要,講求一致性但不應該犧牲效率,這樣的排序並不常見,但點出當這些原則彼此有衝突時,團隊可以考量這些原則的重要程度並下決策。

例三:Spotify’s new design principles

Spotify 今年更新了他們的設計原則,從以往的六個簡化成三個,整體看來精簡許多並容易記誦:

Design Principles 2020Relevant: It’s about reflecting you as an individual.Human: It’s about communication, expression, and human connection.Unified: It’s about how our brand manifests across our features and apps.

細讀每項原則後大概可領會其中意涵,但我個人認為這三項看起來有點普通,好像沒有點出Spotify的靈魂,身為設計師,我也覺得很難用Human來評斷設計的好壞,Jared Spool 對這類型的設計原則有很到位的批判,這些較為抽象的詞彙乍看之下很合理,但對設計師或團隊的幫助其實很有限,它們通常都是很多特質的集合,所以當你想要把所有人的意見都集合起來並避免那些有爭議性的詞彙或意見時,通常就會得到這些非常通用的原則,可以被套用在各產品,畢竟,誰會想要一個設計是unhuman 或 irrelevant 呢?

例四:Design principle from the Windows 7 Desktop Design team

Reduce concepts to increase confidence.

這是其中一項原則,減少(抽象)概念來增加使用者的信心,設計師可以用這個原則來檢視設計,例如:我們在這有引用什麼新概念嗎?為什麼?真的有必要嗎?在這新概念可能指任何design pattern或任何使用者不曾接觸過、需要重新理解或學習的東西。

例五:iOS Design principles

Metaphors:People learn more quickly when an app’s virtual objects and actions are metaphors for familiar experiences—whether rooted in the real or digital world. Metaphors work well in iOS because people physically interact with the screen. They move views out of the way to expose content beneath. They drag and swipe content. They toggle switches, move sliders, and scroll through picker values. They even flick through pages of books and magazines.

iOS六個設計原則之一是運用比喻,運用現實或數位生活中人們習慣操作物件的模式來設計合適的互動方式,達到使用者能快速學習的效果。

什麼是好的設計原則

好的設計原則通常是一個簡短的詞或一句話,伴隨這一小段簡述補充說明其意涵、舉例和給予反例。

Good principles don’t try to be everything for everyone. They have a voice and actively encourage a designer to take a perspective. — Alla Kholmatova

好的設計原則應該

  • 容易被記得、理解和使用
  • 有其獨特的看法
  • 能不斷的被討論和幫助設計決策

另外,Jared Spool 也提出一系列問題來讓大家檢視什麼是好的設計原則:

  1. 這些設計原則是經過研究後訂出來的嗎?
  2. 這些設計原則能幫我們在大部分的時候對設計提案說不嗎?
  3. 這些設計原則能幫我們和競爭者作區別嗎?
  4. 我們未來可能因為在不同狀況下選擇倒轉某個原則嗎?
  5. 我們用這些設計原則評估這個專案了嗎?
  6. 這些設計原則的意義有不斷被測試嗎?

在這系列的問題中你會發現,設計原則不是恆久不變的,它應該是可以不斷被使用、評估甚至是修正的,第四點也呼應了intercom所提出的,好的設計原則的反面,應該也可以是一個設計原則,所以 “build good software”, “Don’t ship bugs” 等等,都不是好的設計原則。

總結

設計原則沒有絕對的好壞,端看它們設立的目的是什麼和使用者為何,從上面的例子你會發現設計原則也能有很多形式,最重要的是,它們能被團隊理解,並套用到日常設計的對話中,這樣才能真正發揮它們的功效。

至於如何產出一套屬於你的產品獨特的設計原則又是另外一門學問啦,有興趣的話請幫忙拍拍手,下回再分享囉!

--

--

Yi-An Lai
Flow話不完

Digital product designer in the Netherlands // 偶爾串場研究員的UX設計師。設計經歷包含B2B軟體、3D列印產品等,喜歡參與產品前期的使用者研究和不斷的問為什麼,近期鑽研和dev team合作的藝術。閒暇時喜歡在低於海平面5公尺的鹿特丹種菜和騎腳踏車看綿羊。