92国产精品视频_亚洲a级在线观看_国产精品电影观看_国产精品免费观看在线_精品伊人久久97_亚洲人成在线观_尤物九九久久国产精品的特点_成人激情在线播放_成人黄色大片在线免费观看_亚洲成人精品久久久_久久免费视频在线观看_久久精品国产一区_国产一区二区三区18_亚洲欧美中文字幕在线一区_日韩美女中文字幕_日韩视频免费在线

首頁

設計的行動思維

濤濤

你不會想要在緊急的狀態中去完成一件事情或一個設計作品,又或是做出一項決策。但如果你有系統的方法,則會讓你走出困境。

反復訓練,你的大腦就會習慣這樣的思維方式,當你處在緊急狀態或者處于危機時,你的大腦便會像受過訓練一樣,幫助你快速決策或走出困境。

本文講述《設計的行動思維》,它是一種優秀的思維方式,我用這樣的思維方式來指導我的設計行動;我以微信、淘寶、星巴克設計案例為你演示,幫助你更好地了解這一理論;它可以運用在你的設計執行和設計管理中,亦可以運用于你所在的任何領域。





觀察
Observation


你需要反復觀察事物和自己認知之間的差異,這些差異往往存在在細小的事物中,不被察覺,需要不斷磨練我們的心智,讓大腦保持時刻鍛煉。

你會發現,你會觀察到常人無法觀察到的一切,它是事物本身,或者一種現象,或是一處極為細小的變化,讓你的大腦時刻接受這樣的訓練,不止是你熟悉的事物或是領域,你將會觸類旁通。

我們每天都在頻繁地操作淘寶、微信,你會發現品牌顏色的變化嗎?當事物的變化和認知之間形成差異,大腦就會自動做出判斷,并觀察到這一細微的差異,這是我們不斷觀察和訓練大腦所帶來的結果,我把這種行為稱為 ‘大腦的高度警覺’。這樣的警覺,并不是刻意獲取,而是大腦主動傳遞的。


CASE 1 /  TAOBAO


undefined


這是Taobao APP 商詳購買頁面底部Button。一般情況下,品牌刷新或VI色調整,都會體現在界面的核心功能區域,例如Button或者Icon上。從‘立即購買’Button的色彩變化,便可以判斷Taobao經歷了3次重要的VI色調整。


下面顏色是我記憶里的淘寶VI色(大致色值),淘寶VI色的調整也是相應了互聯網設計的主流色彩表現趨勢:


undefined





CASE 2 /  WeChat


undefined



這是微信公眾號后臺寫作界面底部區域的三個Button。和Taobao的case一致,核心區域的VI設計都會同步更新。我在撰寫文章的時候高頻操作的是‘保存’Button,自然就察覺到了色彩的變化。


undefined



大腦受訓練的程度決定觀察結果的細微程度。對顏色的判斷能力,我稱這種能力為 ‘色彩認知’

又例如公眾號默認文章字體顏色并不是純黑色,而是深灰色(#333)。因為深灰色的文字在白色背景上閱讀起來眼部更為舒適。當我第一次書寫文章的時候,就發現默認字體的顏色正是我所需要的。



undefined



CASE 3 /  Starbucks

‘色彩認知’由我們不斷觀察的結果累積而來。就像您無需動手設計,‘色彩認知’便會告訴你墨綠色界面搭配金色作為輔色,能給界面帶來尊貴的氣質,這樣的設計會讓星巴克顯得更為高貴。



undefined

[ 星巴克官網首屏截圖 ]


常人看到這樣的界面并不會有任何意見。用‘色彩認知’來講講我的觀察。星巴克的主色是墨綠色,在官網大面積使用,則帶來‘視覺壓抑’的感覺,我想通過簡單地改變,來提升星巴克的品牌氣質。


我用Photoshop吸管工具從官網首頁上的一張照片中提取顏色:香檳色(Champagne),這樣的顏色在墨綠色底色上有較好的辨識度和品質感,適用于標題性文字顏色。


undefined

[ 從照片中提取顏色 ]


在前期的訓練中,也可將圖片馬賽克,這會輔助我們挑選顏色,當你足夠熟練后,即可直接用吸管在照片上選擇更豐富的色彩。


undefined

[ 從馬賽克照片中提取顏色 ]


香檳灰(Champagne gray),可用作常規閱讀段落文字顏色,在墨綠色上面會顯得柔和、舒適。


我重新設計了首頁的文字與版式:


undefined

undefined

[ 優化后的效果 ]


下面是之前的效果。對比看看:


undefinedundefined

[ 官網截圖 ]


這是最簡單的用戶感官上的提升。而更重要的是‘用戶心理’上的提升,這將在用戶閱讀文字內容時發生。我們先看看文字內容(翻譯如下):


標題 | 事情在變,但我們仍然在這里為您服務。


正文 | 我們已暫時關閉店內咖啡廳,但部分雜貨店和直通車位仍然開放。某些市場還提供星巴克提供的Uber Eats服務。請訪問我們的商店查找器以獲取的商店營業時間和營業地點。


按鈕 | 尋找門店


這段文字是星巴克官方在疫情期間所寫,并不是一段激動人心的品牌宣傳文案,所以我們在設計的時候應使用常規的文字顏色,為避免白色在墨綠色下帶來的刺眼,我選擇白灰色(#e3e3e3)的字體顏色。標題想表達的潛意識文字是:‘雖然我們碰到了困難,但是我們依然堅持為您服務’。我改為香檳色,來體現星巴克積極的態度與服務的品質,會顯得更有力度。


在頁面中使用這樣的顏色,同樣可以提升設計的活躍度,為品牌帶來更好的品質。例如,將顏色應用到星巴克官網中小圖標設計和文字上面,來提升品質感與活躍度:


undefined

[ 優化后的設計 ]


undefined

[ 官網截圖 ]



超乎常人的細微觀察意味著敏銳的市場嗅覺,意味著更前瞻性的設計思維,為身處品品牌的設計師帶來巨大的商業價值和用戶共鳴。



定向
Orientation


當我們觀察事物的時候,旁人和你一樣,也在觀察你所觀察的事物,同是一件設計作品,在于你是否能更快速地發現觀察對象的弱點,這些弱點就隱藏在事物之中,往往和某一處細節有所關聯。

找到弱點,利于我們定向事物的問題,從而幫助我們快速找到解決方案;快速地觀察并發現事物的弱點,取決于大腦前期觀察訓練的累積。

當身處緊張、有限的時間,我們無法獲得更多的思考與驗證,則需要我們在這之前做出更多的觀察訓練。訓練越多,你的大腦則能更快速地發現事物的弱點,便于你更好地定向問題。



決策
Decision


正確的決策依賴于你對問題的定向。有效地判斷事物的弱點,則能更準確地做出決策。我相信認知與觀察都是可以訓練的,在我們的日常生活中,顏色的排列與組合,在我們眼前頻繁地出現,我們可以從任意的事物中來觀察,將觀察與獲取結合在一起,并付諸于你的行動。


undefined



就像我們生活中所觀察到的水果的顏色,你可以從中獲取到這些色彩搭配,并將它們存儲在你的記憶中。當設計中需要表現活力、清爽的設計元素時,你自然會想到這些綠色和黃色的搭配。



行動
Action


行動之前,無需刻意地去完成流程化(觀察、定向、決策)的過程,大腦的速度與行動指令在一瞬間完成,這依賴于大腦在這之前的觀察訓練。當你看到事物,大腦便會條件性地做出反應并支配你的行動,你可以理解為‘條件反射’,這極大程度依賴于我們前期的大腦訓練與積累。


undefined



‘ OODA’ 是職業軍人:博伊德創立的戰略理念,這一理念對美國以及西方企業界和管理學界有著巨大的影響。 《設計的行動思維》是我在‘OODA’的基礎上加以我的理解,并將它轉化為設計的新思維,我稱它為‘設計的行動思維’,并將它運用在我的設計執行與管理中。

觀察、定向、決策、行動,最重要的是‘觀察’。觀察是一個日積月累的過程,并非一日之功。在我的設計工作中,我能快速地發現產品問題并提供解決方案,這來自于我對觀察的日積月累與學習,使我能快速定向問題,作出決策,并付諸于我的行動。在行動中,我會再次循環,直至不會出現任何的設計問題。

福布斯、哈佛商業評論都介紹過博伊德的戰略理念,數十本專業管理著作都提到過他。美國管理學界對海軍陸戰隊產生了深厚的興趣,向商業企業界大力推薦‘海軍陸戰隊方式’,而這個方式的靈魂就是‘OODA’,這是博伊德作戰思想的結晶。

對我來說,OODA是一種行動思維,它可以改變您在設計工作中的思維方式??梢赃\用在您的設計執行和管理中,乃至您所在的任何領域、包括您所擔任的任何角色。

文章來源:優設    作者:Riixiong 


藍藍設計m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務


設計師如何地組織頭腦風暴

濤濤


頭腦風暴是一種常用的設計方法,能夠幫助設計師開闊思維,快速獲取大量靈感與方案,當然,這是在理想的情況下。實際上,很多頭腦風暴是漫無目的,效率低下,毫無收獲的。而頭腦風暴需要很多人參與,如果浪費了大家的時間而一無所獲,那發起者簡直尷尬到能摳出兩室一廳。

那么,設計師如何才能地組織一場頭腦風暴呢?下面我將按“開始前”,“進行中”,“結束后”的順序,介紹整個頭腦風暴流程中提率的一些心得體會。


開始前


明確想要解決的問題

我們一定是為了解決某個問題,而不是為了閑聊組織頭腦風暴的。所以我們要先明確問題是什么,才能引導大家幫助我們。

我們可以試著用一句話去概述它,注意必須要具體,不能太含糊。“如何設計一張海報”就是一個很糟糕的描述。試著把目標用戶、業務目標、場景加進這句話,比如“如何設計一張能夠吸引應屆畢業生加入XX設計中心的朋友圈海報”。


拆解問題

明確具體問題后,我們還需要將它進行拆解成一個個關鍵問題,這樣才能有序展開討論,而不是漫無目標地侃大山。比如剛剛提到的那個問題,就可以拆成“應屆生的關鍵詞是什么”、“應屆生找工作時最關心什么”、“XX設計中心的關鍵詞是什么”、“什么樣的元素能夠代表設計師”、“什么樣的朋友圈海報形式比較吸引人”等等。



制定流程

有了明確的問題和關鍵問題后,我們要做的就是將它們在頭腦風暴按步驟上提出來,讓大家跟著我們的節奏去展開腦洞,這也就是頭腦風暴的流程。一場頭腦風暴往往包含背景介紹、多輪腦暴、闡述想法、投票等環節,作為組織者需要詳細規劃每個環節的順序、時間,特別是需要控制總時長(盡量別超過一個半小時),預留中場休息的時間,畢竟大家很難長時間集中注意力。


確定分工

一般來說頭腦風暴里有三種角色,主持人、記錄員和參與者。參與者的職責不用介紹了。主持人的職責是帶著大家按節奏討論,記錄員的職責是記錄大家的想法和拍照,缺一不可。


確定參與人員

參與人員的數量一般在5-10之間,人數太少收集不到足夠的想法,人數太多討論效率低,耗時長。參與人員的身份需要根據你想解決的問題確定,如果是比較大型的項目,參與的人員需要多元化,把產品經理、程序員都拉進來,方便獲得不同視角的觀點,也能夠提高合作方的參與感。在我們上面舉的海報例子中,如果能拉應屆設計師加入腦暴,將非常有幫助。


準備工具

除了筆、便利貼、A4紙,我們還需要準備一份寫了每個步驟需要完成任務的PPT,幫大家明確任務。


提前通知

大家的工作都比較忙碌,所以請至少提前一天邀請大家參與頭腦風暴,并且簡單交代背景,提供一些資料,方便大家提前消化。


進行中


介紹背景

首先要簡單跟大家介紹一下背景信息,以及接下來的大概流程,活躍一下氣氛,帶大家進入狀態,講段子也算是新世紀設計師的必備技能了。


重量不重質

頭腦風暴的目的并不是要獲得考慮得非常周全、詳細,能夠直接落地的方案,而是大量的想法和靈感。所以我們需要鼓勵大家在短時間(5-10分鐘)內輸出盡可能多的想法(四五十個不算多),不要太糾結可行性、成本等細枝末節的問題。


延遲評論

作為主持人,切記不要當場對參與者的想法做出負面評論,或者談論執行細節的事情,以免打擊參與者的積極性。如果有領導參與,要注意避免領導的威壓影響其他參與者打開腦洞。


控制節奏與討論主題

互聯網從業者大多是思維活躍的可愛人兒,開一個頭他們就能嘮上一天,所以主持人一定要留意時間,按照既定計劃,當大家偏題時引導大家回歸到對主題的討論上。


中場休息

如果整場頭腦風暴的時間超過半個小時,就需要給大家安排中場休息的時間,可以提前準備一些零食和飲料,幫助大家放松,以便接下來能夠集中注意力接著討論。


記錄與拍照

記錄員應該將大家的想法和每輪討論、投票的結果記錄下來,方便后面回溯和汲取靈感。拍照也是很重要的工作,這將為最后的設計提案提供寶貴的圖片資料,讓整個設計流程展現在決策方面前,提高說服力。



結束后


總結成果

主持人應該將簡單總結一下大家討論、投票的結果,表達對大家百忙之中參與頭腦風暴的感謝,為下次拉人做情感鋪墊(開玩笑)。


整理材料,同步結論

會后需要及時對頭腦風暴的結果進行整理和分析,并將結論以郵件的形式同步給參與者(表達對參與者的尊重)和領導(同步工作結果)。整理時可以按可行性和效果兩個維度劃分idea,找出比較平衡的方向。


寫在最后

頭腦風暴是很有效但也很容易浪費時間的一種設計方法,開始前詳細規劃,進行中穩穩把控,結束后及時總結與同步,能夠幫助我們提率。

另外,頭腦風暴只是為我們提供了靈感和方向,并不一定要選擇獲得票數最多的方案執行,還是需要根據實際做判斷,不要過于機械。

文章來源:站酷    作者:失靈 



藍藍設計m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


如何為你的UI制定一套色彩系統?

濤濤

色彩在UI設計中的作用:加深品牌印象與品牌感、引導用戶視覺凹增加易讀性、區分信息交互的狀態、營造氛圍傳遞熱度……

前言

不管是做 UI 設計還是畫插畫,有很多同學覺得自己是因為天賦不夠所以對色彩的敏感度不夠,其實不然。一個可能是大家總結的太少,從來都是憑感覺和運氣去配色,但配色都是有講究的。

一個設計作品呈現到用戶面前,第一眼進入眼簾的就是產品的視覺表現,而產品的色彩在其中起到了舉足輕重的作用,毫無疑問色彩搭配對于設計師來說是非常重要的。那么具體到實際項目中該使用什么怎樣的色彩,需要怎么做呢?

用戶界面是一個設計師用理性思維解決用戶感性需求的窗口。如果對色彩的運用不加以克制,界面可能會顯得花哨而沒有主次;但過于拘謹又容易使界面保守,難以激發用戶情緒,下面以Bee express項目的實例來理性推導制定一套色彩系統。

切勿直奔主題

做過設計的同學應該都知道顏色模式:RGB、CMYK、Lab 等等,這里不做過多的解釋了。另外每個顏色具有一定的性格特征和表達方式,而且都會有正反兩面。雖然每種色彩都有正向性格特征,但是我們在定位主體色之前一定要知道所選擇色彩的負面特征對企業是否會帶來負面的影響,

開始之前我們需要了解在配色過程中需要避免出現的問題,如果你經常出現下列的問題,保證你在試用期內一次性就能拿到全部薪資,emmm……

  • 高飽和度的色彩會造成我們的視覺疲勞及視幻;
  • 灰部使用過多的配色會使界面有一種臟兮兮、霧蒙蒙的感覺,甚至心情低落;
  • 沒有規律且過多的配色。如果你不是做五彩斑斕的黑,建議6、3、1的色彩配比,輔助色不超過3種;
  • 熒光色。使用這種色彩的,建議跟色彩對視,看誰堅持的更久,除非是你贏了;
  • 太輕柔的顏色-沒有重點且輕飄飄的感覺;
  • 現在很火的新擬物化設計對于部分(沒有絕對)產品可能會造成信息識別性很差;
  • 不要將對抗色重疊,否則你會很浮躁。

定位品牌色

雖然設計是相通的,但是在不同的設計領域進行配色時,依然會存在巨大的區別。更換品牌的主體色,都不會是因為設計師自己的決定,而是公司在商業策略上優先做出了調整,然后通過品牌視覺上的變更將這個信息傳遞給消費者。

Bee Express快遞、速遞柜業務為主,前期的主色及視覺形象以橙黃色為主,為了避免視覺跳躍性太大,以及后期IP形象(蜜蜂吉祥物)打造,本次品牌色彩升級在原有基礎上優化了色調,以保證后期產品的易用性和延展性,并利用最科學、最適用的方式推導出輔助色,以提升應用視覺的豐富性和感官體驗。

express原主色:

如何為你的UI制定一套色彩系統?來看這個實戰案例!

為了不影響原有色調前期的視覺傳播,即在原有主體色的基礎上調整SHB的數值,讓色彩更具視覺沖擊力,在色彩襯托(字體、圖標)更清晰。

  • H(Hue:色相)
  • S(Saturation:飽和度)
  • B(Brightness:明度)

如何為你的UI制定一套色彩系統?來看這個實戰案例!

通過調整后的主體色也能看出,明亮清晰的主體色(品牌色)也更適合在界面中的運用,為信息傳遞、引導操作、品牌價值帶來更大的提升。

  • 信息傳遞:產品的首要目的是傳遞用戶所需要的信息,這就需要界面有清晰的層級關系,明確、舒適的閱讀體驗。
  • 引導操作:清晰合理的操作引導,讓用戶能夠準確地根據引導進行下一步操作。
  • 品牌價值:很多同學會忽略這一點,導致產品的界面與品牌關聯性差,整體界面沒有品牌感。

根據主體色推理同色系

同色系為統一的色相,使用中可以加深品牌色的感知,可以讓界面更有層次,同時可以讓界面保持色彩上的一致性,整體感較強,產生低對比度的和諧美感,給人協調統一的感覺。

具體是指與品牌色 H(色相)一致,通過改變 S(飽和度)與 B(明度)變化產生的色組。分別往淺色/深色方向按均勻數據增減,各產生5個坐標值。

如何為你的UI制定一套色彩系統?來看這個實戰案例!

綜上能看出,使用同一色系即可完成一個項目,但是對于中大型項目來說實在是過于單調,沒有太多的層次感,因此我們需要多色搭配為輔。多色的輔助顏色可設定不同的任務屬性和情感表達,再搭配中性色黑白灰,能賦予更多的變化和層次。

提取24色-鋪墊輔助色

根據主體色 H(色相)為基礎,不斷地遞增、遞減 15,在 0-360 之間可以得出 24 個顏色,也就是將 360° 色環分割為 24 份,(24份在360°色環上,每一個色相的角度為15°),最終得到下圖24色。

如何為你的UI制定一套色彩系統?來看這個實戰案例!

選取輔助色

輔助色需要滿足的兩個條件:

和品牌色有明顯區分:避免所選輔助色感官上給用戶視覺區別與品牌色差距不大,傳遞的調性太過一致;

不能過于突兀:根據色彩原理,互補色是最能與品牌色本色產生視覺感官對比的顏色,但可能會有些突兀。為了讓顏色的輔助起到豐富畫面的作用,而不是反而讓整個版面顯得不和諧,所以選擇互補色的鄰近色作為輔助色,避免直接使用互補色。

  • 鄰近色:色相差值 15° 以內的顏色為鄰近色;
  • 類似色:色相差值 30° 以內的顏色為類似色;
  • 互補色:色相差值 180° 的顏色為互補色。

基于品牌色可衍生出 3 個輔助色:一個與品牌色傳遞調性有明顯區分的類似色;兩個互補色的鄰近色。

如何為你的UI制定一套色彩系統?來看這個實戰案例!

類似色搭配:使用色相相近的顏色,頁面元素不會相互沖突,更加協調有質感。

互補色搭配:選擇使用互補色,最佳搭配是一種作為主色,另一種用于強調。它們有著非常強烈的對比度,用在需要特別強調某個元素時會非常有效。

視覺統一感官校準

每一種顏色都有自己的「感官明度」,也就是發光度。根據現有的使用場景,類似色和互補色大都用在同層級的信息展示上,而當我們將最終得到的輔助色擺放在一起之后發現,雖然我們提取出的輔助色明度色值都一致,因為顏色本身自帶的感官明度屬性有所區別,導致視覺上會有明顯的明暗差別。需要通過發光度來進行最終的顏色校正。

校準方式:依次在輔助色上疊加一層純黑圖層,將該純黑圖層顏色模式調整為 Hue(色相),就可以通過無彩色系下的明度色值,進行對比,使色彩視覺感官保持一致(青色和藍色屬冷色調,固需加深)。

如何為你的UI制定一套色彩系統?來看這個實戰案例!

全色系輸出

根據上面同色系的明度、純度對比規則,對所有定義的輔助色進行明度和純度的輔助色彩輸出,最終得到輔助色色板。H(色相)一致,通過改變 S(飽和度)與 B(明度)變化產生色組。分別往淺色/深色方向按均勻數據增減,各產生5個坐標值

如何為你的UI制定一套色彩系統?來看這個實戰案例!

刪除最左側的3種同色系,因明度過低時,顏色已經非常接近于黑色,色相在肉眼上幾乎已經趨于一致。最后得到基于品牌色推導出的全色系色階色板。

如何為你的UI制定一套色彩系統?來看這個實戰案例!

如何為你的UI制定一套色彩系統?來看這個實戰案例!

總結

配色常常從確定主色開始,根據行業類型和視覺訴求的需要,選擇一種居于支配的色彩作為主調色彩,構成畫面的整體色彩傾向。然后選擇輔色,添加點綴色,最后按照色彩組合的原則完成設計中的需求。

雖然有了以上的配色方式,但一套標準的色彩系統還會包含中性色規范、顏色的使用規范等等。相信解決了大部分的需求,剩下的工作也難不倒大家了。畢竟以上的方式只是給大家提供了一個理性科學的方法,如果想更加優秀,還需要進一步深入地去學習色彩理論知識,多看優秀的配色作品提升審美,總之要多看、多實踐和多思考。

文章來源:優設    作者:能量眼球

藍藍設計m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

如何從三個方面,做好用戶隱私的體驗設計?

濤濤

用戶隱私安全在產品設計中是很重要的一個環節,本文從用戶體驗角度切入,從匿名模式、減少永久性和減少公開性三個方面展開分析。

我們先看?組來??優的2019年6?的調研數據:70%的美國?認為,與5年前相?個?信息變得更不安全。尤其是?學歷?收?群體。由此可??戶對個?信息數據的隱私擔憂?以往更甚。

?戶隱私安全很重要,涉及的范圍和?度也很多。本次的分析從?戶體驗?度切?,涉及如下三個??:

  • Incognito Mode匿名模式;
  • Reducing Permanence減少永久性;
  • Reducing Publicity減少公開性。

匿名模式

下圖是Google系App(Google AppChromeYouTubeandGoogle Map)匿名模式切換,從交互體驗上來說有如下?個特點:

  • 統?在右上?;
  • 可以便捷切換?匿名模式,反過來也很容易切回登陸狀態;
  • 匿名模式的狀態提示,例如YouTube 在匿名模式下在界?底部有?字提示「您 當前處于匿名模式」。

如何從三個方面,做好用戶隱私的體驗設計?

匿名模式不是最近才流?的功能,最早提供隱匿模式的是蘋果safari瀏覽器,早在 2005年就?持了匿名模式。Chrome瀏覽器在2008年就開始?持此模式。雖然由來已久,為什么到了2020年,匿名模式依然是國外互聯???趨勢呢?

我們看?組數據:

這是來?DuckDuckGo 2019年9?的調研(DuckDuckGo是美國的?款不記錄?戶?為保護?戶隱私的搜索引擎)。樣本來?美國、英國、德國和澳?利亞的成年??戶,共計3,411?的調研得出。各國?戶對使?搜索引擎的個?隱私安全?常在意(是否搜集個?的數據和記錄搜索?為)。

2020年5?DuckDuckGo?均搜索次數為6200萬。對?看2019年11?底?均搜索次數4900萬,2018年10?是2900萬。

最近?年的持續活躍度?幅增?證明了不記錄個?隱私的搜素引擎越來越受到?戶的?睞。

國內,頭條、UC瀏覽器在搜索框輸?狀態也提供了「?痕瀏覽」??。

不僅是搜索引擎領域,保護?戶隱私也成為Facebook最重要的戰略?向之?。Facebook CEO Mark Zuckerberg在2019年 F8開發者?會上喊出「THE FUTURE IS PRIVATE」。2019年3?Mark Zuckerberg發?,主題就是《聚焦于保護隱私的社交?絡》。

如何從三個方面,做好用戶隱私的體驗設計?

減少永久性

我們先看國外社交媒體Stories(?故事)產品形態的流?。

?們總是對于所分享的內容永遠記錄在?上感到擔憂。Stories 24?時消失緩解了?們的隱私顧慮,這讓?戶更安?地?然分享。

Stories由Snapchat?創,由 Facebook發揚光?。早在2019年4?,Facebook+Messenger Stories, Instagram Stories?活?戶數就突破5億。 2020年2-3?LinkedIn,Twitter也先后宣布將上線類似功能。

如何從三個方面,做好用戶隱私的體驗設計?

減少公開性

來??優的調研報告:41%的美國?經歷過?絡騷擾,最常?的就是在社交媒體上。23%的?戶最近經歷的?絡騷擾來?評論區的評論內容。27%的?戶經歷?絡騷擾后決定不再發布任何內容。

如何從三個方面,做好用戶隱私的體驗設計?

我們以限定評論互動的公開性為例:

2020年5?Twitter上線了新的評論功能,可以限定誰可以回復帖?的功能,提供了三種選項:誰都可以評論,只有被關注者可以評論,只有被提及者可以評論三種公開度的限定。

Instagram也在測試「評論限制」新功能,批量屏蔽/限制評論。?前已經上線的?個例?:?戶(評論發布者)如果發布的評論含有攻擊性敏感詞,發布前伴有提示,提醒評論含有攻擊性敏感詞是否真的要發布。

如何從三個方面,做好用戶隱私的體驗設計?

注重隱私提供僅好友可?/僅??可?/僅作者可?/等多重維度的隱私設定有助于?戶更安?地參與互動。

另外?個例?是付費頻道會員:付費頻道會員-限定頻道的公開性讓內容創作者減輕隱私顧慮不僅能獲得?告收?,也能得到來?會員、會費的收?,形成「忠實粉絲」社區,有助于內容?態的社區化建設。

我們主要看YouTube的頻道會員案例:

YouTube有兩種會員模式。?種是YouTube整個平臺的付費會員,去?告,看原創美劇影視,消費?樂,可下載內容的模式。第?種模式是Youtuber個?頻道付費會員,吸引忠實粉絲加?。我想說的就是第?種。

如何從三個方面,做好用戶隱私的體驗設計?

為什么?V?紅有意愿開通頻道會員?

除了獲得忠實粉絲收?變現的商業價值以及付費頻道會員可以為忠實粉絲提供各種專屬功能,背后也和?紅?V對個?隱私顧慮有關。

?紅?V在完全公開的社交?絡上需要始終保持?夠克制謹慎,避免引起爭議。但在忠實粉絲付費頻道專屬會員群中,?紅?V會減輕隱私顧慮,更加回歸?我。

?如在頻道會員中發布更多與個??活相關的內容,表達更多不便在完全公開的社交?絡中的想法和感受等,因為忠實粉絲通常更具包容度,更不容易引起爭議。

YouTube頻道會員費?可以從三種會費(按?)區間選擇,?持多選:

  • 低階 Low Levels $0.99~3.99;
  • 中階 Medium Levels $4.99~14.99;
  • ?階 High Levels $19.99~49.99;

頻道會員功能在2018年開始測試,?向粉絲數過10萬的YouTuber開放。

以上綜述,我們可以說:

1. 匿名模式:

雖然匿名模式由來已久,但仍然是當前的??基本?戶體驗設計趨勢,尤其是匿名模式的切換便捷性?常重要。

2. 減少永久性:

Stories?故事24?時消失緩解了?們的隱私顧慮,這讓?戶更安?地?然分享,已經成為國外社交媒體平臺的必備功能,Facebook, Instagram平臺的最主要、最具影響?的功能之?。

3. 減少公開性:

?戶總是對在社交媒體平臺發表評論有所顧忌,限定評論的公開性能夠有助于促進?戶發帖表達,其他?戶也可以更安?地參與互動。

付費頻道會員可以限定頻道的公開性,讓內容創作者減輕隱私顧慮不僅能獲得?告收?,也能得到來?會員會費的收?,形成「忠實粉絲」社區,有助于內容?態的社區化建設。

從UE?度,我們可以為頻道會員提供專屬身份設計例如專屬徽章,專屬表情等。

THE FUTURE IS PRIVATE, 注重?戶隱私的體驗設計越來越重要!

文章來源:優設    作者:

百度MEUX

藍藍設計m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

用一篇超全面的文章,幫你掌握服務設計思維

濤濤

在當前的行業背景當中,設計師了解交互視覺就足夠了么?NO!JDCD今天帶來服務設計思維,分享好的設計將具備哪些技能點~

為什么UED要加入服務設計思維

隨著整個行業的融合和發展,設計師職責的邊界越來越模糊,線上線下的融合,設計的鏈路也越來越長。一個優秀的設計師,不僅要懂得視覺、交互,還要懂產品、運營、用戶研究等。

因此設計師輸出的產物不再是單一的設計稿,也許是一個優化的建議,一個方向的描述,或者思路的呈現等等。好的設計師應該是在全鏈路的各個環節,都能夠有的放矢的輸出對業務有價值的產物,并最終推動業務達成目標。

今天我們來聊聊服務設計思維~

什么是服務設計

服務設計作為一個融合性的學科,通過對人、物、行為以及環境和社會之間系統關系的梳理,以用戶為中心,圍繞用戶重新規劃組織資源,促進組織運作,提高員工效率,最終提升用戶的體驗。

概念讀起來有些生硬,我們簡單來說:

首先舉個經典的栗子~

如果您想喝咖啡,有兩家咖啡店挨著,咖啡味道一樣,價格一樣,你會選擇哪家咖啡店消費呢?理由又是什么?同樣的兩個咖啡店,要做一款店面銷售APP,我們來看看兩家咖啡店是如何做的~

咖啡店A的做法:

召集設計師埋頭苦干了幾個月,然后交付給顧客,結果顧客在這個APP里并沒有得到想要的。

咖啡店B的做法:

與顧客交談,做研究和調研。觀察顧客們在喝咖啡前、喝咖啡時、喝完咖啡后都做些什么,并據此畫出用戶體驗地圖,找到他們在體驗地圖中的高潮和低谷點,以此找到服務的機會點,再開始尋求解決方案。

同時,團隊找到利益相關者,比如店員,聽聽他們平時遇到的問題,聽聽創始人對咖啡店最初的愿景,還有市場團隊、供應商等人…這些利益相關者們在一起開一個工作坊,他們確立明確的商業目標,開始設計出一些概念,并且向已有的顧客做測試分析。他們做了技術分析,并繪制了服務藍圖,確保中后臺系統能支持概念的落地,他們設計出了顧客喜愛的APP。

以上兩家咖啡店的案例呈現中,用戶接觸到的服務產品最終使用效果則大相徑庭。對于咖啡店的客戶來說,咖啡店B就是做到了服務設計。

為了加深大家理解,再舉個例子~

假設你家燈泡壞了,你要換燈泡,需要個梯子。

此時產品設計的工作就是設計這個梯子,怎么樣才能輕便好用,美觀大方。但是服務設計要做的是思考需要個梯子換燈泡這個需求,或者是燈泡壞了需要修這個需求,基于這個需求/問題,服務設計給出的解決方案可以是:

你需要一個梯子,但不需要在家里備一個

  • 有一個平臺可以提供租用梯子,按小時計費。
  • 社區(物業/社區自治組織)提供租/借的梯子(共享基礎工具)。
  • 梯子分享平臺,我用了你家的梯子,你可以用我家的電鉆。

你不需要一個梯子,你只想修好你的燈泡

  • 買燈泡的時候便附帶了修燈泡的增值服務
  • 處理修燈泡等雜事的人員雇傭平臺
  • 你平時在社區做義工,此時也會有社區義工前來幫你修。

以上這些方案如何選擇,如何完善,誰來買單?誰來運作?具體實現方式、傳達方式,包括產出方案,都是屬于服務設計的內容。

服務設計五大原則

為了更好的應用服務設計,設計師們需要了解服務設計思維的基本原則,并在打造服務時,聚焦服務設計思維的原則。輔助一些工具、方法去支持和實現原則基礎上的服務設計。

1. User-centered 以用戶為中心

以用戶為中心,服務需要從用戶的眼睛來看世界。無論是服務還是產品,其本質最終都是為了解決用戶的問題,因此我們必須始終貫徹以用戶為中心的思想,這是我們所有工作的基礎。

工具1:用戶畫像

在產品開發或創建服務的早期階段,需要首先明確:用戶是誰?他們的需求是什么?為什么會選擇我們的產品?理解用戶的第一步是創建用戶畫像。

用戶畫像基于群體的真實信息,由多維度數據組成,整合所有用戶群體信息的集群。除了人的自然屬性,用戶畫像也會含有如生活習慣、行為特征等人的社會屬性。汲取真實的,具有共同點的用戶信息,作為多維度數據。

這類數據最終可以代表一類用戶群體。用戶屬性在一定情況下可能發生改變。

例如,因工作原因更換居住地,飲食習慣的改變,網購習慣從化妝品變為母嬰用品等。用戶畫像是動態變化的過程,需要不斷迭代管理用戶畫像。

工具2:典型用戶

典型用戶又被稱為「真實虛擬人」(real fake man),因為盡管人物是虛構的,但它背后的動機和需求是真實的。

典型用戶越具體、特征越詳細,我們想要獲取的那個「終極用戶形象」就會越清晰真實!明確典型用戶和使用場景的關聯,避免孤立使用典型用戶,脫離用戶場景。

我們通常將典型用戶檔案打印成板或海報,方便整個團隊分享。復雜產品或服務的典型用戶會有多個,代表多種不同類型的用戶。

比如,網購平臺的典型用戶從職業和年齡的維度,可能會有商務精英、職場小白、在校學生、空巢老人、全職太太等。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

工具3:同理心地圖

同理心地圖通過多維度(所想、所感、所聽、所看、所說)描繪更加生動的用戶形象,便于跨領域團隊建立對目標用戶的同理心,從中得到意想不到的洞察。

同理心地圖可針對特定用戶群來描述:用戶的想法和感覺(think&feel)。

  • Hear-用戶聽到了什么。
  • See-用戶看到了什么。
  • Say&do-用戶說了什么和做了什么。
  • Pain-用戶的煩惱與痛苦。
  • Gain-用戶真正想要的東西與價值。

使用這個工具的關鍵在于要有同理心,框架只是輔助思考。同理心不是與生俱來的,但可以訓練得到。培養同理心的最好方式是帶入真實情境中,用身體與大腦去參與、模仿和感受。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》——同理心地圖以媽媽使用冰箱為例

工具4:影子計劃

影子計劃即像「影子」一樣伴隨用戶進行觀察,是對用戶體驗產品/服務的結構化觀察,主要用于新產品/服務的消費者研究領域,通過觀察用戶使用某些產品或服務時的情緒、肢體語言、節奏、行為模式和時間等信息來全面了解用戶。

工具5:AEIOU觀察框架

AEIOU是整理觀察記錄的框架工具,通常會在觀察時使用表單直接記錄,可以和影子計劃結合使用。

  • A-活動activity:人們為實現某一目標而實施的一系列行為。
  • E-環境environment:活動發生的場景。例如周遭環境的屬性、功能、特點、氛圍。
  • I-互動interaction:人與人、人與物、人與空間,或者人與數字之間的互動。
  • O-物品object:涉及物品。環境里有哪些物品?和用戶活動的關聯是什么?
  • U-使用者user:用戶

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

2. Co-creative 共創

服務設計所解決的是一項復雜的問題,它沒有正確的答案,只有最優解。如何找到最適合路徑?讓服務提供者和使用者以及不同的利益相關方,共同參與設計和創造的過程。借助不同背景、不同職能的人不同維度的思考,共同探索最優解。

共創,無疑是服務設計最佳的工作方式。

工具1:瘋狂發想法

人與動物或最好的人工智能之所以不同,是我們人類具備將「是什么」(what is)引導至「如果什么,將會怎樣」(what if)的能力。瘋狂發想法就是給挑戰一個不同的前提,在這種背景下思考更多的解決方案。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

工具2:頭腦風暴圖

如果您的思路還沒有被充分打開,還有另外一種常用的方法可以幫你拓展思考,那就是頭腦風暴圖。

頭腦風暴圖有九種角度的思考方案:替代法、借鑒法、逆向法、組合法、改進法、拓展法、消除法、轉換法、重組法。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

工具3:世界咖啡

世界咖啡的主要精神就是跨界。不同專業背景、不同職務、不同部門的一群人,意見互相碰撞,激發出意想不到的創新點子。人們很容易被自己的專業和經驗所限制,公司也很容易被既定文化或價值觀所限制,同構性越強,越不容易產生新的點子。

世界咖啡讓參與者從個人固有風格、學習方式和情感智商等維度中解放出來,用新的視角看世界。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

工具4:DVF篩選法

共創最后一個步驟也是最重要的一個部分是篩選,在眾多的概念中發現真正的滄海遺珠是一個巨大的挑戰。

我們可以從用戶、商業和技術三個維度來篩選概念,即DVF篩選法。

Desirable用戶合意性,Feasible運營/技術可行性,Viable商業可行性。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

3. Holistic 整體性

用戶體驗就像一場有計劃、有組織的精心設計的演出:它有高潮,也有低谷,它環環相扣地在講述一個故事,而用戶就身在其中。把握用戶的情緒和服務的節奏尤為重要,更重要的是由點及面地全局思考,保證這個故事的整體性。

工具1:用戶體驗地圖

用戶體驗地圖梳理了典型用戶從初次了解服務到形成契約關系的完整過程,站在用戶的視角再現用戶場景和服務流程的體驗感受。

此工具很實用,下圖是以一次部門內部設計分享演講為例,站在聽眾的角度設計演講的節奏、內容、互動等,關注聽眾的感受,才能讓這次分享演講達到想要的效果。

工具2:場景卡

場景卡用于描述不斷重復發生的問題,其作用在于從場景中獲得洞察,以及未來服務的機會。它和用戶體驗地圖的區別是它專注于單一的場景,可以更細微地了解用戶處境。場景卡經常和用戶體驗地圖搭配使用,用來展開思考重要觸點,甚至有時會融入用戶體驗地圖中變成一部分。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

工具3:服務供給地圖

服務供給地圖(offering map)是用來分析可提供給用戶的服務。可視化的方式可以更好地闡述想要提供的服務。由于用戶需求(needs)和服務端的供給(offering)有著直接對應的關系,在表達服務概念時,可以同時呈現用戶需求和服務供給。此時服務供給地圖通常需要展現邏輯和層次,因此多用信息架構圖表現。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

4. Sequencing 有序性

服務需要有邏輯、有節奏地視覺化展示出來。服務是在一段時間內的動態過程,時間線對用戶非常重要。服務的節奏也很重要,會影響用戶的情緒。

工具1:故事版

故事版是以用戶為主要角色,以爽點、痛點或者產品、服務與用戶的互動為劇本發展的「場景分鏡頭」,是講故事時的重要道具。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

工具2:桌面演練

如果說故事版是平面示意圖,那么桌面演練(desktop walkthrough)就是個三維故事版,能夠隨時補充新的想法,更快速的移動和判斷。它可以看成是幫助設計者模擬端到端用戶體驗的互動式的迷你劇場。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

工具3:戲劇原型

戲劇原型是用表演的形式,輔助一些簡單的道具來模擬搭建服務場景,展示服務內容,把服務體驗概念帶入日常生活場景的檢驗方式。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》

5. Evidencing 有形化

無形的服務需要被適時展現出來。服務很多時候是在后臺默默進行的,用戶無法感知。

工具1:服務藍圖

服務藍圖能幫助設計者視覺化呈現服務時如何被執行與運作的。用戶體驗地圖關注用戶在每個服務互動觸點所經歷的事情與感受,服務藍圖更注重服務中的各個要素有沒有被正確地設計和整合在一起,來描述整體的體驗流程。

△ 圖片摘自:《服務設計驅動的革命:引發用戶追隨的秘密》-共享汽車服務藍圖

工具2:服務缺口

服務缺口是用戶對服務的期待或需求和實際接收到的服務之間的落差。服務缺口是一個分析模型,可以用來探討服務發生的原因。

工具3:利益相關者地圖

利益相關者地圖是以圖畫來視覺呈現和理清所有利息相關者之間的方法。與服務有關的各個群體因為共同的利益聚在一起,服務提供方在解決問題時就能夠善用資源。對利益相關者來說,綜合全面的概述是改善服務或創新嘗試所必須的。

△ 圖片摘自:利益相關者地圖 Stakeholders Mapping

服務設計與用戶體驗設計的區別

體驗設計關注觸點和人,而服務設計則是由表及里,將觸點、用戶體驗和組織中后臺支持都規劃在內,體驗設計是服務設計的起點。

△ 圖片摘自:服務設計又來了!服務設計強調的是「幸福感」

另一個區別就是服務設計的收益者是雙方(提供者和接收者),而用戶體驗則聚焦于用戶。

說到這里,可能部分同學還是沒有記清楚服務設計的和用戶體驗設計,其實服務設計包含了用戶體驗設計,也包含人性化設計或者情感化設計等等。如果一個設計只有接收者單獨受益,那不能稱之為服務設計,只能說是針對用戶的用戶體驗設計。

個人感悟

世界變化如此之快,你還站在原地嗎?我們時刻走在學習的路上,不斷地武裝自己。遇到新的概念或者方法論,要先深入了解并進行獨立思考。實踐才能出真知,多應用到自己的項目中,結合項目進行實踐和反思,讓我們在設計的路上走得更遠!

敲黑板劃重點,服務設計思維,我們講了這么多~分享出去跟小伙伴一起學習吧,你也要記得來復習哦~

文章來源:優設    作者:Design with CloudAI

2020年設計師應該掌握什么樣的設計思維?

濤濤

你的設計是否能被理解?為什么設計的價值總是不被人認可?本文將從深入淺出,帶你了解全局性設計思維的真正力量。

導讀

你的設計是否能被理解?為什么設計的價值總是不被人認可?

設計不僅僅只是帶來美感,好的設計能夠為產品、公司甚至整個社會創造巨大的價值。而在創造好的設計這個過程中,最重要、也是最容易被人忽視的,便是設計思維。

何為全局性設計思維?它能夠為設計師帶來哪些價值?本文將從設計的本質出發,結合設計的發展趨勢,帶你了解全局性設計思維的真正力量。

目錄

  • 我們為什么需要設計思維?
  • 下一個時代在哪里?
  • 互聯網「下半場」,從大勢中看變化
  • 設計思維的轉變,差異與融合
  • 探尋全新的思維方式
  • 全局性設計思維概述
  • 如何運用全局性設計思維?
  • 以全局性設計思維,構建設計體系

這篇文章的主要內容,來自我在 19 年底的一個沙龍分享。整個分享以設計思維的角度入手,講述了全局性設計思維的來源和重要性,以及我是如何在不同產品線上去運用這種設計思維的。

何為全局性設計思維?為什么要講這種思維方式?

這是我一直在探索并實踐的一種設計思維。從最開始的理論雛形,到各種項目的實踐,不斷進行修正和完善,最終形成了一套卓有成效的思維方式。通過這種思維方式,我逐步幫助產品解決了許多長期性的問題,并最終構建了各種不同類型的設計體系。最終,隨著品牌矩陣與產品體系的落地,形成了一個完整的網易智慧企業設計體系。

△網易智慧企業設計體系

因為篇幅原因,本篇文章將重點從理論層面闡釋全局性設計思維的導論、價值及使用方式。而具體的實戰案例,我之后將會以另外幾篇單獨文章的形式進行展現,并詳細講解在設計過程中的一些細節與過程。希望能夠幫助大家更深入地去理解如何根據不同的場景正確地去使用這種思維方式。

未來可能會包含以下幾篇文章:

  • 全局性設計思維 | 如何打造強大的品牌體系
  • FishDesign 組件庫 | 從零到一構建企業級 UI 組件庫
  • 全局性設計思維 | 如何構建事業部級大型設計體系

當然,目前的設計體系僅僅只是一個開始,未來還有很長的路要走。

希望本文能夠為你帶來小小的啟發,讓設計思維幫助你更好地發揮設計的價值。如果你對某一方面特別感興趣,可以直接跳到這一章進行閱讀,無需浪費過多時間。如果你有任何疑問,也歡迎隨時與我交流。

一個習慣性的序

這次把序放在了第二段,這樣子看上去就不那么不務正業了哈哈。當然,寫序更多的是為了記錄生活,希望每一篇文章不僅僅只是傳遞知識,更是一篇有溫度的文章。

整個 2019 年中,經歷了很多事情,人生觀也隨之發生了些許變化。

從并肩作戰的同事的不斷離去,到逐漸需要考慮團隊的發展。從單打獨斗闖天下,到思考如何讓整個團隊更加優秀、如何建立完善的設計體系等等。

角色、心態、責任,以及如何坦然地面對自己。

活在當下,用心生活。這是我一直當作座右銘的語錄,也是我希望給自己的承諾??偸窃噲D去嘗試這種狀態,但卻異常艱難。像我這樣的人,看上去總是「積極向上」,總是「規劃未來」,總是希望事事完美,強迫著每個細節的完善。但不知不覺中,人生好像開始進入了「自動駕駛」的模式,活在了過去的思索中,活在了未來的規劃中,唯獨對于當下異常麻木。

這并不是我想要的生活,我開始嘗試做出改變。

偶然間,通過一些書籍,我開始嘗試正念禪修。感受每個呼吸中空氣的流動、感受身體的每個部分、感受當下空間發生的每一件事情。雖然只是很淺顯的境界,但正念依然對我產生了巨大的影響。我開始重新地審視自己的人生,審視自己的生活狀態。

△ 網易蝸牛圖書館:與快樂的小伙伴們

這種感覺,就像再次的呼吸了新鮮空氣一樣。

我們其實只存在于當下的時空中,過去和未來,并非真實存在的事物?;叵胍幌?,我們有多久沒有像小時候一樣,完完全全、毫無雜念地享受在當下的時光中了?

用心活在當下,平靜地接納一切發生的事物,這種感覺真是太美好了~

我們為什么需要設計思維?

對于設計師來說,什么能力更為重要?是設計這門「技術」本身,還是思考如何去設計的「思維」能力?

對于不同的設計師來說,一定會有不同的答案。

這兩種能力本身并不矛盾,他們相互影響,互相促進——就像「術」與「道」之間的關系。設計能力決定了設計作品的輸出質量,而設計思維則決定了你思考問題、解決問題的能力。

然而,在現實的大環境下,「術」的重視程度遠高于「道」,造成了很多設計師與日常業務的「分離感」。以至于,多數的設計師,無法將自己的設計能力有效地用于日常業務中;抱怨他人不理解設計,也因此錯失了許多機會。

重視設計美感,其實并沒有問題。視覺是最直接的表現方式,我們從最初開始喜歡這個行業,并最終成為設計師,大概都是因為如此。包括我個人,也是美感的追求者,常常為了幾像素的細節,調整無數稿。也常常沉浸于自己的作品無法自拔。

但是,美感之后,設計還需要什么?

路易斯·沙利文曾講過:「形式追隨功能」。而功能存在的意義,則在于解決問題。視覺的形式、美感,很多時候只是包裹在外側的表層,而解決問題才是設計真正的核心。視覺的表現,一定要遵循解決問題的方式,向用戶傳遞恰當的信息,最終引導用戶以此來解決問題。

因此,我更希望更多的設計師,在追求美感的同時,能夠重拾設計思維本身,尋找設計最根本的價值。

我們其實可以站得更遠一些。學會去理解事物,學會用設計去解決問題。再以此為基礎,通過你的設計能力去塑造它、點亮它,讓它成為一個真正美好而又有價值的設計。

而設計的價值,將會成為你的價值。

下一個時代在哪里?

互聯網時代中的數字產品設計,需要什么樣的設計思維?或者說,當下我們需要什么樣的設計思維?

這個問題的答案,好像一直在變。

互聯網本身便是一個新的形態,1989 年「萬維網」發明,1996 年中國引入互聯網,到今年已經有大約 24 個年頭。我們經歷了不同的互聯網時期,而「設計」的概念也一直在變化中。

Internet 1.0 PC 互聯網時代。在這個時代,我們將大量的信息虛擬化,并通過網絡進行信息傳遞。而我們的「設計師」們大多被稱為「美工」,我們的「設計思維」,便是將信息變得更好看。

Internet 2.0 移動互聯網時代,或者稱為消費互聯網時代。自從 2007 年喬布斯發布第一代 iPhone 之后,疊加 4G、wifi 等技術,手機成為日益重要的終端,世界逐漸進入了移動互聯網時代。伴隨著 iPhone 與其應用的出現,喬布斯讓所有人理解了「用戶體驗」的重要性。我們不再是「美工」,我們變成了「UI 設計師」、「交互設計師」。而這個時代,我們的設計思維變成了「用戶體驗思維」。

那么,下一個時代在哪里?我們的設計思維又將如何轉變,才能適應下一個時代?

互聯網下半場,從大勢中看變化

1. 紅利消失、增長觸頂,互聯網下半場到來

最近幾年,我們已經能夠明顯地感知到——互聯網的「寒冬」真的來了。隨之而來的,便是互聯網的發展方向似乎也正在發生變化。于是大約從 2017 年開始,互聯網圈內逐漸出現一個新的名詞——互聯網「下半場」。人們普遍認為,中國的互聯網將會由消費互聯網時代進入下一個時代,即互聯網下半場。

我并不完全認同互聯網「下半場」的稱呼。互聯網本身是一個年輕的行業,中國互聯網「下半場」,其實更像是互聯網發展方向轉變的標志。

因此,我們認為的下一個時代的方向,也許將會是 Internet 3.0——即產業互聯網時代。

互聯網為什么必須要進入下一個時代?

對于互聯網企業來說,一方面在成本端,隨著人口紅利消退,勞動力價格上升,企業的成本將逐漸升高,倒逼管理者使用系統和工具來提率;另一方面,在收入端,野蠻增長的時代結束,增量經濟轉向存量經濟,紅利經濟轉向效率經濟。

在「成本」與「效率」的雙重壓力下,再加上整個市場經濟的下行周期,整體經濟出現下滑,而一些依靠融資的互聯網公司將難以為繼。因此企業不得不尋找方法來提升效率,降低成本——而這正是企業級軟件(ToB 產品)最擅長的地方。

因此,在互聯網寒冬之下,ToB 市場便理所應當地開始被重視。

讓我們縱觀整個中國市場的發展,互聯網的興起雖然促進了消費領域的蓬勃發展,但產業領域的發展則因此受到了巨大制約。中國率先從消費端、從第三產業開始數字化,然而在第一、二產業的數字化進程似乎并不是很快。一個重要的原因是,人口紅利促使了消費互聯網的快速發展,而這種紅利讓人們忽視了產業互聯網的重要性。

在寒冬之下,我們終于發現,消費互聯網蓬勃的基石,正是底層堅實的產業互聯網。產業互聯網如果不能得到有效的發展,則整個市場經濟將無法更進一步地發展。

因此,產業互聯網時代的到來,是中國互聯網發展的需要,也將是大勢所趨。

2. ToB市場將迎來機遇

產業互聯網的發展,需要依托 B 端領域的發展,并逐步融入并帶動整個產業進入互聯網時代。那么,B 端產品在中國目前處于一個什么階段呢?

對于整個中國的 ToB 行業發展現狀,大多數的人并沒有一個清晰的概念。盤點中美上市的科技公司會發現,美國 toC  領域與 toB 領域市值之比是 6:4,但在中國這個數字是 20:1。

雖然互聯網的整體環境不同,但中國 ToB 行業的發展,顯然是落后太多了。于是乎,2018 年開始,BAT 大舉布局,PE、VC 加速進場——中國 B 端產品已經逐漸進入必須發展的時候了。

中國市場已經坐擁全球最發達的消費互聯網體系,而產業互聯網的發展卻嚴重滯后。

同時,對比 B 端中云計算領域的 IaaS、PaaS、SaaS 三層架構,全球市場中 SaaS 占據了 52.5% 的份額,在中國卻是 IaaS 分走了最大的蛋糕,占比達 61.2%。中國市場 VC 的投資總額已經與美國相當,在 SaaS 領域美國企業獲得了全球 70.1% 的融資,而中國只有 11.7%。

因此,在互聯網下半場,相對于 ToC 行業的觸頂,ToB 行業將會迎來歷史級的發展機遇,隨之而來的將會是產業互聯網時代的逐漸到來。而在整個 B 端產品的類目中,SaaS 產品作為企業級軟件中最集成的產品,也將隨著這股浪潮迎來爆發式的增長。

什么是 SaaS 產品?很多同學并沒有接觸過 B 端行業,平時用到的也都是 C 端產品,所以對 B 端產品的了解比較少。在 B 端行業最熱門的云計算領域中,目前普遍會分為三層架構。SaaS(Software as a Service–軟件即服務);PaaS(Platform as a Service–平臺即服務) ;IaaS(Infrastructure as a Service–基礎架構即服務)。

附:云計算領域,三種不同的架構與對應的服務。

PaaS 基于 IaaS 實現,SaaS 的服務層次又在 PaaS 之上,三者分別面對不同的需求。越往上層,產品的集成度越高,提供的服務也就越豐富,而用戶所需要的自行解決的東西就越少。而最頂層的 SaaS 產品,便是用戶可以直接購買并使用的云端產品。

我們為什么要了解這些趨勢?

因為一個新的時代,對應一場變革,也將成為一次新的機會。不管是 SaaS 產品還是其他 B 端產品,都將在新的時代中逐漸得到重視。而 C 端產品的發展策略,也將迎來新的變化。對于許多設計師來說,這將會是一個新的機遇。

順勢而為,方能乘勢而上。

設計思維的轉變,差異與融合

那么,在逐漸到來的產業互聯網時代,設計師需要注意哪些東西?設計思維又將進行如何轉變?

產業互聯網時代,意味著 B 端產品將得到重視,并與 C 端產品逐漸趨于平衡。因此,了解設計思維的變化,我們首先要從 B 端與 C 端產品之間,在產品設計與產品策略之間的差異性說起。

1. 服務對象的差異性

從服務對象來看,C 端產品的服務對象是人,產品的目標是針對人們生活方式進行的變革、升級。而 B 端產品的服務對象則大多是企業,目標是幫助企業進行商業效率的提升,從而產生價值。

服務對象的差異性,決定了產品在發展策略也將存在著較大的差異性。

2. 產品「打法」上的差異性

從宏觀的打法上看,消費互聯網時代會更求「快」,而產品互聯網時代則會更偏「穩」。

C 端產品的服務對象是人,而人的需求在個體差異性上相對變化較小,這就決定了 C 端產品通常都擁有廣闊的用戶市場。

因此,消費互聯網時代就像是資本在遼闊平原的角逐,長驅直入。講究快速占領市場,不斷地試錯、不斷地調整。從團購到直播,從打車到短視頻領域的興起,再到最后的單車大戰落幕。消費互聯網時代的每一次風口,都伴隨著各種「游擊戰」式的競爭。入場速度、快速調整能力、資本深度,都直接影響了最后的結果,而最終的結果也往往是勝者為王,敗者將快速地被市場淘汰。

B 端產品的服務對象是企業,而企業間的需求差異性則非常巨大,這就決定了 B 端產品通常需要較強的縱深能力。相對應的,其用戶群體在總量上就比較小、但也相對穩固。

因此,產業互聯網就像在崎嶇叢林的蹣跚前行,漸次演進,如同一場曠日持久的拉鋸戰。一方面,產業互聯網的鏈條非常長,需要長期的深耕、積累才能逐漸站穩腳跟。而這也導致了產品的壁壘足夠深厚,同類產品在短期內無法快速跟進。另一方面,企業間的差距需求的差異性非常大,因此產業互聯網存在非常多的細分市場,不同的產品各自在不同的賽道中深耕。而其最終的結果往往是百花齊放,各自盛開。

3. 整體行業的協同發展

雖然整個市場都不斷地強調——ToC 增長觸頂,ToB 是一片藍海。但這并非是「取而代之」,而是逐漸走向整體的「協調發展」。中國 ToB 的發展的一個重要根基,其實是「中國擁有世界上最成熟的消費互聯網體系」這一巨大的優勢。

因此,ToC 在很長的時間內,仍然會是互聯網的主力,而 ToC 市場的轉型,也將有賴于 ToB 產品所提供的服務。

而隨著中國將「互聯網+」政策上升為國家戰略,更是明確了以互聯網帶動傳統產業的發展方向。因此,互聯網的下半場,即產業互聯網時代的最終形態,將是互聯網與傳統行業的「融合式發展」。

ToB 產品將會成為帶動互聯網下一輪發展的核心驅動力。一方面幫助 ToC 領域完成轉型,進入更健康、更穩健的發展階段;另一方向,ToB 領域賦能傳統產業與互聯網相融合,并最終完成產業升級。

4. 產品形態的融合與趨同

整體產業的融合趨同,意味著產品的特性也將互相融合。一個很重要的現象是:C 端產品逐漸變得不那么 C 端了,而 B 端產品也越來越變得不像 B 端了。

比如 C 端產品的主流賽道中,隨著頭部產品的賽道日漸趨于穩定,其產品體量也因為業務擴展而不斷增加。同時,因為產品體系的逐漸形成,為了服務更多的 C 端用戶,會有越來越多的 B 類用戶進入平臺,而為了滿足 B 類商家的需求,產品的 B 端屬性變得越來越強了。

而隨著 B 端產品的不斷受到重視,原先不被重視的產品 UI、用戶體驗也逐漸在 B 端產品中得到加強。B 端用戶雖然服務于 B 端,但使用者終究是人。而隨著競爭的不斷加劇,原來的「重功能、輕體驗」思路逐漸式微。我們逐漸發現,許多 B 端產品長得越來越像 C 端產品了,甚至在 UI 和體驗層面做的與 C 端產品不相上下。

因此,隨著產品屬性的融合趨同,意味著設計思維勢必會與消費者互聯網時代存在差異。而我們的設計思維將不僅僅局限在誕生于消費互聯網時代的「用戶體驗思維」。我們需要更新的、更廣闊的設計思維,以滿足下一個時代的產品發展需要。

那么,新的思維是什么?它將從何而來?

探尋全新的思維方式

從整個市場的協同發展,到產品形態的融合趨同。那么,我們的設計思維需要如何進行相應的變化?是同樣進行「融合趨同」,還是另辟蹊徑,尋求新的視角?

1. 關鍵詞提取

首先,不管設計思維如何變化,它一定需要同時滿足兩種產品設計思維的特性。通過前文的分析,我們可以在產品設計特性的維度,提取各自的關鍵詞進行分析:

產品體驗:誕生于消費互聯網時代的用戶體驗思維,在產業互聯網時代依然是產品設計中最重要的部分。無論是 C 端還是 B 端產品,用戶體驗必然是產品的核心競爭力,只有足夠好用、好看,產品才能獲得更多用戶,最終獲得商業上的成功。

靈活性:在消費互聯網時代,在激烈的競爭中,C 端產品的靈活性的打法對于產品的突圍至關重要。而未來的 B 端產品競爭將會加劇,這就需要 B 端產品也逐漸需要較強的靈活性。

成長性:產品的發展必將伴隨著不斷的變化,特別是具有一定體量之后,產品設計的成長性將至關重要。因此,產品的設計是否能夠預見未來發展,滿足不斷變化的產品形態,伴隨著產品不斷地成長,也將成為產品是否能夠持續獲得成功的關鍵因素。

產品效率:因為產品服務對象的關系,B 端產品一直是產品效率的代名詞。而在人口紅利消失與經濟下行的壓力下,產品效率將成為所有企業關注的重要因素之一。產品的效率不僅影響著企業的成本,也是產品競爭力的重要體現。

這四個關鍵詞,將會是我們在未來所需要關注的四個重點關鍵詞。越是往左,則「C」屬性越強,因為它更多地從用戶的角度出發,更關注用戶體驗。而越是往右,則「B」屬性越強,因為它更多地從企業的角度出發,更關注企業的長期發展。

2. 跳出單一層面,尋求新視角

在四個關鍵詞中,我們會發現,特性越是靠右,其所需要的整體性就越強。要滿足靈活性,就需要用戶體驗與產品策略相關聯。要滿足成長性,則要進一步結合底層的開發能力。而產品效率的提升,則需要產品的設計與不同層面都有著緊密的耦合。

在互聯網設計發展的過程中,我們從單點只關注視覺表層的「美工時代」,逐漸發展為關注線性的「用戶體驗思維」。在對于產品用戶體驗層面,確實有著長足的發展。

但是,單一層面的用戶體驗思維,在逐漸成熟的互聯網時代中,逐漸顯示出了一定的局限性。我們的價值局限于單一的體驗層面,我們似乎無法對產品形成更大的影響力,也難以為產品帶來體驗之外的更多價值。

因此,設計思維想要滿足新時代的需求,就需要同時滿足前文提到的四個關鍵詞。這就要求我們需要跳出單一層面,以全局的維度去思考產品的設計。

因此,全局性將成為未來的關鍵,我暫且將這種思維方式稱為——全局性設計思維。

全局性設計思維概述

全局性設計思維,即在設計過程中,始終能以更高的維度去審視全局,思考當下的設計。

何以全局,如何跳出單一層面?這種思維方式的前提,是你要首先了解整個產品(亦或是物體、組織等)的運行方式,清楚的知道整個產品需要達到的目標,從而準確、合理地對針對目前的局部做出設計,并最終構成整個完整的形態。

而「全局」的前提,是你擁有更高的眼界。你的眼界越高,你對產品、市場、甚至整個社會的洞察就越全面,你就能夠解決越大的問題,你能夠實現的價值就越高。眼界是基礎,解決更大的問題是目標,而全局性設計思維則是實現這個目標的方式與過程。

全局性設計思維,可以幫助我們跳出產品的單一層面,去思考從產品層、到體驗層、再到開發層這一完成的整體。讓設計滿足體驗層的同時,滿足產品層面的目標,同時讓產品的設計與開發高度耦合,將整個產品串聯成一個完成的整體。

好了,講了這么多,我們具體應該如何去運用全局性設計思維呢?

全局性設計思維的運用方式

全局性設計思維,的應用方式非常廣泛。它并不是一個固定的方程式,而是一個更高層面的指導性設計思維,能夠通過不同的形式,來幫助你解決問題。

1. 全局觀——在生活思考更多可能

在嘗試這種思維之初,我們可以通過一些小的實踐,去鍛煉這種思維能力。

在日常的生活、工作中,其實我們有大量的事物可以練習和運用這種思維方式。比如你在裝修一個大房子,需要去選擇房子里的家具。當你在購買家具時,常規的思維方式是:這個家具在某個房間時應該是怎樣搭配的,所以我要購買什么樣形狀、顏色的家具,來滿足這個房間的需要。

但是,用這么思維方式來購買家具,將為對家具的靈活性與長期價值造成一定影響。從居住環境的長遠來看,也許這個家具有可能會因為某些原因,需要放到另一個房間,而它的形狀、尺寸、配色卻無法滿足其他房間的需要。最終,我們只能重新購買,或者接受一個風格、尺寸上并不搭調的房間出現。

因此,當我們在購買家具時,我們是否可以利用全局性設計思維,從整體空間的角度出發(而非單個房間),去思考如何讓家具滿足更多空間需求。長此以往,我們不僅可以打造一個風格統一的大空間,同時也能增加每個家具的利用率,在無形中也增加了這個家具本身的價值。

之所以舉家具這個例子,是因為這個原理與產品設計的原理非常類似。你可以將這個房子看成是整個產品,而家具則是不同的組件。通過不同的家具(組件),構成了我們的不同功能模塊(房間/功能區),而所有的功能模塊則構成了整個產品(房子)。

房子(產品體量)越大,房間/功能區(功能模塊)就越多,家具(組件)的多樣性、復雜性就越高,我們就越是需要從全局的角度去思考裝修的統一性(風格體系化)和家具的通用性(樣式組件化)。只有這樣,我們才能更好地去打造一個風格統一、體驗一致,同時又具備足夠自由調整空間的「大房子」。

2. 全鏈路——從全流程中重新思考設計

當你仔細地去理解許多非常著名的設計作品時。你會發現,幾乎所有優秀的、巧妙的設計,往往在設計中都體現了全局性的設計思維。它不僅僅解決著當前的問題,同時也能夠解決更大的問題,發揮巨大的價值。

比如著名的坂茂衛生紙的設計,看似普通,只是將衛生紙的軸心從圓形改成了方形,但它卻成為了舉世聞名的、公認的好的設計。為什么呢?

我們先了解一下這個設計為什么好。

首先,傳統的圓形紙卷拉出來的紙會比你實際需要的更多。而方形紙卷則由于阻力的作用,讓你用得更少,從而起到了解決資源的作用。其次,在運輸過程中,圓形的紙卷之間會產生很大的空隙,而方形紙卷則能夠緊緊靠在一起,提升空間利用率,從而起到降低運輸成本的作用。

這簡單的設計,居然發揮了如此大的作用。

那么,為什么我們在設計時就沒有考慮到這些問題呢?因為我們從最開始,就沒有從「紙」的整個全流程來去思考問題。

讓我們「站的更遠一些」,紙這個商品,并非只是我們見到的在商店售賣的那一刻。它從工廠中制造完成,通過運輸送到每個超市中,當我們購買以后,它又會在很長一段時間內,出現在衛生間,陪伴你使用的每一刻。我們可以將整個流程分為 3 個場景,而每個不同的場景,又將會對紙本身有著不同的影響。

  • 運輸場景——衛生紙的運輸成本——衛生紙的價格
  • 售賣場景——衛生紙的造型、包裝——影響用戶購買
  • 使用場景——衛生紙的使用過程——影響用戶的使用體驗

當我們能夠考慮到衛生紙的運輸過程時,我們就可以通過設計去降低運輸成本;而當我們可以考慮到用戶的使用場景時,我們就可以通過設計,去提升阻力,降低使用量,間接地去提升用戶的使用體驗。而當我們通過全局性設計思維,可以同時解決這三個問題時,我們的設計就是好的設計,就擁有了更高的價值。

發現了嗎,為什么你沒有想到相同的設計方案?設計能力并不是關鍵,設計思維才是指引你做出好的設計的前提。當你能按上述的方式,去思考整個流程、不同的場景,我相信大多數的人都能夠設計出坂茂的設計方案,甚至比這個方案更好的解決方式。

以全局性設計思維,構建設計體系

通過前面的兩個案例,相信大家已經了解了全局觀、全鏈路兩種應用方式。

那么,我們最最最關心的問題——如何在業務中去使用這種思維呢?

在產品設計中,全局性設計思維也有著非常多樣化的使用方式和場景,在之后的文章中我也會講到很多應用方式。但是,在所有的方式中,我認為最為有效的,便是以全局性設計思維,幫助產品去構建一個完整的設計體系。

1. 設計體系概述

什么是設計體系?談及設計體系,大多數設計師會認為,設計體系就是設計規范?!覆痪褪钦覀€名次包裝一下規范嘛?」

我們為什么需要設計體系?它與設計規范有何不同呢?

設計規范是設計師最為熟悉的一種規范文檔。在產品設計時,優秀的設計師通常都會建立設計規范。然而在實際的項目中,設計規范往往無法難以有效實施。比如在開發眼中,規范并不符合開發規則,過于碎片化。而產品經理通常又不會去了解設計規范,因此在構建產品框架時也常常隨意發揮。

很多項目做到最后,設計規范僅存在于紙面的意義,并隨著項目的發展逐漸混亂。為什么會這樣?

因為不同職能間的思考方式存在差別,設計規范對于其他職能來說經常難以理解與運用,無法與其他職能形成有效聯動。

設計規范僅僅是基于視覺層面的規范,它是一個「平面」。而設計體系則是貫穿于產品的每個層面的、與產品深度結合的完整體系,它是「立體」的「有機生命體」。

設計體系的核心在于「體」,它是貫穿于整個產品的完整體系。設計體系由設計師創造,并深度融合于產品每個部分。它能夠讓產品更緊密、更統一、更有序,伴隨著產品的生長,與產品共同進化,并最終推動產品的發展。

創造并推動這一體系,則要求設計師需要更全面的能力。只有充分地去理解并參與產品的每個部分的設計,才能讓設計真正延伸至產品的每個部分。

而創造這一切的前提,便是全局性設計思維。

2. 設計體系的構建法則

羅馬不是一天建成的,設計體系也是如此。設計體系的建立是一個漫長的過程(與產品體量相關),需要在前期投入更多的精力。但若是你的方法得當,就會在項目中越來越輕松,并以此形成良性循環,而你也會越來越有成就感。

如何正確地去構建設計體系呢?我在這里總結了幾個要點:

樹立觀念

首先,樹立長期的體系化意識是必要前提。在任何項目中都要時刻保持體系化思維,著眼于整個項目,去尋找體系化的推動時機。當你在潛意識中擁有這種思維之后,你會自然而然的將其植入到設計中。

以解決問題為導向

體系化并非憑空建立,而是建立在解決問題的基礎之上。設計體系的本質,就是由無數個標準化的解決方案,最終構成的一個完整的體系。因此,我們要以解決問題為導向,以全局性思維去思考問題的本質,最終建立適用于全局設計體系。

以小為始,重視質量

腳踏實地,從小處入手,去發現產品中最基礎的一些問題。表面上看這些問題,對項目影響不大,但他們數量龐大,加在一起便會嚴重影響整個產品的效率。因此,我們要首先建立高品質的基礎體系,再以此為基礎構建更大的體系。

不要一開始就設法建立一個巨大的體系,那樣只會是一盤散沙,因為它的結構是無序、混亂、不健康的。而這也是大多設計規范缺乏有效性和可實施性的根源。

梅拉妮·米歇爾的《復雜》一書中講到,任何復雜系統,都是由無數個體通過簡單的算法所構成的。在算法領域也是同樣的原理,一個優秀而強大的代碼,必然是由無數個小型模塊,通過簡單的算法耦合形成巨大的代碼矩陣?;A算法越強大、代碼結構越「健康」,可擴展性和靈活性就越強,其能力就越強大。

從規范入手,由面到體

從本質上來說,設計體系是由「多個層面的規范」組合而成的。因此,由設計師推動的體系化建設,往往最初都是從設計規范這一「單層規范」開始。但是,設計體系的建設需要將單層的規范,通過不同的方式,轉化為不同層面的規范,最終由面到體,形成體系化。

換位思考,尋求跨職能合作

設計體系的建立與維護,通常需要多職能的通力協作。因此,我們需要經常換位思考,在完成設計的工作,幫助其他職能完成目標。只有這樣,才能得到更多的信任,并以此為基礎推動更多體系化的建設。

比如我在設計一個功能模塊的頁面時,首先會與不同模塊產品經理進行交流,了解不同的業務需求,并從產品層面就開始尋求統一性與通用性。這樣的話,當其他模塊需要同一個功能時,前端便可以直接復用,同時后端的數據也可以進行互通。而在開發端,我也會詳細了解不同端的開發實現原理,務求設計規范與開發規則在理解上的一致性。這一既方便了開發理解規范,同時也從根本上提升了開還原的準確性。

長此以往,整個團隊就能夠建立良好的溝通和互信關系。有了這種默契,設計體系的推動就容易多了。

保持優化,不斷成長

設計體系的另一個重要價值在于,它是可以伴隨產品不斷成長的。所有產品都是在發展中不斷變化的,過分僵硬的規則,將會對產品發展起到反作用。

在業務發展中,產品一定會不斷地加入新的功能模塊,并對原有頁面作出相應的調整。因此,設計體系需要時刻與產品策略保持一致,及時與上下游職能溝通,不斷地針對產品發展進行優化,以保證設計體系能夠符合產品的發展需要。

使用正確的推動方式

體系化最終能否成功實施,推動的方式至關重要。

在日常的項目中,大多數的業務方對設計體系了解甚少,也難以體會其中的價值。因此,他們通常會認為這些東西毫無必要,多數情況也不太愿意配合體系的推進。如果強行推進,反而會引起不必要的阻力,招致反感。那么,我們應該如何正確的去推進設計體系建設呢?

為他人帶來價值:首先,尋找雙方共同的利益點是首要任務。也許是可以讓其他職能的工作更,也許能夠促使其達成 KPI,再不直接,那也一定能夠為整個產品帶來價值(不然你也沒必要推了)??傊?,設計體系一定要能夠為他人帶來價值,這樣才能順利推進。否則人家憑什么要協助你推進,因為你美麗可愛嗎?你也可能比較可愛,但總歸是不能一直這么來吧。

在解決問題后提出方案:不要一開始就啪一下拋出一個「宏大的理想」,大部分人會覺得你不切實際。你只需要通過這個體系,幫助業務方先解決一個問題,然后再提出你解決方式的來源——一個嚴謹的、可驗證的、長遠價值的體系化解決方案。

尋找合適的推動時間:最后,對于設計體系來說,尋找到正確、恰當的推進時機至關重要。比如當你在平時突然想要提出,對現有品牌進行升級時,大多數業務方都會認為你是沒事找事。而如果情況是在新的一年中,產品進行了概念的升級,這時候你將概念以及未來的品牌規劃融入在你的方案中,再去推進品牌升級,就會容易很多了。

文章預告

-本文旨在引導大家更好地理解和學習這種思維方式,想要用好全局性設計思維,光靠講是遠遠不夠的。最重要的是能將這種思維帶入到產品中,為業務帶來更大的價值。

因此,在后續的幾篇文章中,我將通過不同類型案例,為大家深入講解全局性的具體實踐案例。

全局性設計思維 | 如何打造強大的品牌體系

為什么要建立品牌體系?品牌體系有哪些價值?設計師應該如何推動品牌體系的建立?

本文將帶你了解網易智慧企業品牌體系的建設與推動全過程,聊一聊品牌體系建設的那些事兒~

FishDesign組件庫 | 從零到一構建企業級UI組件庫

我們為什么要建立組件庫?在產品的什么階段需要組件庫?如何抽象業務組件?組件庫設計過程中有哪些重要的細節需要注意?

本文帶你深入了解,網易 Web 端組件庫——FishDesign 組件庫從零到一的完整全過程。

全局性設計思維 | 如何構建事業部級大型設計體系

設計體系有什么價值?如何基于不同的業務建立設計體系?設計師如何推動體系化建設?在體系化過程中有哪些需要注意的地方?

我將會在這篇文章中,為大家介紹網易智慧企業設計體系構建全過程。

樣式組件化+規范體系化,形成產品設計體系,整體重構產品線。

結合品牌體系,推動事業部更多產品加入體系,形成智慧企業 Web 端產品設計體系。

推動更多產品/業務融入體系中,讓智慧企業設計體系不斷成長,賦能業務發展。

寫在最后

好吧,似乎文章又寫得偏長了一些。只能說,想要認真地講清楚一個道理,確實不是一件容易的事情。

設計思維本身并不復雜,但想要講清楚它的背景、原理及價值,就需要把它整個掰開來講。而為了確保設計思維的可實施性,又需要經過大量的實踐研究,自己能夠走通以后,才能與大家分享。

坦白講,似乎整個社會都在追求快節奏、碎片化閱讀。但若是因此而喪失了自己學習的節奏,那么等于是沒有節奏的,你的知識體系也將是東拼西湊,無法形成一套完整的體系。這也是我更新比較慢的原因之一,希望大家讀完文章,能夠切實地得到一些東西,這就很有意義。

文章來源:優設    作者:Jady13

超全面!「無障礙設計」指南

鶴鶴

你知道嗎?視力,聽力和行動能力完全健康的人,可以輕松地讀寫,可以有效執行多任務,并且始終可以正常工作的人約占總人口的50%?其余的人都是戴著眼鏡或有色盲,手腕或耳朵受傷,生活在嘈雜的環境中或網絡信號質量差,忙碌或忙碌中,閱讀障礙或有注意力障礙等。


這意味著大約一半的用戶可能很難使用我們的產品或瀏覽我們的網站。因此,我們可能錯過了提高用戶滿意度并擴大受眾范圍的機會。

不過在設計階段實施一些簡單的原則就可以改善交互和整體用戶體驗,極限設計可以為所有人帶來價值,我們稱之為“包容性設計”。


什么是包容性設計?包容性設計考慮了盡可能多的人的需求和能力,而不僅僅是針對殘疾人。它認識到我們的需求會隨著時間和環境的變化而變化,因此它會預測錯誤,掙扎和不同的交互方式。它的目的是在問題發生之前解決問題,提高標準并改變良好產品設計的標準。


包容的用戶界面是善解人意,有意識且可訪問的。年齡,性別,教育程度,財富和能力等不同特征,在不同環境中生活或工作,獲得技術水平不同的不同人群可以舒適地使用它。


我們將使用POUR作為在用戶與界面之間創建簡單,輕松,快速交互的參考。


POUR代表

  • 可以理解:數字內容可以輕松地以不同方式進行解釋或處理嗎?

  • 可操作:數字產品能否輕松自如地進行功能和控制?

  • 可以理解:用戶可以理解界面的功能和內部信息嗎?

  • 健壯性:數字產品是否與不同的輔助技術和設備兼容?


設計師如何提供幫助

作為設計師,我們當然不能控制以上所有要求都能做到。但是我們應該承認,人們遇到的許多可訪問性問題是由設計階段未做過的決定引起的。因此,設計師有很多機會可以有所作為。僅通過做出更明智的設計決策,我們就可以影響(改進或協助)四種經驗。


  • 視覺體驗:這包括形狀,顏色,對比,文本樣式-產品界面的所有圖形元素。

  • 聽覺體驗:這是指與產品互動時產生的聲音,音量和清晰度。

  • 認知經驗:這描述了用戶花費在解釋界面上的時間,以及使用界面需要多少注意力和精力。

  • 運動體驗:這包括執行任務或與產品交互所需的所有動作和動作。


通常,可訪問性被認為是對創造力的挑戰;但是,如果我們認為這是一個創造性的挑戰,那么我們會開辟全新的可能性領域。真正好的可訪問性的訣竅不是在功能或功能上進行折衷,也不是在美學上取舍,而是使功能和創意體驗也可以訪問。


改善視覺體驗


1.顏色

對比度對比度是亮度或顏色的差異,使物體從周圍環境中脫穎而出,并可能對清晰度產生顯著影響。高對比度使視覺元素從背景中脫穎而出,更加引人注目。

專家提示:純粹的#000000黑白色會給眼睛帶來強烈的對比度,甚至會影響閱讀障礙者。這就是為什么我們傾向于避免使用它,而是選擇深灰色的原因。


亮度

亮度描述從光源發出的照明水平或從表面反射的光量。明亮的顏色反射更多的光線,并會干擾我們閱讀和處理信息的能力。


避免在背景或較大表面上使用鮮艷的顏色。請勿在文本上或文本附近使用鮮艷的顏色,以免干擾文本。如果品牌要求特定的高亮度顏色,請嘗試建議使用飽和或較深的顏色。如果你絕對必須使用明亮的顏色,則應將其用于突出顯示動作的方法最小化,并將其與較深的色相搭配以達到平衡和高對比度。


專家提示:任何含有超過50%黃色的顏色都會自然反射更多的光。這意味著黃色,橙色,綠色和藍綠色是高風險顏色,應謹慎使用。


色盲

色盲是無法區分特定顏色(通常是紅色和綠色,偶爾是藍色)的一種,它比你想象的要常見。

專家提示:不要僅僅依靠顏色;顏色不應該是傳達重要信息的唯一方法。您可以執行以下操作:

  • 使用下劃線表示鏈接和斜體,或使用粗體突出顯示文本

  • 將圖標與文本一起使用可傳達成功或失敗的信息

  • 使用紋理或圖案作為圖表

  • 為按鈕或明顯的通知使用清晰的視覺樣式,針對焦點或活動狀態使用不同的字體樣式


2.版式

字體選擇

通信是每個數字產品的首要目標,可以借助印刷術及其正確應用來實現。內容應清晰易讀,這意味著易于識別和解釋,輕松閱讀和處理。

簡潔明了對于快速閱讀和解釋至關重要,請避免使用復雜的字體,因為它們只會增加視覺干擾。選擇正確的字體家族,針對那些具有清晰定義和獨特形狀的字符,因為視力障礙或閱讀障礙的人可能會因某些字符或其組合而感到困惑。


字體樣式

字體樣式還會影響弱視或閱讀障礙者的閱讀性能。我們應該注意并謹慎使用字體樣式(如斜體,下劃線和大寫)的頻率和位置。

根據“英國閱讀障礙協會”的規定,應避免使用斜體,特別是對于較大的副本塊或較小的字體。這是因為它們使字母傾斜,顯得更加尖銳,因此更難以閱讀。


正文也應避免使用帶下劃線的字體樣式。給長的段落加下劃線會增加視覺噪音,從而降低閱讀性能,而給短的句子或單詞加下劃線會與活動鏈接相關聯,并可能引起混亂。粗體是添加對比度和強調的更好選擇。


盡管沒有確鑿的研究,但有一些證據支持也應避免主要針對正文使用大寫字母。似乎所有大寫字母的統一外觀會降低單詞形狀的對比度,從而使掃描變得不那么容易。此外,大寫看起來有點緊張,可能感覺好像有人在向您大喊大叫。

專家提示:平衡是關鍵。謹慎使用每個樣式并賦予其含義甚至可以提高可讀性。


字體大小

您知道絕大多數人戴眼鏡或隱形眼鏡嗎?實際上,十分之六以上!此外,約有62%的人通過手機訪問互聯網,這還不包括應用程序的使用情況。當視力不佳的人在旅途中在小屏幕上使用技術時,可能會出什么問題?

使用較大的字體。通常,16px被認為是最具有包容性的,但是請注意,字體可以以不同的比例站立,并且字體的大小可以相差很大。切勿低于14px,事實上,大多數現代網站的正文都使用18px字體,而標簽,標題或工具提示僅使用14px或16px。

專家提示:此外,避免使用薄而輕的字體,因為對于較小的字體或在明亮的光線下可能難以閱讀。


段落格式

幫助人們輕松瀏覽內容應該是我們的首要目標,因為只有20%的人可以閱讀內容,其中55%的人可以快速瀏覽內容。我們的工作是通過使用舒適的段落格式來盡可能地支持人們。


研究表明,用于支持可讀性的平均在線行長(包括空格)約為70個字符。標題,字幕和項目符號點將有助于掃描,而左段對齊將使文本更易于閱讀。


較長的文字墻使人們參與的機會大大減少。成功的段落長度不超過5到6個句子。

空格將幫助患有認知和注意力障礙的人,保持閱讀重點。對于其余的內容,它只會使閱讀更加愉快和流暢。根據WCAG,最佳做法是將行高(行之間的間距)設置為相對于該類型大小的1.5相對值。段落之間的間距也至少應比行間距大1.5倍,因此必須明確定義。


提示:行距不應超過2.0,因為它可能產生相反的效果并分散讀者注意力。


復制版面

作為設計師,我們經常陷入過度設計布局的陷阱,以使它們看起來引人注目或獨特,從而將可用性放在一邊。這就是為什么我們看到諸如文本的一部分之類的趨勢在彩色或帶紋理的背景上重疊圖像或文本的趨勢。只要我們知道如何以及何時使用它們,我們仍然可以享受其中的一些趨勢。

當在彩色或帶紋理的背景上使用文本時,我們需要確保它們之間的色彩對比度足夠高,同時在整個重疊區域都保持一致-意味著在副本下沒有較淺和較暗的區域,也沒有過多的細節干擾。較大的字體大小和較重的字體粗細也會提高對比度。


專家提示:一如既往地“了解您的用戶”。時髦的布局并不適合所有人。


改善聽覺體驗


您可能在想,視覺設計如何影響聽覺體驗?因此,想象一下您正在與一個俱樂部的朋友交談。我敢打賭,您只能聽見她說的話的一半,但是您可以通過看著她的嘴唇移動,肢體語言和面部表情來保持對話的進行。由于視覺效果的支持增強了模棱兩可的聲音,因此您最終可以理解它們。


在用戶界面中,聲音對于不同的人可能意味著各種各樣的事情。它們也很容易在嘈雜的背景中丟失,因此最好以視覺提示來支持它們。

我們的目標應該是提供聽覺和視覺提示的反饋,支持錯誤,通知以及與相關和鄰近圖形元素的重大交互。我們還必須確保視覺線索保持足夠長的活動時間,以使人們能夠看到和閱讀,同時又不隱藏任何重要的內容。


一個好的做法-不限于支持聲音輔助技術,是在UI元素中添加描述性標簽,并在圖像中添加標題,以便于在屏幕閱讀器中輕松導航。為視頻使用字幕是改善聽力體驗的另一種方法,對非母語人士也有幫助。


最后,我們不應該忽略聲音是問題的情況,這就是為什么我們需要視覺替代的原因。有些人可能對特定的聲音敏感,或者處于聲音可能引起干擾的情況下。然后,這是一個好習慣,讓人們可以選擇關閉聲音而不必調低揚聲器音量,從而使此功能清晰可見。


專家提示:避免使用不必要的自動播放聲音和音樂,因為它們會打擾甚至驚嚇別人。


改善認知體驗


1.知覺

視覺清晰度

清晰度是用戶界面中的第一個也是最重要的屬性。成功的用戶界面使用戶能夠識別和解釋他們所看到的內容,了解產品的價值和所要采取的行動,預測使用產品時會發生什么以及與產品成功交互。

  • 形式跟隨功能是一項原則,指出對象應反映其預期的功能或目的。為了在用戶界面中實現此目的,我們使用了附加功能,附加到UI的視覺提示/屬性,以顯示用戶與其交互的可能方式。

    支付能力取決于用戶的身體能力,目標,過去的經驗,當然還取決于他們認為可能的情況。按鈕應該看起來像按鈕,就像鏈接,菜單標簽,表單等一樣。使用清晰的符號/功能可以幫助用戶識別或解釋界面,并輕松進行交互。


  • 在用戶界面中使用熟悉的和已建立的設計解決方案將幫助用戶預測結果并自信地采取行動。因此,使用設計模式來解決常見問題是一個好習慣,該設計模式是經過測試,優化和可重用的解決方案。

    設計模式建立在過去的經驗和可能性的基礎上,并附加到特定的目標上。為避免眼前的問題,選擇正確的設計模式應該是我們避免混淆或壓力大的交互的第一要務。


  • 建立一致的視覺語言是獲得更全面界面的關鍵。具有相同功能和/或重要性的重復交互式UI組件應始終以相同的方式外觀和操作。因此,導航,按鈕,鏈接,標簽,錯誤等元素應在整個產品中具有一致的樣式,顏色和動畫。
    值得注意的是,一致的視覺語言不僅可以通過附加含義和減少視覺噪音來幫助互動,而且還可以增強產品的個性,提升品牌知名度,建立情感聯系和信任。


層次結構

視覺層次結構是指圖形元素的視覺重量及其排列方式,使用戶可以輕松地探索和發現內容。通過為頁面元素分配不同的視覺權重,我們可以對內容進行分組并影響人們感知信息和瀏覽產品的順序。

  • 顏色是第一大關注焦點。彩色元素將脫穎而出,因此在層次結構中位于較高位置。明亮的顏色會更加突出,因此,考慮到這一點,我們應該仔細安排和分配顏色,以將眼睛引導至正確的位置。

  • 視覺元素的大?。ɡ缬∷ⅲ粹o,圖標和圖像)在確定重要性方面幾乎與顏色一樣強大。較大的圖形吸引了用戶的注意,并且顯得很重要。對于排版,明顯不同的尺寸縮放比例可以幫助建立內容層次結構,并使內容掃描變得輕松而輕松。

  • 輔助視覺層次結構的另一種方法是通過設計一致性和例外。一致對齊,外觀相似,重復或相鄰的元素給人的印象是它們是相關且同等重要的,而偏離元素以及不尋常的形狀和有趣的紋理或樣式將更加顯著。太多的設計例外會引起人們的關注,并會增加復雜性,因此,謹慎使用它們是一個好習慣。


專家提示:研究格式塔原理及其在UI設計中的應用將有助于我們理解視覺感知和分組以改善視覺層次。


色彩應用

顏色不應該是傳達信息或增加意義的唯一方法,但它仍然有用且很有影響力,因此不應將其視為裝飾性元素。顏色具有含義,盡管沒有硬性規定,但是太多的顏色會導致信息疲勞,并且不一致地使用顏色會導致混亂。

  • 避免使用太多顏色。通常,三種顏色足以描述頁面的所有重要視覺元素。60–30–10規則可以幫助我們建立完美的和諧。其中60%的彩色項目由原色組成,以創建統一的產品主題,具有30%的輔助顏色增強含義和/或創建引人注目的效果,以及10%的強調色,以補充和輔助主顏色和輔助顏色。

  • 此外,我們需要確保為消息使用正確的色調。除了美學,顏色還可以創造情感和無意識的聯系。特定陰影的含義會因我們所處的文化和環境而異,并且顏色通常具有不同的含義-在西方世界,錯誤是紅色,成功是綠色,信息是藍色等。


專家提示:可以將我們自己的含義分配給顏色,只要它們不與既定規范重疊,并且我們在整個產品中使它們保持一致。


符號學

符號學是對符號/圖標及其含義的研究。它著重于人們如何形成和解釋這些含義,這取決于人們所看到的上下文。在用戶界面中,圖標是可視語言的一部分,用于表示功能,功能或內容。符號學可以幫助我們設計立即被識別和理解的圖像。

  • 盡管這些年來,我們已經開發出具有大多數人接受和理解的含義的圖標。用戶還習慣于使用特定于平臺的圖標,并且可以輕松地進行解釋。在可能的情況下,最好遵循這些既定的解決方案,以獲得熟悉和流暢的體驗。

  • 當然,在某些情況下,我們需要設計具有特定功能的自定義產品特定圖標。這些圖標必須盡可能簡單明了,以確保清晰度。它們還應該具有一致的視覺樣式,以傳達其功能或與其他非功能性元素區分開。

  • 最后,我們不應該僅僅依靠視覺隱喻來傳達含義,因為某些關聯可能并不那么明顯。如果圖標需要標題來描述其含義,則可能不合適。如果不確定,請與實際用戶一起測試我們的設計會有所幫助。


專家提示:圖標不僅易于解釋,而且還可以具有多種含義。因此,將標記與功能圖標結合使用是一種很好的做法。


2.互動

記憶

許多心理學實驗表明,健康個體的處理能力非常有限。在我們的短期記憶中,我們大多數人平均可以保留7項,具體取決于個人。我們的大腦并未針對數字產品所需的抽象思維和數據記憶進行優化,因此良好的設計會有所作為。


  • 減少頁面上可用選項和信息的數量,以及使用清晰的標題,面包屑和“后退”選項來訪問以前的內容,將幫助用戶記住或提醒自己他們在哪里,打算做什么或要做什么。是必需的。

  • 交互元素上或附近的清晰可見副本將幫助用戶在整個交互過程中保持知情和自信。例如,表單標簽應始終可見,動作不應隱藏在懸停后面,按鈕應提供目標位置的上下文,并且各節的標題應明確。


專家提示:通過稱為“塊”的過程可以增加我們的短期記憶和處理能力。這是我們在視覺上將項目分組以形成更容易記住的較大項目的地方。


改善運動體驗


菲茨法

菲茨法則為人類的運動和互動提供了一個模型。它指出,將指針(光標或手指)快速移動到目標區域所需的時間是其距目標的距離除以目標大小的函數。意味著較小的目標會增加互動時間。

 

根據Fitts法則,我們旨在減小用戶與目標之間的距離,同時增加其尺寸。該法律主要適用于導航和按鈕。菜單和子菜單元素應在附近,而按鈕,鏈接和分頁應在較大區域上單擊,以實現更快更準確的交互。


專家提示:根據可用性最佳實踐,按鈕/鏈接的最小尺寸為42x42像素(重擊尺寸)。


獎勵:提高績效

到目前為止,我們已經建立了包容性設計,旨在讓盡可能多的人訪問并實現他們的目標或解決他們的問題,盡管他們有自己的情況。我們可能很幸運,可以使用進的設備或超高速互聯網,但是當我們的信號不太好時,我們會感到掙扎。對于大多數人來說,老式設備和糟糕的互聯網已成為常態,因此,為獲得最佳性能而設計是一件大事。

  • 極簡主義是關鍵。如果我們打算創造一種可以被盡可能多的人使用的產品,那么我們就應該擺脫不必要的一切。圖形,圖像或動畫是有價值的,還是增加了視覺噪音和加載時間?如果是的話,那就必須走了。

  • 圖像優化是幫助提高數字產品性能的另一個標準。通過將圖像調整為合適的大小,然后通過諸如ImageOptim和TinyPNG之類的工具運行它們,可以節省寶貴的千字節和實際的加載時間。

  • 開發人員通常使用的一種提高性能的技術是“延遲加載”模式,其中圖像的加載是異步的,并延遲到需要時才加載。例如,如果您快速滾動到頁面底部,則在網站完全加載之前,您可能會看到類似網站線框的內容?!皾u進圖像加載”的一種替代方法是“漸進圖像加載”,其中我們顯示一個空的占位符框<div>,然后用小的低質量模糊圖像填充它,最后用所需的高質量圖像替換它。

在每個數字產品中都遵循上述最佳實踐,這是高可訪問性標準的良好起點。但是總會有改進的余地,并且更好地了解我們的用戶可以揭示提高無障礙標準的新方法。因此,有必要花費一些時間和金錢來更多地了解我們的不同類型的用戶,因為他們可以教會我們很多有關使包容性體驗成為現實的知識。


了解我們的用戶將幫助我們練習同理心?!百x權”不是偶然的設計思維過程的第一步。在移情階段,我們的目標是加深對我們正在設計的人員及其獨特視角的了解,因此我們可以在進行任何設計決策時與他們認同并代表他們。

zhuanz

2020年最火的新擬物化設計,需要思考的五個方面

濤濤

新擬物化設計只是一種風格嗎?

最近正火的新擬物化風格(Neumorphism)在 2019 年底,設計師 Alexander Plyuto 所提出的「Skeuomorph Mobile Banking」作品中亮相。之后不僅被選為 2020 年界面趨勢,又稱為 soft UI。但這種風格在真實世界落地時,可視性上受到許多爭議。

確實,新擬物化風格它算是一種風格,但又不是只有視覺上的風格這么簡單,它延伸出來的議題,其實是扁平化跟擬物化之間的戰爭。

擬物化與扁平化的瑜亮情結

擬物化是 Apple 在早期設計中大量使用在界面上呈現對象屬性、材質的方式。然而在 2013 年 ios7 發布時,Apple 開始為了畫面簡潔大量將界面元素扁平化,緊接著 Google 在 2015 年發布了 Material Design,宣示扁平化在 UI 設計中扮演著主導趨勢的角色。2020 年真是百家爭鳴的一年,首先是 BMW 發表的扁平化新 logo,接著是這一波新擬物化的反擊。究竟代表新擬物化可能奪回界面風格主導權?或僅是 2020 年曇花一現的視覺風格呢?

扁平化VS 擬物化,我們可以思考的五件事

我認為新擬物化的概念其實是融合扁平化與擬物化的集大成,它建立在扁平化風格之上,又將組件帶入了擬物化的元素,提高用戶的判斷力。不過在糾結于扁平化與擬物化哪個比較好時,有五個議題是可以讓 UI、UX 設計師去思考的。

1. 多數年長者對于扁平化界面提供的視覺元素暗示無法理解。

大家身邊一定都有那種已經把 Line 操作得滾瓜爛熟,但是每次要用 Line 加好友時,還是不知道怎么操作的長輩。最早期當人類還沒進入屏幕時代前,我們所使用的界面大多是實體產品上的控制界面,而這些界面上的每個開關、按鈕,都只有一個輸入源,對應到一個功能(一對一),我們因此就這樣與產品進行簡單的交互動作。然而在屏幕上這個簡單的交互模式被改變了,像是用鍵盤跟鼠標可以輔助我們,在系統中進行抽象與復雜的無限多任務(一對多)。

△ 你偏好用哪個微波爐加熱咖啡呢?Image credit:Bence Mózer

讓我們再來看看對長輩最重要的 Line 加好友功能,我們先不論這個功能在整個 APP 中被埋得多深,因為找到加好友的入口真的對長輩來說是看緣分~

在我引導長輩找出二維碼畫面的經驗中,發現他們都是用死記的方式,把下一步要按哪個鍵、在畫面的哪一個角落,記下來。但由于加好友功能并不是每天都會操作的,因此在學習上的效果,就像是高中時沒有把課文理解、吸收就硬死背下來一樣困難。

我們來看看「顯示行動條碼」在掃描二維碼畫面中,是否真的具有可以被點選的暗示。在掃描畫面背景單純的時候(如下圖情況 1),「顯示行動條碼」的 button 底色是有透明度的黑、扁平化后沒有陰影提供可以按的暗示,不過因為有大圓角的造型,勉強還是可以誘使人點點看;但一般情況下,掃面畫面背景不會那么理想的無其他干擾(如下圖情況2),button 原本的透明黑完全融入了后面的背景,這時候只剩下「顯示行動條碼」的文字,已經不具備可以被點選的提示。

△ 情況 2 中,顯示行動條碼的 button 看起來可以按嗎?

掃描畫面中的外框有一定的透明度,在可操作暗示(affordance)上已經不具有實體的特征,如果又放上有透明度的 button 在上面,讓人充滿不確定性,年長者無法將這樣的情況與現實生活中的經驗聯想在一起。

2.以顏色做區別真的是最好的方法嗎?

你知道同一個顏色,每個人看起來會不一樣嗎?而不同顏色在不同環境下,卻又能看起來像同一個顏色嗎?

不同意新擬物化設計的人中,有人主張運用顏色的引導用戶操作界面的色彩元素不能從界面設計中抽離。但事實上,不同年齡、性別,視覺錐細胞中的活躍程度不一樣。同一個顏色,不同人看,明度跟彩度會有差異?;诜N種現實,由色彩的引導是好還是壞呢?

例子1:關于人類的視覺錐細胞

同一個顏色,不同人居然會看成不同顏色?

為什么阿嬤喜歡買大紅大紫的衣服?這個偏好除了受到個人喜好影響外,也關系到阿嬤視覺錐細胞的活躍度。老年人在上了年紀后,部分視覺錐細胞開始退化,因此對于藍色、綠色這類冷色系的顏色,老年人會開始接受不到這個區段的光帶來的刺激。因為視覺錐細胞對冷色系的刺激降低,導致阿嬤在菜市場逛街時會被偏暖色系的物品吸引。所以會買熱情系服飾不是阿嬤本人的意圖,而是老化的錐細胞在作祟。

例子2:關于學習觀察顏色這件事

不同顏色居然看成同一個顏色?

不同顏色卻看起來很像,有可能是光線造成,也有可能是使用者必須學習去觀察才知道的。日本的 JR 跟 Metro 系統,有著完整且細膩的視覺辨識系統。設計師理想中的情況是,我們將每條路線定義成不同顏色,可以讓使用者更容易學習辨識路線。

但實地走訪過東京的地下鐵跟 JR,常常會發現跟錯指示,才發現是潛意識辨認錯文字或是顏色。我自己遇到過的經驗是,在新宿站想要找都營大江戶線時,因為在改札口看到了同樣粉紅色的標志,原本已經要嗶卡進去,才發現那是京王新線的 IC 入口標志。

△ 新宿駛的改札口前,有兩個同為粉紅色的引導指標

所以說,高齡者或是天生視覺錐細胞有缺陷的人對于顏色無法清楚辨認外;大部分人可以借由學習來增強色彩辨識,除了可以對相似顏色進行更細節的判別外,也可以學著辨認不同光線(暖光、冷光)下造成的色彩差異。

但是,當我們在設計中,迫使用戶學習、習慣我們制定顏色的意義??赡軙谛率?onboarding 時造成適應上的負擔,也有可能讓他們在使用別的系統造成錯亂。

3. 對于顏色被定義的意義各個文化、區域、種族都相同嗎?

在不同文化之下,對于色彩的觀察與運用也不一樣,舉個大家可能都有發現的例子,當你在不同城市旅游的時候,有沒有發現不同城市的優先座顏色不一樣?你能猜得出來,哪一個是臺北捷運上優先座的顏色嗎?

△ Image credit:wikipedia.org

當顏色在不同約定成俗下,有不一樣的意義,又剛好缺乏文字或圖像引導的時候,可能會讓使用者解讀成不同的意義。例如:紅色具有熱情、喜氣、帶來財運的意涵,但同時又具有危險的警示意義。

當設計師覺得紅色可以引起使用者的注意,而把 button 設計為紅色時,卻可能讓沒看清楚文字的用戶,認為按下這個 button 是危險的舉動。

△ Image credit:photoAC

4. 光與影(明亮面跟陰暗面)給使用者的可操作暗示(affordance)一樣嗎?

新擬物化設計中假設了人在使用界面時,會運用與生俱來能判斷光影效果的能力。這是真的嗎?讓我們來做個小實驗:

為什么在臺北車大廳席地而坐的人,會選擇坐在黑色的棋盤格上呢?如果根據人類從大自然中所得到的可操作暗示來說,有陰影的地方可以提供人類休憩的功能,例如樹陰下的陰影處。

△ Image credit:中央社、wikipedia.org

如果這樣說得通的話,代表光亮的區域對人來說是可以行走、活動的地方;而陰影處則是休息與暫停處。

根據以上的推測,我們做個小實驗,把車站中的 2 個不同區域的地面上分別涂上白色與黑色,來讓受測者選出哪些區域可以暫停,哪些區域可以走動:

問題A:假設你要在車站的大廳等朋友,你會選擇站在哪里等他呢?

假設:受測者會選 2,因黑色區域(影子)讓人覺得可以暫停、休憩。

結果:符合假設

1:白色柱子前的白地面 32.5%; 2:白色柱子前的黑地面 67.5%

問題B:哪一邊的樓梯是往上的方向呢?

假設:大家會選 1,因為黑色區域(影子)讓人覺得可以踩上去。

結果:符合假設

1:白色立面+黑色地面 61.3%;2:黑色立面+白色地面 37.8%

由實驗A、B可得證,雖然實驗結果符合先前假設,大多數的受測者可從陰影判斷要走哪條路,但還是有不少(30%以上)的受測者不認同。所以在用使用光亮陰影的設計暗示時,還是會遇到使用者感知的不同的問題。

5. 深度認知不同是導致判斷物體距離的能力受影響,也就是所謂的視差。

新擬物化設計中,將界面組件以類 3D 的方式呈現,使用戶在操作界面時必須去感知界面組件的遠近以判斷重要性,而在深度認知上有障礙的用戶此時就會受到挑戰。用戶可能會遇到,不知道哪個組件才是浮在最上面、最重要的;若界面中的組件有三種以上的陰影深淺,會讓用戶在判斷時要更花腦力判定物件在立體空間中的深淺。

總結

新擬物化風格中的光影表現提供了使用者人類最原始的操作意圖:可操作暗示,是一個好的出發點,然而必須針對 APP 性質的不同而有所改良。在設計較走生活風格理念,而操作界面不復雜的 APP 時,非常適合用新擬物化風格來詮釋:例如電子書服務、音樂軟件;但在設計功能導向,且有大量信息化圖表的界面,例如:移動網銀,還是需要以扁平化的界面為主要信息架構,新擬物風格可能會是極少量界面元素中,拿來呈現生活中真實物的質感(例如:用戶的信用卡)、或是作為亮點(例如:優惠卡片)的呈現方式,此類型 APP 中最重要的卡片與圖表對于此種風格,一定要謹慎使用,必定三思三思再三思。

文章來源:優設    作者:Muse Chang

用4個經典的重量級產品案例,告訴你什么是標桿式體驗設計

濤濤

今天和大家聊一個很多朋友常年卡在 P5/P6 需要關心的命題——如何從業務出發打造具有商業價值還能兼顧用戶體驗的設計,此篇不談理論,就通過 4 個經典的重量級產品案例就給大家安排明白啥是「一拳超人」式體驗設計——就一個字「強」。

滴滴出行-xpanel

滴滴出行應該屬于大家的高頻使用 app,但是使用的功能一般還是集中在叫車流程,所以大家可能不太會關注到 CDX 設計團隊一個非常核心的設計成果——xpanel。

簡單來說 xpanel 就是一個附著于第一信息架構層級上,垂直 Y 軸且支持 X 軸拓展滑動的 Feed 卡片位。內容上分為「消息卡片」「主體卡片」「拓展卡片」三個維度,首屏保障除了「消息」與「主體」外三分之一「拓展卡片1」的露出。

但在簡單的交互背后蘊藏的是基于業務的 UGD(用戶增長設計)設計思考,這里引用 2018IXDC 會上滴滴主講人的原話來說就是:

對特定場景垂直領域的深耕和挖掘,尋找「接觸點」,幫助獲取更多的功能、內容、服務、特性、品牌、運營甚至是喜好……進而實現業務的「有效增長」(轉化、變現、留存)。

通俗一點解釋就是 xpanel 利用主卡與拓展卡之間的信息架構關系,把拓展卡平衡的分為幾類,比如「與產品功能相關的卡片」「與運營相關的卡片」等。

把本來被 LBS 地圖一屏內搶占的空間通過簡易的交互模式補償回來了,這樣既不打破用戶的核心體驗 focus 在地圖與主卡上,同時又增強了運營、功能的玩法與拓展,可謂雙贏。

根據這幾年滴滴 xpanel 的線上應用,拓展卡片基本挖掘涵蓋了以下場景的露出:優惠福利、出現卡券、會員體系、安全相關、出行提醒、拉新導流、運營活動等,未來可拓展的價值內容會更多??粗髀烦鲂蓄?app 又紛紛長期沿用 xpanel 的設計,想必線上的數據反饋應該也是很正向的。

抖音-TopView

在上篇文章《多維度解析 | 抖音vs快手的產品設計策略差異》中的商業化模塊里簡要提及過抖音的 Topiew 超級廣告位,這里單獨拿出來和大家解析一下它究竟有多6。

從功能角度看,它是一個從開屏延續到端內視頻信息流的廣告位,占據了用戶從進入抖音的第一視覺。

從交互角度看,topview 主要展現以開屏沉浸式視頻 3s 播放→淡出互動轉化組件 3s(完美融入原生視頻信息流),剩余操作手勢與功能等同原生視頻信息流。

在這樣一個有著 1 億+第一曝光的產品位置,單純只做常規靜態開屏穩當入賬不香嗎?事實是抖音確實讓它不香了,沒有創新就沒有新的收獲?;跇I務和當前產品形態下的交互模式使抖音有一個天時地利的優勢——沉浸式體驗,在這樣的交互模式下給視頻化的開屏提供了很好的承接入口。從開屏開啟到融入信息流,在交互形態的切換中又為廣告內容的播放時長贏得了更多時間。

更可怕的一點是 3s 播放后融入原生視頻信息流中的 TopView 除了正常收割廣告轉化帶來的單量,還可以通過右側的主頁鏈接輕松引流進行粉絲沉淀(今天就算你不買,先關注我,成為我的潛在用戶,來日我再推一個新商品視頻,你可以第一時間看見也許感興趣就買單了)。

說完這些大家仔細回憶一下平常我們接觸的有視頻廣告的視頻平臺,別說 60s、30s,15s 我們都嫌長,但為啥 TopView 顯得相對沒那么惹人煩呢(上次留的思考題)?個人認為除了抖音在選擇合作品牌時會傾向符合平臺氣質的品牌合作(細數它合作過的品牌:Mac、寶馬、林肯、vivo 等)保障廣告質量和提供「跳過」外,直接融入信息淡出的互動組件會不僅會給用戶新奇感,還會激發用戶的互動欲望。

最后看一組數據(與寶馬合作數據),曝光數:1.1 億+;有效播放率:53.82%;點擊率:13.26%。所以你猜一個最長可以展示 60s 的品牌視頻內容、同時進行品牌粉絲沉淀、良好體驗帶來更高有效播放的億級曝光廣告位能值多少錢?

淘寶-二樓

2016 年淘寶啟動了一個項目要做一款內容化欄目——以視頻為主,每晚更新一期,類比「一千零一夜」的故事。

那么在滿滿當當的淘寶運營區里該選擇哪一個來試玩這個有趣的「新欄目」呢?是在頭部的 10 宮格里再擠進去一個圖標呢?還是在熱門推薦里擠出一個 tab 呢?還是做一個懸浮的右下角的運營位?顯然都不太合適。

根據這款產品每晚 6 點鐘才可以使用,早上 7 點就會消失的游戲規則,最適配它的入口是一個不占界面原生空間,同時又有一定儀式感的位置。于是下拉 loading 的大空區成為了設計師們考慮的陣地。

△ 不知道這個banner為什么要排擠我

但地方選好了,又有了新顧慮。因為 iOS 的用戶基本被系統洗腦了下拉手勢,對于他們來說下拉=刷新,貿然在下拉刷新的手勢基礎上再疊加一個無關聯的結果顯然是有風險的。因此從交互上需要界定 2 個維度的指標來保障新欄目的體驗。

  • 下拉速度(速度臨界值:速度多快?→刷新,多慢?→新欄目)——以速度為優先衡量指標(只要速度快,拉的距離再大也是→刷新)
  • 下拉距離(距離臨界值:拉到多少距離進入新欄目?)——兼顧單手用戶操作難度

反復試錯 2 個指標數據的實際體驗之后,新欄目有了安身之所,賜名「二樓」。進入「二樓」的整體交互和現在的短視頻產品玩法基本雷同,全屏豎滑切換,小圖標帶貨。下拉加載位的開發,從普通 loading 動效到運營位的植入基本被各類電商平臺輕松復刻了,因此這一切看上去更沒什么了得,但對于原創來說那畢竟是 4 年前。

豆瓣-疊加上滑板

談到豆瓣我算是半個老用戶了,豆瓣自身是個比較復雜的集合多條業務線分支(「小組」「同城」「閱讀」「音影」……)的多生態產品,這里我們主要拿它 18 年 6.0 大改版中影音模塊的詳情頁大改造來說事兒。

△ 可能有很多人已經忘記6.0前的豆瓣電影詳情頁長啥樣了,帶你回顧一下。

看完對比圖,視力正常的朋友乍一看都能看出 6.0 版詳情頁整容得有多成功。但具體成功在哪里,可能不僅僅是好看這么簡單。

大背景從海報上智能取色雖然不算是什么稀奇的做法,但是加了適度的漸變應用在這里也可以說是非常的恰到好處了。另外深底色和視覺比重加大的外鏈區都突顯了「第三方播放」與「購票選座」的視覺感知。讓用戶沉浸在電影詳情中并引導他們走向「豆瓣的主要收入來源之一——電影票分銷與第三方視頻播放產品引流」正好是 6.0 豆瓣改版一個「小小的目標」——更務實(商業化)。

從交互層面看,且不說評論頭部吸底這個事情是不是也是因為 6.0 商業化的影響(評論區增加「話題」進行重點運營),這個交互本身我覺得還是很強大的。強大的體現在于良好的空間收納能力與信息拓展能力。我給它起了個好聽的名字叫-疊加上滑板(不好聽也認了吧,畢竟也沒有內部人員告訴我他們是不是起名字了)

這里可能又會有很多人質疑它與用戶已洗腦的上滑手勢之間的沖突,這點解釋起來和上文淘寶「二樓」有些類似,區別是豆瓣并沒有做上滑速度 or 距離的臨界值,只是把滑動區域做了隔離。而對比它的效仿者 boss 直聘,人家倒是在交互上做了進一步優化,適配自己的產品情況做了上滑疊層卡隱藏和上滑距離臨界值。

這個故事告訴我們,要抄也要抄得比人家的交互更優秀才不丟人昂。

文章來源:優設    作者:Nana的設計錦囊

日歷

鏈接

個人資料

藍藍設計的小編 http://m.skdbbs.com

存檔

92国产精品视频_亚洲a级在线观看_国产精品电影观看_国产精品免费观看在线_精品伊人久久97_亚洲人成在线观_尤物九九久久国产精品的特点_成人激情在线播放_成人黄色大片在线免费观看_亚洲成人精品久久久_久久免费视频在线观看_久久精品国产一区_国产一区二区三区18_亚洲欧美中文字幕在线一区_日韩美女中文字幕_日韩视频免费在线
无码国模国产在线观看| 欧美性受xxx| 欧洲激情综合| 任你躁在线精品免费| 97精品国产91久久久久久| 亚洲精品亚洲人成人网在线播放| 色婷婷久久一区二区三区麻豆| 亚洲性视频大全| 久久久精品免费| 99视频精品视频高清免费| 国产综合av一区二区三区| 亚洲二区精品| 成人av色网站| 成人欧美一区二区三区视频| 国产精品亚洲激情| 欧美精品欧美精品| 中文字幕成人精品久久不卡| 福利一区福利二区微拍刺激| 国产成人精品一区二区三区视频| 国产精品超碰| 中文字幕欧美国内| 2024最新电影免费在线观看| 国产黄色精品视频| 日韩电影免费观| 99视频热这里只有精品免费| 亚洲第一av网站| 五月综合久久| 91精品国产综合久久香蕉最新版| 国产精品永久免费观看| 精品视频一区在线| 奇米一区二区| 韩国三级日本三级少妇99| 色大18成网站www在线观看| 91精品成人久久| 婷婷亚洲最大| 午夜亚洲激情| 成人国产精品一级毛片视频| 亚洲人成影院在线观看| 国产日产欧美精品| 日韩一区二区三区视频在线| 国产精品毛片在线看| 欧美日韩午夜影院| 亚洲影视一区二区三区| 精品少妇一区二区三区视频免付费| av在线资源| 国产剧情日韩欧美| 久久精品国产第一区二区三区最新章节| 成人精品在线视频| **欧美日韩在线观看| 欧美视频精品一区| 日韩免费高清| 亚洲国产免费看| 超碰在线亚洲| 成人无遮挡免费网站视频在线观看| 欧美精品 国产精品| 一区一区三区| 在线日韩中文字幕| 国内免费久久久久久久久久久| 亚洲欧洲www| 国产成人免费在线观看不卡| 久久国产精品99久久久久久丝袜| 欧美一级在线播放| 欧美理论视频| 国产欧美日本一区二区三区| 久久精品国产**网站演员| 天堂资源在线中文| 日韩欧美三级一区二区| 男女激情视频一区| 91国内揄拍国内精品对白| 丝袜美女在线观看| 国产一区二区三区视频在线| 婷婷亚洲精品| 国产激情视频一区二区三区欧美| 97在线看福利| 亚洲精品九九| 亚洲成av人综合在线观看| 日韩欧美一区二区三区在线| 国产欧美一区二区三区沐欲| 亚洲综合清纯丝袜自拍| 亚洲成人av在线| 成人午夜精品一区二区三区| 国产一区二区亚洲| 黄色工厂这里只有精品| 精品成人佐山爱一区二区| 色网综合在线观看| 成人四虎影院| 不卡视频观看| av一区二区不卡| 91视频国产高清| 伊人久久在线| 麻豆视频网站在线观看| 日韩精品一区国产麻豆| 国产精品手机播放| 国产农村妇女毛片精品久久莱园子| 豆国产96在线|亚洲| 欧美日韩精品一本二本三本| 国产不卡高清在线观看视频| 日韩美女一区二区三区| 国产精品羞羞答答| 秋霞影视一区二区三区| 伊人222成人综合网| 青青影院一区二区三区四区| 欧美午夜精品一区二区三区电影| 唐人社导航福利精品| 在线观看网站免费入口在线观看国内| 欧美一区二区三区四区五区| 欧美成人免费在线视频| 精品久久人人做人人爱| 久久国产一二区| 日韩制服诱惑| 精品成人a区在线观看| 精品欧美视频| 久久精品美女视频网站| 亚洲精品免费在线看| 欧美日韩国产在线| 成人不用播放器| 国产suv精品一区二区6| av在线一区二区| 秋霞影院午夜丰满少妇在线视频| www.亚洲激情.com| 国产黄色在线| 亚洲资源在线观看| 日韩中文在线播放| 久久草av在线| 91久久精品国产91久久性色| 国产在线一区二区| 欧美xxxx做受欧美护士| 欧美v国产在线一区二区三区| 女女同性女同一区二区三区91| 亚洲成人网在线观看| 国产精品乱码人人做人人爱| 不卡的av一区| 欧美日韩视频在线第一区| 91婷婷韩国欧美一区二区| 中文字幕免费一区二区三区| 日韩丝袜情趣美女图片| 久久五月精品中文字幕| 亚洲蜜臀av乱码久久精品蜜桃| 在线视频91p| 亚洲国产精品久久久天堂| 日韩成人影视| 国产伦精品一区二区三区在线观看| 蜜臀av国内免费精品久久久夜夜| 视频一区国产精品| 国产精品久久久久免费a∨| 久久久久久久综合色一本| 91精品国产综合久久久蜜臀图片| 色综合亚洲精品激情狠狠| 欧美办公室脚交xxxx| 亚洲国产精品一区在线观看不卡| 麻豆精品视频在线观看视频| 久久精品国产亚洲精品2020| 色婷婷**av毛片一区| 精品亚洲国内自在自线福利| 在线成人av观看| 亚洲综合伊人久久大杳蕉| 久久综合国产| 美女视频第一区二区三区免费观看网站| 国产精品国产成人国产三级| 国产亚洲综合av| 一本大道久久精品懂色aⅴ| 欧美一区二区高清在线观看| 成人性生交大片免费看视频直播| 久久国产影院|