在B端設(shè)計中,數(shù)據(jù)可視化是必不可少而且非常重要,越來越多的設(shè)計師需要和數(shù)據(jù)打交道,但是很多設(shè)計師不懂可視化當(dāng)中不同用途的圖表規(guī)范,只是單純設(shè)計出好看的數(shù)據(jù)圖表,卻不能給用戶帶來更多的信息和價值。
因此掌握數(shù)據(jù)可視化能力是設(shè)計師必不可少的一個技能,然而目前國內(nèi)互聯(lián)網(wǎng)對于數(shù)據(jù)的教學(xué)不夠全面,這讓很多B端的設(shè)計師很苦惱,所以今天我結(jié)合自己的工作經(jīng)驗和大家分享一下--“數(shù)據(jù)可視化之圖表設(shè)計”,為大家梳理一套完整的數(shù)據(jù)可視化的框架,以及關(guān)于可視化設(shè)計的基本準則和規(guī)范。幫助大家理解什么樣的數(shù)據(jù)對應(yīng)什么樣的圖標,了解顏色的意義,知道數(shù)據(jù)排版的要點。
將不可見的數(shù)據(jù)轉(zhuǎn)化為可見的圖形和符號,從中發(fā)現(xiàn)規(guī)律和特征,以獲取更多的信息和價值。
在當(dāng)前互聯(lián)網(wǎng)的時代下,一頁圖可能對標一個龐大且復(fù)雜的數(shù)據(jù)表格,按照人類本身對圖的記憶遠大于對抽象文字的記憶,所以我們要學(xué)會讓數(shù)據(jù)說話,數(shù)據(jù)可視化除了“簡潔直觀”,還可有容易理解和記憶、傳遞信息更豐富的特點。
接下來我們開始思考如何制作數(shù)據(jù)可視化圖標?首先規(guī)范的流程是最好的前提,下面的工作流程結(jié)合我自己的經(jīng)驗和日常企業(yè)的數(shù)據(jù)分析場景,找到了一個合適的參考,我們就可以步步為營,避免很多不必要的返工,保證設(shè)計質(zhì)量和項目進度。
很多小伙伴在做可視化圖表設(shè)計過程中,肯定遇到過這樣的困擾,發(fā)現(xiàn)自己做完的圖標并未能準確表達自己的意圖,也無法傳達自己的意圖,圖表通常讓用戶看完困惑不已,主要問題出現(xiàn)在分析的維度沒有找準或定義的比較混亂,面對B端龐大復(fù)雜的圖標,同樣的一個指標的數(shù)據(jù),我們從不同維度分析就會出現(xiàn)不同結(jié)果。用一句古話來形容:橫看成嶺側(cè)成峰。
國外專家Andrew Abela曾整理了一份圖表類型選擇指南圖示(如下圖),他把數(shù)據(jù)的關(guān)系分成了4種類型,幫助我們?nèi)ミx出合適的圖表來呈現(xiàn)。
上圖向大家展示了數(shù)據(jù)分析常用的4個維度,我們在選定數(shù)據(jù)指標后,我們需要和數(shù)據(jù)產(chǎn)品經(jīng)理溝通我們核心需求,是我們想通過可視化向用戶傳遞什么價值信息。上圖引導(dǎo)我們從“聯(lián)系、分布、比較、構(gòu)成”四個維度更有邏輯的思考這個問題,我們在進行圖表設(shè)計時首先進行需求的分析,熟悉數(shù)據(jù)并且明確數(shù)據(jù)要展現(xiàn)出來的信息,然后選用合適的圖表來進行數(shù)據(jù)的展現(xiàn)。
聯(lián)系:數(shù)據(jù)之間的相關(guān)性
分布:指標里的數(shù)據(jù)主要集中在什么范圍、表現(xiàn)出怎樣的規(guī)律
比較:數(shù)據(jù)之間存在何種差異、差異主要體現(xiàn)在哪些方面
構(gòu)成:指標里的數(shù)據(jù)都由哪幾部分組成、每部分占比如何
考慮到日常企業(yè)的數(shù)據(jù)分析場景,圖中有些圖表使用頻率是非常低的。所以我參考了上圖的部分內(nèi)容,對其進行了總結(jié),重新整合成三個維度
圖表的作用,是幫助我們更好地看懂?dāng)?shù)據(jù)。選擇什么圖表,需要回答的首要問題是『我有什么數(shù)據(jù),需要用圖表做什么』,而不是 『圖表長成什么樣』 ,根據(jù)數(shù)據(jù)選用合適的圖表展現(xiàn)來把數(shù)據(jù)的信息傳達給用戶。因此我們從數(shù)據(jù)出發(fā)、熟悉每種圖表的定義、適用場景、優(yōu)缺點,從功能角度對圖表進行分類,這樣才能快速選擇合適的圖表。
定義:柱狀圖是一種以長方形的長度為變量的統(tǒng)計圖表。長條圖用來比較兩個或以上的價值(不同時間或者不同條件),只有一個變量,通常利用于較小的數(shù)據(jù)集分析。
特點:
1、這個分類不限于地區(qū)、品牌等,可以是一個時間周期;
2、數(shù)量控制在5-12條最佳;
使用建議:
(1)使用合適的寬度去適配柱條的寬度
當(dāng)柱子太窄時,用戶的視覺可能會集中在兩個柱中間的負空間,而這里是不承載任何數(shù)據(jù)的。寬度推薦使用在1/2 柱寬到 1 柱寬之間,但也要視情況而定。
(2)不推薦采用全圓角
柱形圖可以有適當(dāng)?shù)膱A角,全圓角則有可能歪曲可視化圖表的表達,用戶可能無法明確是圓心還會頂點作為峰值。
(3)不要使用非水平和豎直的文字標注,也不要使用轉(zhuǎn)行
有時坐標軸上的注釋文字會很多,所以很多人為了妥協(xié),在小空間內(nèi)顯示出所有的文字標注內(nèi)容,而使用傾斜的文本,或者將文本轉(zhuǎn)行處理。
不要用過于復(fù)雜的設(shè)計形式,數(shù)據(jù)可視化的第一要義是簡單易懂,所以在遇到標簽文字過長時,可以采用將柱狀圖轉(zhuǎn)化為條形圖
定義:條形圖是用寬度相同的條形的高度或長短來表示數(shù)據(jù)多少的圖形。條形圖能夠使人們一眼看出各個數(shù)據(jù)的大小,易于比較數(shù)據(jù)之間的差別。當(dāng)條目較多,如大于12條,移動端上的柱狀圖會顯得擁擠不堪,更適合使用條形圖。
特點:
1、與柱狀圖類似,只是交換了X軸與Y軸位置;
2、多用于豎長的顯示區(qū)域,例如手機端、大屏的一側(cè);
3、多用于top排行或分類名稱較長的情況;
4、數(shù)量一般不超過30條,否則易帶來視覺和記憶負擔(dān)
使用建議:
(1)采用有序排列,軸標簽右對齊
對多個數(shù)據(jù)系列排序時,如果不涉及到日期等特定數(shù)據(jù),最好能符合一定的邏輯用直觀的方式引導(dǎo)用戶更好的查看數(shù)據(jù)。
可以通過升序或降序排布,例如按照數(shù)量從多到少來對數(shù)據(jù)進行排序,也可以按照字母順序等來排布??傊?,按照邏輯排序可以一定程度上引導(dǎo)人們更好地閱讀數(shù)據(jù)。
(2)標簽直接顯示在柱體上
條形圖還可以通過省略橫軸和縱軸,并直接在柱子上表明數(shù)值,來降低數(shù)據(jù)墨水比,進一步提高信息的獲取效率。
定義:用于顯示數(shù)據(jù)在一個連續(xù)的時間間隔或者時間跨度上的變化,它的特點是反映事物隨時間或有序類別而變化的趨勢。折線圖分為直線折線圖和曲線折線圖。折線圖可以清晰的反映數(shù)據(jù)是遞增還是遞減、增減的速率、增減的規(guī)律(周期性、螺旋性等)、峰值等特征。
特點:
1、橫軸如果不是表示連續(xù)數(shù)值,折線圖的意義不大
2、數(shù)量一般不少于3條,否則用柱狀圖更合適
使用建議:
(1)反映事物隨時間或有序類別而變化的趨勢
折線圖看的是趨勢,所有不是有序類別的不適合使用折線圖
(2)視覺美化
折線圖可以清晰的反映數(shù)據(jù)是遞增還是遞減,不能和面積圖累計的概念混淆,由于折線圖放在界面上的視覺重量很弱,所以我們可以通過添加微漸變加重視覺。
定義:面積圖又叫區(qū)域圖。它是在折線圖的基礎(chǔ)之上形成的, 它將折線圖中折線與自變量坐標軸之間的區(qū)域使用顏色或者紋理填充,顏色的填充可以更好的突出趨勢信息,需要注意的是顏色要帶有一定的透明度,透明度可以很好地幫助使用者觀察不同序列之間的重疊關(guān)系,沒有透明度的面積會導(dǎo)致不同序列之間相互遮蓋,減少可以被觀察到的信息。
使用建議:
(1)不要超過7個序列
當(dāng)數(shù)據(jù)系列過多時,往往造成用戶難以觀察的痛苦,所以建議使用堆疊面積圖時數(shù)據(jù)系列最好不要超過7個。
分組條形圖屬于條形圖的一種,又叫簇狀條形圖,是一種以不同分組高度相同的長方形的寬度為變量的統(tǒng)計圖表,每個分組中的柱子使用不同的顏色或者相同顏色不同透明的方式區(qū)別各個分類,各個分組之間需要保持間隔。
特點:
(1)適用場景
分組條形圖適用于表達相同分類不同組別的數(shù)據(jù),或者相同組別不同分類的數(shù)據(jù),簡而言之,就是根據(jù)一個相同變量的不同分組進行數(shù)據(jù)表達。
(2)不適用場景
分組條形圖不適合用于表達分組過多的,數(shù)據(jù)量較大的數(shù)據(jù),也不適合用于表達趨勢類的數(shù)據(jù)。
定義:雙向柱狀圖又叫正負條形圖,是使用正向和反向的柱子顯示類別之間的數(shù)值比較,其中分類軸表示需要對比的分類維度,連續(xù)軸代表相應(yīng)的數(shù)值。
定義:一種圓形直方圖,使用半徑長短表示數(shù)值大小??梢栽谝曈X上夸大數(shù)據(jù)之間的差異。
特點:
1、由于面積等于半徑的平方,玫瑰圖會將數(shù)值之間的差異放大
2、南丁格爾玫瑰圖不能用于表示占比構(gòu)成
3、數(shù)量:一般 不超過30條,否則易帶來視覺和記憶負擔(dān)
定義:雷達圖又稱為蜘蛛網(wǎng)圖、網(wǎng)絡(luò)圖,蜘蛛圖,星圖,是以在同一點開始的軸上顯示的三個或更多個變量的二維圖表的形式來顯示多元數(shù)據(jù)的方法,所有這些方面都可以類似地量化,常用于排名、評估、評論等數(shù)據(jù)的展示,比如我們玩王者榮耀中英雄的各項性能指標。
特點:
1、指標得分接近圓心,說明處于較差狀態(tài),應(yīng)分析改進;指標得分接近外變現(xiàn),說明處于理想狀態(tài)
2、數(shù)量控制在5-8個最佳
定義:對比分類數(shù)據(jù)的數(shù)值大小以及是否達標
特點:
1、可以通過標記刻度區(qū)間,來進行更好的評估
2、數(shù)量控制在10個以內(nèi)
定義:由多個梯形從上而下疊加而成。從上到下的項有邏輯上的順序關(guān)系,梯形面積表示某個業(yè)務(wù)量與上一個環(huán)節(jié)之間的差異,通過漏斗各環(huán)節(jié)業(yè)務(wù)數(shù)據(jù)的比較,能夠直觀地發(fā)現(xiàn)和說明問題所在,為決策者提供一定的參考。
特點:
適用于業(yè)務(wù)流程比較規(guī)范、周期長、環(huán)節(jié)多的單流程單向分析,不適合表示無邏輯順序的分類對比
使用建議:
(1)漏斗圖不是表示各個分類的占比情況,而是展示數(shù)據(jù)變化的一個邏輯流程,如果數(shù)據(jù)是無邏輯順序的占比比較,建議使用餅圖更合適。
(2)可以根據(jù)數(shù)據(jù)選擇使用對比色或同一種顏色的色調(diào)漸變,從最暗到最淺來依照漏斗的尺寸排列。切記,不要添加許多圖層和顏色造成漏斗圖難以閱讀。
定義:用于表示不同分類的占比情況,通過弧度大小來對比各種分類,將一個圓餅按照分類的占比劃分成多個區(qū)塊,整個圓餅代表數(shù)據(jù)的總量,每個圓弧所在的塊表示該分類占總體的比例大小,所有圓弧所在的塊組成的圓餅等于 100%,這樣可以很好地幫助用戶快速了解數(shù)據(jù)的占比分配。
特點:
1、可以通過標記刻度區(qū)間,來更好的評估
2、數(shù)量控制在10個以內(nèi)
使用建議:
(1)餅圖適合用來展示單一維度數(shù)據(jù)的占比,要求其數(shù)值中沒有零或負值,并確保各分塊占比總和為100%
(2)餅圖不適合被用于數(shù)據(jù)的比較
定義:本質(zhì)是將餅圖中間區(qū)域挖空
特點:
(1)餅圖的整體性太強,我們會將注意力更多集中在扇形的面積上,環(huán)圖則可以很好地避免這個問題
(2)建議分類數(shù)量不超過9個
使用建議:
餅圖更加集中面積,環(huán)圖會集中在角度和弧長上,所以我們中間的空間利用率還可以更好的利用。
定義:旭日圖(Sunburst)由多層的環(huán)形圖組成,在數(shù)據(jù)結(jié)構(gòu)上,內(nèi)圈是外圈的父節(jié)點。因此,它既能像餅圖一樣表現(xiàn)局部和整體的占比,又能像矩形樹圖一樣表現(xiàn)層級關(guān)系。
特點:
1、旭日圖=N張餅圖
2、離遠心越近,代表層級越高
3、下一層級的總和構(gòu)成上一層級
4、可以無限向外擴展
定義:堆積面積圖是一種特殊的面積圖,可以用來比較在一個區(qū)間內(nèi)的多個變量。如果有多個數(shù)據(jù)系列,并想分析每個類別的部分到整體的關(guān)系,并展現(xiàn)部分量對于總量的貢獻時,使用堆積面積圖是非常合適的選擇。
特點:
1、適合表達總量和分量的構(gòu)成情況
2、分類指標的縱軸起點,并不是從0開始,而是在上一個分類基礎(chǔ)上疊加
使用建議:
1、圖表有重疊的數(shù)據(jù)時,類別數(shù)量越多,重疊越多,因此可見度越低,所以不建議堆疊面積圖中包含過多數(shù)據(jù)系列.
2、堆積面積圖要展示部分和整體之間的關(guān)系,所以不能用于包含負值的數(shù)據(jù)的展示。
3、建議堆疊面積圖中把變化量較大的數(shù)據(jù)放在上方,變化量較小的數(shù)據(jù)放在下方會獲得更好的展示效果。
定義:堆疊柱狀圖是柱狀圖的擴展,不同的是,柱狀圖的數(shù)據(jù)值為并行排列,堆疊柱圖則是一個個疊加起來的。它可以展示每一個分類的總量,以及該分類包含的每個小分類的大小及占比,因此非常適合處理部分與整體的關(guān)系。
特點:
1、二級分類并不是按照同一基準對齊的
使用建議:
大多數(shù)的堆疊柱狀圖都是垂直繪制的,但是如果你的數(shù)據(jù)標簽特別長時,考慮更好地展示效果,可以選擇使用水平堆疊的方式。
定義:通過顯示正值(收入)和負值(支出)對總量的貢獻來顯示結(jié)果累積的過程,因為形似瀑布流水而被稱之為瀑布圖。瀑布圖通過巧妙的設(shè)置,使圖表中數(shù)據(jù)的排列形狀(稱為浮動列)看似瀑布懸空,從而反映數(shù)據(jù)在不同時期或受不同因素影響的程度及結(jié)果,還可以直觀反映出數(shù)據(jù)的增減變化,在工作表中非常實用。
特點:
1、過程值為正的時候,向上加;
2、過程值為負的時候,向下減;
定義:特殊高亮的形式顯示數(shù)據(jù)集中的區(qū)域和數(shù)據(jù)所在的地理區(qū)域的圖示。使用地圖作為背景,對數(shù)據(jù)的地理分布顯示直觀通過顏色深淺、氣泡大小等容易判斷度量的大小,將數(shù)據(jù)在不同地理位置上的分布通過顏色或者氣泡映射在地圖上。
特點:
1、結(jié)合散點:位置坐標更清晰
2、結(jié)合飛線圖:表達起始點和目標點的鏈接或流向關(guān)系
使用建議:
(1)必須要有地理位置
(2)展現(xiàn)的通常是以某個地區(qū)為單位的匯總的連續(xù)信息
(3)當(dāng)你用基于地圖的熱力圖的時候,顏色梯度變化一定是有規(guī)律的,一定根據(jù)數(shù)值遞增遞減來變化的,否則在視覺上產(chǎn)生錯誤引導(dǎo)
定義:數(shù)據(jù)點在直角坐標系平面上的分布圖,表示因變量隨自變量而變化的大致趨勢。
定義:氣泡圖是顯示變量之間相關(guān)性的一種圖表。與散點圖類似。在直角坐標系中顯示數(shù)據(jù)的兩個變量(X和Y軸)之間的關(guān)系,數(shù)據(jù)顯示為點的集合。與散點圖不同的是,氣泡圖是一個多變量圖,它增加了第三個數(shù)值即氣泡大小的變量,在氣泡圖中,較大的氣泡表示較大的值??梢酝ㄟ^氣泡的位置分布和大小比例,來分析數(shù)據(jù)的規(guī)律。
特點:
有一定的數(shù)據(jù)量是展現(xiàn)三個變量之前的相關(guān)性,數(shù)據(jù)具有3個序列、特征及相關(guān)值。
舉個栗子:
我們回歸到線下場景,我們通常在逛生鮮超市類如盒馬生鮮、沃爾瑪?shù)?,會發(fā)現(xiàn)里面售賣的雞蛋、生鮮類會比外面便宜很多,因為他們?nèi)菀走^期,屬于成本極高的食品,通過限購來讓他們引流,從而吸引更多的顧客來買那些成本低、單品收入高的商品。
最后給大家總結(jié)一下,首先我們拿到數(shù)據(jù)后先明確我們的使用目標,是讓用戶用最短的時間了解到數(shù)據(jù)帶來的信息,結(jié)合每個圖表的優(yōu)缺點,選擇合適的圖表,從需求和目標出發(fā),切忌盲目的增加和刪減元素,圖表的易用性大于它的美觀度。
以上就是本篇文章的全部內(nèi)容,數(shù)據(jù)可視化是一門龐大系統(tǒng)的科學(xué),關(guān)于可視化相關(guān)的知識還有很多沒有涉及到,例如可視化圖表的構(gòu)成、圖表運用場景、數(shù)據(jù)可視化大屏等等,后續(xù)希望大家持續(xù)關(guān)注。
文章來源:tob.design 作者:佩奇一只居
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
元旦過后,新的一波工作又要開始了,我在開始準備新一輪匯報材料的時候突然想到了一個問題,不知道鐵子們在往年參加設(shè)計評審的時候,有沒有總被老板 diss 設(shè)計稿里“太空了” “不夠飽滿” 這些個問題呢?
我猜測應(yīng)該 99%的鐵子經(jīng)歷過,我也不例外,從校招進到第一家公司就開始被植入頁面需要利用好每一像素的理念,搞得像北京房價一樣寸土寸金,生怕被浪費了;思前想后為了大家不重蹈我的覆轍,所以新年的第一篇,咱一起來聊聊排版的問題:
如果你看過我過往的文章,也許會對我的排版多少有點印象,夸張的大字,極強的對比,還有一些微妙的層級關(guān)系。
坦誠的講,我的風(fēng)格揉雜了 2 種設(shè)計體系 —— 瑞士風(fēng)格 / 擬物風(fēng)格;
1. 瑞士風(fēng)格
整潔、嚴謹、工整、理性化、實用的特征是瑞士平面設(shè)計的精神所在;這種一絲不茍,傳達準確的風(fēng)格,即所謂瑞士國際主義風(fēng)格。簡單的說,由于 Swiss Design 這種風(fēng)格簡單明確,傳達功能準確,因而很快得到世界范圍內(nèi)的普遍認可,成為戰(zhàn)后影響最大的一種平面設(shè)計風(fēng)格,也是國際最流行的風(fēng)格,因此,又被稱為國際主義平面設(shè)計風(fēng)格;
簡單的說,瑞士的這種設(shè)計風(fēng)格典型的代表就是我們看到的雜志,其中有 3 個特點:講究網(wǎng)格 / 非常理智的克制顏色的使用 / 層級關(guān)系;有趣的是,審美和潮流是循環(huán)的,隨著時代的發(fā)展,越來越多的 app 開始重新挖掘出來瑞士風(fēng)格并加以使用,比如我們 iOS 系統(tǒng)自帶的應(yīng)用們,Spotify:
年少的時候,我經(jīng)??粗@些個 app 會不禁的問,為什么在沒有一張圖片的情況下還能如此好看?這些年終于明白了前人良苦用心:文字是內(nèi)容,同樣也是構(gòu)成;是信息,同樣也是裝飾;簡單可以理解為,不管在平面還是網(wǎng)頁亦或者是 UI 界面,在沒有可用的裝飾下,信息本身要承擔(dān)起裝飾和傳達的雙重功能,這就是瑞士風(fēng)格的核心本質(zhì)。
2. 擬物風(fēng)格
iOS 是擬物的典型代表,網(wǎng)上對于這塊的講解已經(jīng)過于飽和了,我也沒必要贅述;那么這一趴,來聊聊對我產(chǎn)生深遠影響的錘子科技吧。我第一次接觸到 smartisan OS 并沒有覺著多么驚艷,潛意識里只不過是覺著把 iOS 的圖標畫的更漂亮了一點而已…
但當(dāng)我打開下圖這個頁面的時候,我意識到我對擬物的理解還是淺薄了,第一次被光影的層次震撼到:
通過光影塑造了一個三維空間,讓整個畫面豐富飽滿,也打破了我幼稚的設(shè)計觀,PS.不管錘子科技現(xiàn)在如何,我依然敬佩 Paco / 方遲 / 羅子雄的設(shè)計團隊為這個行業(yè)做出的貢獻,respect!
毫無保留的說,我的設(shè)計就是二者的融合,以 層次對比 作為核心理念。
啰嗦了半天,趕緊進入正題;如果你是一名產(chǎn)品體驗設(shè)計師,一定聽說過 “奧卡姆剃刀” ,這個定律通常用在交互鏈路的設(shè)計上(意思就是在用戶路徑中沒必要的步驟,省了就完事了),“如無必要,勿增實體” 即簡單有效原理;
同樣,在嘈雜的視覺結(jié)構(gòu)里,畫面也需要奧卡姆剃刀,當(dāng)你在對畫面的飽和上困擾不已,并急于找到一些背景和紋理填充的時候,我建議你先冷靜一下…因為頁面的空虛未必是需要實體化的東西來填充的;上文有說過以 “層次對比” 作為核心理念出發(fā),要區(qū)別于平面設(shè)計,營造一個立體空間,所以先理一下畫面結(jié)構(gòu):
通常來講,如果想要不平,把二維空間轉(zhuǎn)化成三維空間是必要的一步,需要在 Z 軸上下功夫;如果你恰巧也是一名攝影愛好者,可以想象下照相機的焦距和景深,工作原理是相同的,需要 前景 / 主體和背景 三個層次;當(dāng)然,虛實的對比對信息的呈現(xiàn)和層次的拉開是極其重要的,這里需要通過景深來控制效果,你可以通過 photoshop 濾鏡-模糊畫廊的“場景模糊”來做到:
另外,空間的感覺想要被突顯,那么“光影和空氣”的價值就可以無限放大了,按照如上所說的結(jié)構(gòu),把內(nèi)容和自然物質(zhì)擺進去就好了,甚至可以做到舉一反三(比如不同顏色的氛圍,我就不展開了):
整個 case 下來,你會發(fā)現(xiàn)用光來聚焦在信息上,自然而然就形成了我們說所得 “信息優(yōu)先級”;有點時候空氣和光影的飽滿程度超乎你的想象,這種自然存在的物質(zhì)可以很好的幫助畫面分層,以達到填充的效果,并不是一定要依賴于實體化的裝飾。
對了,如果你跟我一樣閑著沒事干的話,借用 keynote 的動畫效果做一個吊炸天的動效,一定可以成為匯報場上最靚的崽(注意:視頻有音樂)!
keynote 素材和視頻可在開頭/文末下載
本來不打算再開一個章節(jié)說這個,但還是覺著很有必要再說下(我好糾結(jié)),作為 PPT 來講,ta 的主要用途分為兩種:其一是給人看的,其二是給人講的;不管是哪種,盡可能的簡化文字,是對輸入者關(guān)愛;
以上圖為例(實名 diss 自己的作品),坦誠的講左邊的部分大多數(shù)觀者是不會有心思來看的,按照視覺系統(tǒng)的處理,這部分就會被當(dāng)成一個“面”而被忽略掉,這種情況下右邊顯得有力很多,也能幫助觀者聚焦信息,所以還是那句話,能不寫的就別寫,能少些的別多寫,保持信息的密度也是設(shè)計師必要的職責(zé)之一。
想問一個問題,鐵子們覺著 UI 的本質(zhì)或者作用是什么?從我個人的角度來講,UI 設(shè)計的本質(zhì)就是對信息的整理歸類和編排,沒有什么比信息更重要,如果貿(mào)然為了飽滿加入一些裝飾元素,很有可能是本末倒置,得不償失。這就像喝酒一樣,喝醉很容易,但微醺的感覺才是最棒的,希望你能有個好心情迎接美好的一年~
文章來源:優(yōu)設(shè)網(wǎng) 作者:負能量補給站
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
編輯導(dǎo)讀:隨著5G技術(shù)的發(fā)展和AI的不斷進步,自動駕駛產(chǎn)業(yè)迎來了發(fā)展的快速時期。而車聯(lián)網(wǎng)作為自動駕駛產(chǎn)業(yè)鏈上的關(guān)鍵一環(huán),吸引了包括百度阿里騰訊華為等巨頭的注意,紛紛投入資金和精力,希望在市場中搶占先機。本文作者總結(jié)車聯(lián)網(wǎng)2020年的發(fā)展,與你分享。
在5G應(yīng)用加快落地、AI技術(shù)不斷進步之時,自動駕駛產(chǎn)業(yè)迎來了發(fā)展的快速時期。特別是在傳統(tǒng)汽車行業(yè)進入“新四化”的大趨勢中,車聯(lián)網(wǎng)更是成為自動駕駛產(chǎn)業(yè)鏈上的關(guān)鍵一環(huán)。
2020年“車聯(lián)網(wǎng)”作為汽車行業(yè)技術(shù)發(fā)展研究中的一個重要領(lǐng)域,已經(jīng)成為國內(nèi)外新一輪科技創(chuàng)新和產(chǎn)業(yè)發(fā)展的熱點?;仡櫿麄€2020年,國內(nèi)車聯(lián)網(wǎng)領(lǐng)域的發(fā)展也是穩(wěn)步向前。
近些年,在汽車產(chǎn)業(yè)“新四化”的推動下,“聯(lián)網(wǎng)化”已經(jīng)被當(dāng)成汽車真正成為智能化終端的基礎(chǔ),并且據(jù)業(yè)內(nèi)人士估算,車聯(lián)網(wǎng)技術(shù)如果得到充分應(yīng)用,將能夠降低20%的能源消耗和25%~30%的尾氣排放;緩解60%的交通擁堵,提高現(xiàn)有道路通行能力2~3倍;減少80%的車輛事故率和30%~70%的死亡人數(shù),其重要性不言而喻。
日前,IHSMarkit發(fā)布了的《2020年中國智能網(wǎng)聯(lián)市場發(fā)展趨勢報告》報告顯示,中國搭載智能網(wǎng)聯(lián)功能的汽車市場規(guī)模預(yù)計將在未來持續(xù)增長,并在2025年超過75%,高于全球水平。
也正因如此,車聯(lián)網(wǎng)已經(jīng)成為這些年巨頭們在互聯(lián)網(wǎng)下半場競逐的主要賽道,從市場競爭方面來看,百度入局,多年時間在自動駕駛賽道殫精竭慮;阿里搶入其中,聯(lián)手上汽打造斑馬智行;騰訊當(dāng)然也沒坐以待斃,更是打造出騰訊車聯(lián)、蘑菇車聯(lián)、梧桐車聯(lián)三張牌;在BAT之后,華為也不甘示弱,成立了智能汽車解決方案事業(yè)部,攜鴻蒙OS籌建自身朋友圈;今年車聯(lián)網(wǎng)賽道戰(zhàn)事再升級,京東、字節(jié)跳動也先后宣布加入混戰(zhàn),至此巨頭云集的車聯(lián)網(wǎng)迎來“大割據(jù)時代”。
巨頭混戰(zhàn)同樣也在加速車聯(lián)網(wǎng)商業(yè)化進程,有專家表示“智能駕駛下的車聯(lián)網(wǎng)是未來,3到5年可以全面實現(xiàn)。”而市場數(shù)據(jù)同樣也在印證這一說法。
在《2020年中國智能網(wǎng)聯(lián)市場發(fā)展趨勢報告》中,公布了今年BAT車聯(lián)網(wǎng)系統(tǒng)的上車情況,具體來看,今年1-7月的新車銷量市場占比中,百度實際搭載新車銷量占比高達49%,騰訊占比35%,阿里占比16%。
而2020年全年當(dāng)前市場搭載車型數(shù)量預(yù)估來看,百度預(yù)計將有61款搭載小度車載的車型上市,大大領(lǐng)先于阿里的32款及騰訊的26款,截止目前百度合作上市車型已超過600余款。
另外,在合作品牌方面,2020年也迎來了較大突破,BAT車聯(lián)網(wǎng)合作汽車品牌在今年都有所增加,截止今年8月,百度Apollo智能車聯(lián)已與奔馳、寶馬、奧迪、福特、別克、凱迪拉克、雷克薩斯、吉利、長城、奇瑞、現(xiàn)代、起亞等汽車品牌達成合作;阿里方面則有福特、斯柯達、名爵、榮威、觀致、寶駿等上汽品牌;騰訊合作方則有哈佛、吉利、長安、福特、奧迪、寶馬、Jeep、瑪莎拉蒂等品牌。
從品牌數(shù)量上能看出,依舊是百度遙遙領(lǐng)先,并且更大的優(yōu)勢在于百度Apollo智能車聯(lián)不僅合作車企數(shù)量多,同時全面覆蓋各大車系。除了自主品牌外,與德系、美系、韓系、日系的眾多汽車品牌也在保持緊密合作,而這正是騰訊與阿里所缺乏的。
值得一提的是,在前不久的百度Apollo生態(tài)大會上百度提出了“領(lǐng)先一代”的概念和內(nèi)容,其中“領(lǐng)先一代商業(yè)模式”就是重點之一,所謂領(lǐng)先一代商業(yè)模式是指,通過小度助手汽車版將為整成廠商提供從賣硬件到賣軟件與服務(wù)的轉(zhuǎn)型,為整車廠商開拓更寬廣的增長引擎,將車聯(lián)網(wǎng)從成本中心直接變成利潤中心,并打造“會呼吸、有生命、可進化”的載體驗,幫助整車伙伴業(yè)務(wù)持續(xù)升級,并且小度助手汽車版將通過高度集成的新運營工具集,賦能車企全周期用戶運營。
2020年已被不少人視為5G車聯(lián)網(wǎng)商用的拐點,在“軟件定義汽車”的共識下,無論是軟件企業(yè)還是整車品牌都在越跑越快,在百度Apollo生態(tài)大會上百度Apollo智能車聯(lián)事業(yè)部總經(jīng)理蘇坦就表示:“汽車行業(yè)正在經(jīng)歷著前所未有的變革,軟件正在定義著硬件,智能也在定義著性能,而車已經(jīng)開始有了靈魂,這靈魂正在定義著車的形態(tài)。”
從軟件到服務(wù)、到智能硬件支持、再到整體解決方案,車聯(lián)網(wǎng)產(chǎn)業(yè)鏈上的每一個環(huán)節(jié)都蘊藏這巨大商機,而百度們正在加速開啟。
當(dāng)下車聯(lián)網(wǎng)技術(shù)層面的競爭,包括BAT在內(nèi)玩家都在宣傳自家的車聯(lián)網(wǎng)方案都是一個開放的生態(tài),都在建立一個開源的“技術(shù)底座”,但其中也存在不少差異。
例如,百度依托Apollo這個當(dāng)下全球最大的自動駕駛開放平臺,集成了包括車輛平臺、硬件平臺、軟件平臺和云端數(shù)據(jù)服務(wù),再通過小度車載OS為智能網(wǎng)聯(lián)系統(tǒng),將能力集中對軟硬件平臺以云端數(shù)據(jù)平臺進行管控,以此成就了百度Apollo智能車聯(lián)的車載場景解決方案。
阿里旗下的斑馬網(wǎng)絡(luò)則是通過與YUNOS重組,形成了具備貫穿端、邊、云、網(wǎng)能力的整體系統(tǒng),使其達成在整車電子電氣架構(gòu)智能化、車機硬件與軟件、車機內(nèi)底層操作系統(tǒng)、上層應(yīng)用形成四個層面的技術(shù)閉環(huán),而AliOS則是鏈接樞紐。
騰訊車聯(lián)網(wǎng)則是由五大基礎(chǔ)框架構(gòu)成,包括大數(shù)據(jù)、云計算、人工智能、安全能力和內(nèi)容平臺,像旗下三張牌之一的蘑菇車聯(lián)就推出了“蘑菇OS+AI云+智能終端+傳感器“的解決方案。日前,梧桐車聯(lián)基于TINNOVE OpenOS技術(shù),也推出了TINNOVE 3.0解決方案。
在外人看來,三家的車聯(lián)網(wǎng)技術(shù)解決方案好像非常接近,只是形式和對概念的表述方式有所差異,其實不然內(nèi)核區(qū)別非常大,簡單來講百度Apollo智能網(wǎng)聯(lián)其覆蓋了包括車聯(lián)網(wǎng)、V2X、自動駕駛?cè)I(lǐng)域的布局,而斑馬,騰訊的解決方案主要僅覆蓋于智能網(wǎng)聯(lián)領(lǐng)域。
再來要弄清楚,車聯(lián)網(wǎng)領(lǐng)域到底需要怎樣的“技術(shù)底座”,是需要滿足不同的車型,為汽車產(chǎn)品提供標準化解決方案?還是需要具備多場景應(yīng)用生態(tài),可以為行業(yè)提供豐富的可兼容性軟件工具?答案是都要具備。
再來對比三大玩家,也是因為解決方案本質(zhì)上覆蓋領(lǐng)域的不同,目前而言能夠滿足這一要求的還只有百度。今年成都、北京的幾大車展上,百度都展現(xiàn)出了這方面的能力,像全新推出的小度車載2021,基于五大基座滿足了為汽車產(chǎn)品提供標準化解決方案;在多場景應(yīng)用生態(tài)方面,依托強大的AI能力,百度車載OS集成了語音、搜索、小程序、地圖導(dǎo)航等百度AI能力。
并且從當(dāng)下市場數(shù)據(jù)中我們能看到,百度Apollo智能車聯(lián)大規(guī)模上車,無論是合作車企品牌,還是搭載車型數(shù)量均位于行業(yè)第一,之前就提到已經(jīng)與70多家汽車企業(yè)合作,合作上市車型超過600余款,這便是最好的證明。
在今年生態(tài)大會上,百度更是提出“領(lǐng)先一代的共贏關(guān)系”,對于開發(fā)者而言,依托小度助手汽車版推出首個車規(guī)級生態(tài)底座,并通過低代碼量的小程序開發(fā)框架和標準組件,讓更多車企與海量小程序?qū)?,并開放豐富的車機流量入口,通過接入豐富成熟的運營?具,形成獨特的跨聯(lián)盟超級APP流量交換。助力開發(fā)者快速達成AI能力閉環(huán),實現(xiàn)一次開發(fā),多屏、多車型適配搭載,讓開發(fā)者快速上車,同時通過豐富的車機流量,承接豐富成熟的運營工具,形成獨特的跨聯(lián)盟超級APP流量交換,引領(lǐng)開發(fā)者實現(xiàn)共贏。
除此之外,智能汽車已進入“人機共駕”新時代,如何打造人與車之間的全方位流暢交互,也成為汽車智能化行業(yè)的核心問題之一,為此百度地圖汽版迎來再次進化,推出了智能領(lǐng)航系統(tǒng),成為了最懂駕駛的下一代智能座艙地圖,面向車企百度地圖汽車版2021提供了三橫一縱全方位地圖解決方案,讓車企量產(chǎn)更加簡單,百度也將這稱之為“領(lǐng)先一代的車載地圖”。百度正的實現(xiàn)“開放”,而這些方面是現(xiàn)階段阿里與騰訊無法比擬的。
2020年百度已經(jīng)成為大部分車廠的技術(shù)底座已是事實,至于未來這個位置是否會發(fā)生變化,還要看百度能否一步快步步快。
最后,隨著車聯(lián)網(wǎng)滲透率越來越高,汽車的駕乘體驗不再局限于駕駛感受、靜音舒適這類硬件機械層面的體驗,而延伸到車機交互、LBS服務(wù)等基于技術(shù)能力和內(nèi)容生態(tài)方面的體驗感受。
而2020年正是車載內(nèi)容生態(tài)爆發(fā)的一年,“車內(nèi)大生態(tài)”這一概念也被提出,BAT依然是這方面的佼佼者。
百度方面,車載生態(tài)一直都是強項。比如LBS,百度已經(jīng)打造了中國車載領(lǐng)域最豐富的LBS服務(wù)基礎(chǔ)設(shè)施;數(shù)據(jù)基座方面,同樣建立起了一套完整的專為汽車和出行服務(wù)的數(shù)據(jù)平臺,通過對車內(nèi)車外云端數(shù)據(jù)整合和大數(shù)據(jù)分析,實現(xiàn)數(shù)據(jù)驅(qū)動變革;至于生態(tài)伙伴方面,截至目前Apollo已引入喜馬拉雅、QQ音樂、蜻蜓FM等頭部生態(tài)伙伴超300家,并且囊括了全球所有主流汽車制造商、一級零部件供應(yīng)商、芯片公司、傳感器公司、交通集成商、出行企業(yè)等等,覆蓋了從硬件到軟件的完整產(chǎn)業(yè)鏈?!败浻布媸?、內(nèi)外兼修”是百度在車聯(lián)網(wǎng)內(nèi)容生態(tài)方面路徑。
阿里在車聯(lián)網(wǎng)生態(tài)方面則有著不小的麻煩,“自生態(tài)閉環(huán)”遭到不少質(zhì)疑,所謂“自生態(tài)閉環(huán)”即AliOS系統(tǒng)所搭載軟件均為“阿里系”APP,地圖一律用高德,音樂為蝦米,每個都裝有支付寶,若安裝車載微信等第三方軟件,需要將斑馬系統(tǒng)破解。特別是當(dāng)下“反壟斷”成為熱點后,阿里車聯(lián)網(wǎng)生態(tài)也在遭受質(zhì)疑,有行業(yè)人士認為“閉環(huán)說白了就是壟斷,客戶的選擇有排他性,上面搭載的軟件不管好不好用,都得用它的。”
在大方向上,騰訊與阿里一樣也有著自己的“生態(tài)閉環(huán)”,但今年騰訊在車載內(nèi)容生態(tài)上的布局并非以內(nèi)容為主,像今年推出的騰訊生態(tài)車聯(lián)網(wǎng)3.0作用在 “上車速度”方面,用騰訊的話來說,其搭建了一個適合車載的應(yīng)用框架——“小場景”,可以通過云端統(tǒng)一發(fā)送,減少了對車輛硬件的占用,但同時又更容易上車。現(xiàn)階段騰訊內(nèi)容生態(tài)主要包含了微信車載版、愛趣聽、小場景、云小微語音助手、騰訊地圖等程序,并且已落地到部分車型。
三家對比可以發(fā)現(xiàn),無論是數(shù)量上還是質(zhì)量上,百度都有著較大的優(yōu)勢,其一百度擁有更多的第三方軟件來源,也是因為企業(yè)屬性,百度需要更多來自外界的助力;其二,在內(nèi)容生態(tài)層面同樣是百度更加開放,不同于阿里、騰訊的“自生態(tài)閉環(huán)”,像支付環(huán)節(jié),小度車載OS提供的支付渠道中,不但有百度的度小滿,還有銀聯(lián)、支付寶和微信支付等渠道也都可由用戶自行選擇。
更重要的是,百度還推出了“領(lǐng)先一代的智能車內(nèi)體驗”,像小度助手汽車版就是專門為車而生的車載Killer App,帶來領(lǐng)先一代的智能化體驗。例如,在交互方面小度助手汽車版創(chuàng)新發(fā)布專屬虛擬助手形象,用戶只需上傳一張自己的照片,就可以得到一個投射在車機中的虛擬形象,成為自己專屬的虛擬助手,從新交互、新智能、新場景、新生態(tài)四方面引領(lǐng)全新的用戶體驗;又比如在車載地圖方面,面向用戶,百度地圖汽車版2021導(dǎo)航將更加智能,包括融合定位、多屏聯(lián)動導(dǎo)航、電動車出行服務(wù)化、場景出行服務(wù)化等,像提前感知可輔助駕駛路段,幫助用戶提前決策、實現(xiàn)全行程的規(guī)劃和安全引導(dǎo)等等。之外,小度助手汽車版還搭建了全新Feed流式交互框架、全雙工多模融合交互、SMLTA離在線語音模型等多種全新的交互方式,讓用戶擁有更加便利、快捷的交互體驗。
當(dāng)然,目前也不是終點,即便BAT暫時領(lǐng)先,但包括華為在內(nèi)的新選擇都在躍躍欲試,像百度現(xiàn)在雖然有著顯著的領(lǐng)先優(yōu)勢,但也無法掉以輕心。
回到智能汽車發(fā)展層面,雖然現(xiàn)階段整個行業(yè)仍然處于起步階段,但從“車聯(lián)網(wǎng)”這些局部區(qū)域也大致能進行一些判斷。
透過車聯(lián)網(wǎng)我們能看到,百度自身的技術(shù)和生態(tài)基礎(chǔ)已經(jīng)足夠強大,且作為中國自動駕駛道路測試牌照最多、專利申請數(shù)量最多、生態(tài)最龐大的玩家,百度各方面都處于領(lǐng)先。但智能駕駛無法一蹴而就,百度也還有較大的上升空間。
特別是今年百度已經(jīng)實現(xiàn)在智能汽車“增量供應(yīng)商”的競爭中提前占位,而“領(lǐng)先一代”概念和內(nèi)容的提出更是讓百度在車聯(lián)網(wǎng)乃至智能駕駛領(lǐng)域登上了更高的山峰,同時在商業(yè)化、技術(shù)、生態(tài)等方面的全面推動下,不得不說百度已是國內(nèi)智能駕駛領(lǐng)域當(dāng)之無愧的“頭號玩家”。
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
前言
在這艱難又魔幻的2020年的尾聲,有必要系統(tǒng)匯總下關(guān)于UI/UX的設(shè)計發(fā)展方向,為接下來的2021的開篇帶個好頭。本文在了解這些趨勢的同時,分析特點并舉例落地實例,來幫助大家啟發(fā)創(chuàng)意設(shè)計工作的思考切入點。
流行趨勢跟人們所處的環(huán)境密切相關(guān),從最初的方塊馬賽克——>追求極度寫實——>扁平風(fēng)——>到現(xiàn)在的質(zhì)感擬物,扁平設(shè)計霸屏的這幾年,設(shè)計風(fēng)又向更立體、豐富、更有層次感的方向發(fā)展,所以說趨勢就是一個輪回。設(shè)計風(fēng)格沒有絕對的好壞,在審美達到一定疲勞時,就會開始出現(xiàn)新的設(shè)計風(fēng)格。每一個新風(fēng)格都值得設(shè)計師去拆解、思考,本質(zhì)都是為了提升更好的交互體驗。
而在進入下一個十年的過程中,我們對數(shù)字產(chǎn)品和體驗的依賴將日益增長,預(yù)測真正勝出的將會是3D動畫和用戶界面/用戶體驗設(shè)計的結(jié)合設(shè)計,5G技術(shù)的發(fā)展,它將重塑了我們以前無法想象的交互方式,這將是一段充滿創(chuàng)意、鼓舞人心的發(fā)展階段。在這里讓我們來看看未來那些不可忽視的設(shè)計趨勢吧。
(注:圖片來自網(wǎng)絡(luò),均標明出處及作者,若有侵權(quán)請告知刪除)
1、3D與UI結(jié)合
隨著且易用的3d軟件工具的出現(xiàn),3D 元素已經(jīng)開始變得越來越受歡迎,而在這之前,UI界面一直被平面設(shè)計所主導(dǎo)。與 2D 不同,它提供了更為逼真的立體效果,從插畫、動效、電商到平面視覺,在所有的設(shè)計類型中都能找到它,3D現(xiàn)實主義已是各個領(lǐng)域的大勢。
圈中也出現(xiàn)了很多免費或付費的3D預(yù)設(shè)元素及場景組件,幫助3D小白更快地搭建出具有沖擊力的視覺組合。
特點:
? 直觀感受;
? 立體真實;
? 形態(tài)豐富;
▲Izmahsa
▲Mike
▲Tran Mau Tri Tam ?
▲Vikiiing
▲https://www.awwwards.com/inspiration/3d-hover-number-reveal
實例應(yīng)用:
各大廠都開始紛紛嘗試在產(chǎn)品中加入3D元素,將自家IP立體化,植入到各個品牌靜態(tài)頁面,加深品牌印象滲入。3D技術(shù)雖然已經(jīng)出現(xiàn)有一段時間了,但是為了保證速度和性能表現(xiàn),較少應(yīng)用到產(chǎn)品中,隨著軟件技術(shù)的提升,立體渲染產(chǎn)品將開始慢慢運用到更多的界面交互、H5活動中。
▲閑魚、QQ、花椒直播的3D啟動頁
▲得物(毒)的3D空間動效
網(wǎng)易云音樂每年的音樂總結(jié)報告都追隨著的設(shè)計潮流,今年還可以自由選擇人物形象,增強了用戶的主觀代入感,以下是每年的設(shè)計風(fēng)格變化:
▲2018-漸變插畫、2019-撞色漸變、2020-3D人物場景
▲2020-總結(jié)陳詞H5
▲總結(jié)報告Banner的動效
其中IP立體化最多的當(dāng)屬K12教育領(lǐng)域,除了制作IP周邊外,3D效果能適應(yīng)豐富的運營場景,高度還原現(xiàn)實世界,給小朋友帶來最真實的學(xué)習(xí)互動體驗。
▲洪恩識字(3D學(xué)習(xí)場景)、騰訊開心鼠英語ABCmouse
▲IP在播放兒歌時的互動
值得一提的是今年蘋果發(fā)布的macOS Big Sur除了玻璃擬態(tài)的變化,圖標還加入了3D維度的擬物視覺層次。
蘋果的 mac OS 的人機交互指南中也明確指出:“圖標不僅是裝飾性的,而且在與用戶交流中起著至關(guān)重要的作用,它應(yīng)該傳達應(yīng)用程序的主要目的并暗示用戶體驗?!边@次扁平化和擬物化的結(jié)合,將又要引領(lǐng)一波設(shè)計趨勢。
2、軟漸變(Soft gradients)
過于強烈的漸變不再是趨勢,大多數(shù)設(shè)計師都開始喜歡使用非常簡單和微妙的漸變,如果產(chǎn)品的目標用戶人群需要輕松溫和的視覺環(huán)境,那么此風(fēng)格再適合不過。
軟漸變包括背景、陰影、反光,常與線條平面圖形結(jié)合,應(yīng)用于界面、網(wǎng)站、圖標、icon等設(shè)計中。
特點:
? 低調(diào)溫和
? 微妙漸變
? 清新愉悅
2.1、柔和背景
在設(shè)計網(wǎng)站中我們已經(jīng)看到了許多非常精致,明亮柔和配色方案,混合兩種以上的顏色來創(chuàng)造多彩的模糊背景。它使設(shè)計看起來非?,F(xiàn)代、不打擾、清新而令人愉悅,其中畫面內(nèi)容是主要視覺焦點。
▲Vladimir Gruev
▲Sajon
▲Anton Mikhaltsov
▲Ghani Pradita
實例應(yīng)用:
▲咔咔、美柚
2.2、柔和陰影
柔和的彩色陰影使UI有了更微妙的深度變化,在圖標設(shè)計中經(jīng)常需要漸變或陰影來塑造物體,柔陰影使設(shè)計元素更豐富立體,并且它們有助于區(qū)分內(nèi)容之間的層次結(jié)構(gòu)。
▲Ghani Pradita
▲Sèrgi Mi
▲Taro Huang
實例應(yīng)用:
▲有道數(shù)學(xué)(已下架)
▲Uki
3、玻璃擬態(tài)(Glassmorphism)
去年新擬態(tài)掀起了一陣狂熱,但這種模擬受到擠壓的塑料效果(凹/凸層次感),在用戶的閱讀性上可能會出現(xiàn)問題,新擬態(tài)更適合用在局部的少量元素點綴,無法完整地使用在整套應(yīng)用程序中。
▲Alexander Plyut
伴隨著今年蘋果發(fā)布的 MacOS Big Sur 操作系統(tǒng)的發(fā)布,新的擬物風(fēng)格正式回歸大眾視野,整體風(fēng)格應(yīng)用了新擬態(tài)(Neumorphism)的設(shè)計思路,利用大量的毛玻璃質(zhì)感和大量投影縱深感,能很好的突出前景信息,中和了扁平化圖文帶來的生硬不立體感。而Big Sur的圖標也加入了 3D 質(zhì)感設(shè)計,設(shè)計語言更為時尚簡潔。蘋果設(shè)計師 Alan Dye 在發(fā)布會上也提到了設(shè)計風(fēng)格轉(zhuǎn)變的原因,主要是希望「降低視覺的復(fù)雜度,讓用戶能夠?qū)⒆⒁饬性趦?nèi)容上」。
而的玻璃擬態(tài)則更加注重垂直空間 z 軸的使用,背景多鮮艷色彩,在上空使用隔一層高斯模糊的毛玻璃質(zhì)感,模糊的邊界有細微的淺色邊框,整體效果就是讓元素之間有虛實結(jié)合的特殊空間。毛玻璃運用在界面中對關(guān)鍵信息起到強調(diào)作用,用戶可以看到物體間的層次關(guān)系,哪一層在哪一層之上,就像物理空間中真實的玻璃一樣。
特點:
? 透氣磨砂
? 層級空間
? 簡潔擬物
▲引領(lǐng)新擬態(tài)風(fēng)格的Alexander的作品也朝著玻璃擬態(tài)變化
▲Kostia Varhatiuk
▲Ghani Pradita
▲Ibrahim emran
▲Queble
實例運用:▲毛玻璃視覺可追溯到2007年發(fā)售的Windows Vista,而當(dāng)時的 OS X Yosemite 也大量使用了這種設(shè)計語言
▲的MacOS Big Sur操作系統(tǒng)
▲圖標的變化
4、暗黑模式
暗黑模式是白色界面的相反版本,適用于午夜時分。之前用了很長時間微信的暗黑模式,突然切換成白色界面后,就像吸血鬼見到太陽光般刺眼,果然暗黑模式用久了還是比較舒服的。
暗黑模式和之前經(jīng)常提到的夜間模式是有區(qū)別的,簡單來說暗黑模式可以在任何場景下使用,并沒有降低對比亮度;夜間模式則專為夜間場景設(shè)計,重在降低對比度,以降低在暗光環(huán)境下屏幕對人眼的刺激。
特點:
? 突出內(nèi)容
? 減輕干擾
? 沉浸體驗
▲Tom Koszyk
▲Victa Wille
▲Golo
▲https://www.awwwards.com/inspiration/3d-hover-number-reveal
▲Tran Mau Tri Tam ?
實例應(yīng)用:
▲有道詞典
▲愛范兒(ifanr)
最常使用暗黑模式的車載系統(tǒng):
▲小度車載
暗黑模式的靈感最早引起大家注意的應(yīng)該是抖音,在這之前大部分的應(yīng)用都是白色為主,抖音整體黑色界面帶來的沉浸以及輕打擾體驗還是很棒的,在這之后也相繼出現(xiàn)了以黑色為主的APP設(shè)計:
▲MOO音樂(可手動切換顏色模式)
▲Space FM
5、多彩高對比度界面
受Material Design調(diào)色板的影響,2020年用戶界面趨勢的一定不能少了亮色和熒光色的,可以作為主色也可以作為輔色,簡約的界面中明亮大膽且對比鮮明的色彩一直都處于增長趨勢。熒光色一直是90后喜歡的風(fēng)格,我個人就非常喜歡熒光色,現(xiàn)在要是談到該風(fēng)格的受眾主力軍可是90后啊。
顏色是為界面添加信息和情緒以及使其看起來美觀和吸引人的最有效方式之一,對比鮮明的顏色在白色和黑色界面上都能很快吸引用戶的注意力,這種風(fēng)格已經(jīng)成為清新、酷炫、數(shù)字時代的代名詞,而在2021一趨勢還將會繼續(xù)影響UI、平面、廣告、插畫等領(lǐng)域。
特點:
? 活潑大膽
? 對比鮮明
? 潮流科技
▲Amy Martino
▲Halo Mobile
▲Anastasia
▲Paolo Spazzini
在網(wǎng)站設(shè)計中的應(yīng)用:
▲https://www.theartcenter.nyc/
▲https://www.squadeasy.com/en/
實例應(yīng)用:
▲GoFun出行
▲開言英語
6、抽象幾何元素
從上世紀初開始,抽象構(gòu)成中的簡單幾何形狀就已經(jīng)用于視覺藝術(shù)中,多用于主背景主題或色彩細節(jié),使用鋼筆工具編輯最簡單的形狀(正方形,圓形、橢圓形),加上不同的顏色或漸變,讓設(shè)計看起來既規(guī)則又有趣。
幾何圖形可以運用到UI設(shè)計中 ,將它們混合在一起以創(chuàng)建馬賽克的效果,形成具有品牌意向符號的記憶點。
特點:
? 規(guī)則組合
? 品牌印象
? 重復(fù)記憶
▲Johnny Nova
▲Vladimir Gruev
實例應(yīng)用:
最近看到的一組原色視覺剛好融合了高對比度+幾何這兩種風(fēng)格,那就是SHINee的正規(guī)六輯合輯《‘The Story of Light’》,采用紅黃藍三色加上圓形、正方形、三角形的大塊面積來打造畫面空間及變化,帶來極具視覺沖擊的音樂色彩與魅力。
▲專輯的主視覺
當(dāng)然,幾何形狀不止用于色彩圖案細節(jié),在UI界面布局中經(jīng)常使用大塊面圖形,這種設(shè)計方法受到越來越多的關(guān)注。
7、極簡風(fēng)
極簡設(shè)計的前身是2010年代中期精巧又花哨的設(shè)計,這種設(shè)計已經(jīng)存在很長一段時間了,但在2020年,人們每天需要消化的信息量越來越多,所以現(xiàn)在用戶想要盡可能避免“視覺垃圾”,這也是為什么我們會選擇更簡潔專一的界面。
特點
? 專注信息
? 清晰易用
? 簡單操作
▲RonDesignLab
▲Quan
▲BAOLIN
▲Gregory Loshakov
談到極簡主義,就不可避免會涉及到無鍵趨勢,因為按鍵越少就意味著設(shè)計越簡潔,而這種簡化過的設(shè)計將讓手勢操作和語音交互更為流行。
▲Taras Migulko
▲Gleb Kuznetsov?
實例應(yīng)用:
▲夸克瀏覽器的夸克寶寶
8、將視頻應(yīng)用到UI中
在 2020 年,信息的觸達的速度將會變得更快,而視頻是很好的載體,各個年齡段的用戶都喜歡觀看引人入勝的動畫,無論是選擇通過短視頻還是電影的方式來推廣產(chǎn)品,都很好地灌輸品牌理念,建立與受眾群體的關(guān)系,加強用戶忠誠信任感。
特點:
? 營造氛圍
? 類型多樣
? 品牌調(diào)性
▲Fireart Studio
▲Ehsan Rahimi
實例應(yīng)用:
▲moo音樂登錄頁
▲蝦米音樂歡迎頁
9、插畫與3D的界線越來越模糊
藝術(shù)插圖從2017年開始到現(xiàn)在仍然很流行,幾乎適用于任何類型的設(shè)計行業(yè),是設(shè)計領(lǐng)域中最熱的趨勢之一。插畫的視覺能很好的幫助用戶理解產(chǎn)品背后的故事,為了把故事講好,我們可以創(chuàng)造出一個品牌人物,賦予他人格,為他制造一些故事和沖突,最終幫助我們解決產(chǎn)品問題。這是在產(chǎn)品設(shè)計中講好故事的基礎(chǔ),至于講故事的方式,在 UI 和 UX 中都有使用,原理一樣只是落地方式不同。
在2018年的蜘蛛俠平行宇宙中我們就已經(jīng)看到了3D與插畫的結(jié)合,藝術(shù)家保留了人物在美式漫畫中的的線條筆觸,把“手繪”的細節(jié)和質(zhì)感都放大到了熒幕上,在劇中還采用對比強烈的大色塊擴大了視覺張力,分分鐘把漫畫書甩到面前,讓人忍不住驚呼,索尼的藝術(shù)家們是怎么把片子做得這么酷!
▲3D人物的畫筆觸感
▲畫面光源處由波普圓點組成的背景
▲紙本漫畫書中的“聲音詞”
▲漫畫經(jīng)典線條
▲Entei Ryu在3D建模使用插畫質(zhì)感
▲Minh Pham ?在ui界面中的嘗試
實例應(yīng)用:
騰訊旗下音樂平臺JOOX最近的概念宣傳片,從MG、三維、定格、插畫多個風(fēng)格之間來回切換,給我們帶來了一個多元的音樂世界。各大視頻網(wǎng)站還搜不到,不能直接鏈接視頻地址,喜歡的朋友可以關(guān)注微信視頻號“UoU_Studio”觀看完整視頻。
在3D開始迅速發(fā)展的階段,二維與三維之間的界限變得越來越模糊,插畫作品也可以具備強互動性,而3D插畫與動效的結(jié)合提供了一種奇妙的新方法,希望能夠看到未來插畫更多的可能性。
10、更多的微交互動效
最后一點,還是要強調(diào)動效在UI中的的作用,微交互最早出現(xiàn)在 2018 年,讓用戶更好地理解系統(tǒng)如何工作,并在引導(dǎo)其獲得更好的體驗方面扮演著非常重要的角色。它們在 UI 設(shè)計中決定了一個 App 或網(wǎng)站是普通還是優(yōu)秀,從點擊反饋、加載等待、導(dǎo)航交互等等,為用戶界面設(shè)計增加了動態(tài)性,交互性和直觀性。
動效起到的作用:
? 引起人們對應(yīng)該做什么或接下來將要發(fā)生的事情的關(guān)注;
? 創(chuàng)造流暢和視覺愉悅的過渡;
? 帶給使用者美觀的享受;
? 指導(dǎo)我們進行復(fù)雜的操作;
? 確認用戶使用旅程中的操作。
▲Jakub Antalik
▲Forever D.
▲Kingyo
▲Eugene Paryhin
▲Leo Natsume
▲Taras Migulko
實例應(yīng)用:
▲GoFun選擇車輛后的頁面轉(zhuǎn)場動效
結(jié)尾:
2020的趨勢在滿足用戶的美學(xué)要求上,側(cè)重內(nèi)容和感情表達,還會根據(jù)不同設(shè)備載體、新的技術(shù)而變化,為用戶提供的豐富體驗。
借用Adobe設(shè)計副總裁 Jamie Myrold 的一句話:如今設(shè)計師要思考的,絕不僅僅是設(shè)計一款A(yù)pp、網(wǎng)站或設(shè)計工具。我們要思考的是人類的需求、用戶的需求,打造真正人性化、多元化與包容性的設(shè)計。
設(shè)計趨勢還在快速增長變化,有些趨勢總能長期霸屏,未來還將迎來更多新技術(shù),每個設(shè)計人員都可以找到自己喜歡的方向,不管哪種趨勢,最重要的是如何學(xué)習(xí)并合理地運用到產(chǎn)品中,以產(chǎn)生最大的設(shè)計商業(yè)價值。
文章來源:UI中國 作者:_阿丹a_
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
2020年結(jié)束,此時正是一個很好的時間節(jié)點,我們共同探尋2021年即將擁有怎樣的未來。本文將帶你發(fā)現(xiàn),即將在2021年流行的十種移動用戶體驗設(shè)計趨勢。
通過這篇文章,你將全面了解2021UI趨勢中最熱門的Glassmorphism風(fēng)格
轉(zhuǎn)自:站酷
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
“由理有劇”系列以”我們怎樣理解暗黑模式“為開篇,緣由作者正在任職的工作是 TO B 產(chǎn)品交互及界面設(shè)計,入職時正值公司整體產(chǎn)品線升級迭代,用戶界面從淺色模式向暗黑模式探索的階段。這個探索階段面臨的本質(zhì)問題便是“到底什么是暗黑模式”,同時“我們?yōu)槭裁匆冒岛谀J?/strong>”的問題也隨之而來。
為了給公司同事闡述這兩個問題,作者搜集了大量資料,翻閱了相關(guān)產(chǎn)品系統(tǒng)所給出的設(shè)計文檔,重點圍繞“什么是暗黑模式”展開,逐步推敲其中的理論原理,總結(jié)出便于理解的文字內(nèi)容。這樣做的目的簡單有二,一是與產(chǎn)品、開發(fā)、測試方面的同事能夠達成向暗黑模式優(yōu)化升級的共識;二是能夠讓我們的各個產(chǎn)品線更從容地去擁抱暗黑模式的到來。
文章大綱
1、是什么?
2、為什么?
隨著 iOS 13 和 Android 10 的正式發(fā)布,“暗黑模式 (Dark Mode)”一詞逐漸走入了我們的視野,“暗黑模式是什么?”這個問題也一度霸占了Google搜索榜首。想要深入了解暗黑模式,也許我們可以換一個角度,從用戶界面的演進歷史中尋找線索,從而幫助我們更好地理解暗黑模式。
作者自從拜讀了《蘋果三劍客》,對于用戶界面的前世今生才有了更深的了解,蘋果的產(chǎn)品發(fā)展史,某種程度上也可以稱為用戶界面的演進史。廢話不說,下面讓我們一起簡單聊聊。
計算機誕生的早期,其顯示器一直以“暗黑模式”面向操作者,其緣由是早期的顯示技術(shù)一直被CRT主導(dǎo),CRT釋義為“陰極射線顯像管”,在19世紀末被研制出來,因為制造原理相對簡單,所以CRT一直是早期電腦顯示的主力,但在上世紀80年代之前僅支持單色顯示。
下面兩圖分別為蘋果公司于1977至1980年間生產(chǎn)發(fā)售的 Apple II 及 Apple III 型計算機
圖中顯而易見,兩款計算機的顯示方式均為單調(diào)的黑底白字或綠字,呈現(xiàn)出一種“暗黑模式”的視覺效果。蘋果公司的 Apple II 和 Apple III 兩支產(chǎn)品線一直以這種“暗黑模式”面向用戶。這也反映了早期的計算機以輸入代碼執(zhí)行數(shù)字運算作為主要功能,但是這從另一方面反應(yīng)出:未來計算機會借助不斷成長、成熟的電子技術(shù),必將掀起一場接一場的變革,用戶界面也隨之不斷地革新。
上個世紀80年代之后,CRT彩色顯示技術(shù)成熟,逐漸流行普及到各個電子行業(yè),但當(dāng)時主流的計算機操作系統(tǒng)并沒有“圖形界面”這個概念,所以大部分計算機產(chǎn)品依舊延續(xù)了先前黑色背景的顯示方式。
直到1983年1月9日,在年度股東大會上,蘋果宣布了兩款將在未來的計算機行業(yè)中占據(jù)關(guān)鍵地位的產(chǎn)品:一款叫 Apple Lisa (麗薩,老喬的第一個女兒),蘋果第一臺(也是全球第一款)基于圖形用戶界面(GUI)的計算機,也就是 Macintosh 的前身;另一臺叫 Apple IIe ,是已獲高度成功的 Apple II 系列的新一代進階產(chǎn)品。
Apple Lisa 向主流個人電腦行業(yè)介紹了一種全新的鼠標控制的圖形用戶界面,宣布向單調(diào)的黑白用戶界面告別。
運用形象的圖標、方便的下拉菜單和重疊的窗口,替代了此前一貫使用的輸入文字命令,Lisa的圖形用戶界面開啟了消費者與個人電腦交互方式的革新之路。盡管Lisa存在諸多缺點,如定價過高,功能缺失、運行緩慢等,但它的圖形用戶界面依然給它贏得一陣喝彩。
Lisa的GUI影響如此深遠,以至于諸多電腦制造商紛紛加入鼠標控制的GUI領(lǐng)域,爭相模仿。就在Lisa首次亮相十個月后,微軟于1983年11月推出了Windows操作環(huán)境。(對于此事,老喬總是公開譴責(zé)微軟的蓋茨抄襲他的產(chǎn)品創(chuàng)意,甚至想讓蓋茨吃官司,兩位大佬一直不合也是業(yè)界皆知,跑題了...)
///一個有意思的事兒:今年7月份,一位外國的蘋果粉在Twitter上發(fā)布了一條關(guān)于 Apple IIe 型計算機的動態(tài),內(nèi)容展示了自己使用 Apple IIe 型計算機進行智能化任務(wù)的過程,如發(fā)送推文、在Evernote中寫作、發(fā)送電子郵件,甚至控制智能家居(如下圖)。要知道,這臺計算機生產(chǎn)發(fā)售至今已有37年的時間。由此感嘆,不得不說蘋果對于產(chǎn)品的品控做到了那個時代的。
1984年,蘋果發(fā)布了個人計算機 Macintosh(麥金塔),Macintosh 延續(xù)了 Lisa 的圖形界面語言,并向世界普及了圖形用戶界面(Graphic User Interface)的概念,從而開啟了以白色為底色的圖形交互時代。
Lisa獲得的一些成就在 Macintosh 上體現(xiàn)的淋漓盡致,包括靈活的鼠標、點陣影像圖、桌面的布局、形象的圖標、相稱的字體、屏幕上方的下拉菜單和重疊的窗口,這些也得益于日益成熟的顯示技術(shù)和不斷進步的計算處理技術(shù)。形象生動的圖形設(shè)計和界面交互一直是老喬最引以為傲的杰作,不得不說,老喬對于計算機行業(yè)甚至是設(shè)計行業(yè)都有著極高的敏感度和先于旁人的前瞻性。(當(dāng)然,這里的主語應(yīng)該是蘋果)
Macintosh 產(chǎn)品的成功,不是蘋果一味地迎合計算機消費市場,而是利用創(chuàng)新的方式引導(dǎo)市場,引領(lǐng)計算機行業(yè)向人性化的用戶界面發(fā)展、邁進。
至此,我們也徹底地向“暗黑模式”說了再見,全面擁抱“淺色模式”的到來。
麥金塔搭載的 System 1 打破了字符終端的模式,淺色的界面風(fēng)格一直持續(xù)到 System 6 都沒有顯著的改變。直到1991 年的 System 7 開始引入彩色,圖標也增加了隱約的灰色,藍色和黃色陰影。System 7 系列中的 7.6 版本正式被蘋果公司改名為 Mac OS ,而這一年是1997年。
與此同時,微軟的 Windows 從黑屏的 DOS 發(fā)展到全屏幕的 Windows 1,再到較為成熟的 Windows 3,最后演變到奠定當(dāng)今 Windows 界面基礎(chǔ)的炫麗多彩的 Windows 95。用那個時代的眼光來看,微軟的變化是相當(dāng)驚人的,微軟儼然成為了一匹計算機行業(yè)的黑馬,一路趕超蘋果成為行業(yè)霸主,而蘋果因為因循守舊,在界面設(shè)計上從領(lǐng)先掉到了最后。
此后,從 Mac OS 8 到 Mac OS X Server 1.0 ,蘋果一直專注于改善操作系統(tǒng)和優(yōu)化界面表現(xiàn),直到2001 年 3 月,經(jīng)歷了四個開發(fā)者預(yù)覽版和一個公共測試版之后的 Aqua 界面終于跟隨 10.0 正式發(fā)布,發(fā)布后改變了人們對計算機界面的印象,在隨后的10年里蘋果一直沿用這套界面風(fēng)格。
OS X 系列用戶界面較大的更新來自于2007年10月發(fā)布的 10.5 Leopard 豹,雖然基本的界面仍為 Aqua 和其糖果滾動條,但新加入了一些鉑灰色和藍色,另外重新設(shè)計的 3D Dock和更多的動畫交互使得新界面看上去 3D效果更強,此外還改進了 Finder、半透明菜單條并新增了最初只用于 iTunes 的 Cover Flow界面。
整體來說,Mac OS X 10.5 Leopard 豹 這一版本的用戶界面相比之前有了翻天覆地的變化,靈活生動的圖形語言和交互體驗重新得到了用戶青睞,蘋果也以此,再一次走上了引領(lǐng)潮流之路,使得多彩的“淺色模式”成為用戶交互界面的主流。
蘋果開創(chuàng)性的界面圖形語言也延續(xù)到了移動設(shè)備領(lǐng)域。
2007年的初代iPhone作為蘋果公司第一個移動設(shè)備產(chǎn)品(iPhone1代)首次亮相市場,驚艷了整個行業(yè),iPhone搭載的 iPhone OS 和后來更名為 iOS 的系統(tǒng),延續(xù)了 Mac OS 用戶界面的設(shè)計語言。在歷代iPhone上可以看到?jīng)]有物理鍵盤侵占空間的屏幕,精美的的方塊圖案整齊的排列開來,顏色豐富且耐看。
依稀記得當(dāng)時的我們,還玩著黑白屏幕上的俄羅斯方塊,還敲打著物理鍵盤上的九宮格,挪雞鴨也表示永不為奴。
2010年堪稱iPhone史上最重要的一年,蘋果推出了“改變一切”的iPhone 4,并對其用戶界面進行了革新。
生動的擬物化設(shè)計風(fēng)格正式成為業(yè)界潮流,這也使得UI行業(yè)逐漸熱了起來,蘋果的界面設(shè)計規(guī)范也順勢成為了主流的移動端設(shè)計規(guī)范。
蘋果以此作為移動端界面設(shè)計的基礎(chǔ),沿用到之后的iPhone系列中,期間iOS系統(tǒng)的風(fēng)格保持依舊,只有 iPhone 5S 搭載的 iOS 7 做出了圖標由擬物化向扁平化的改變,但整體都以“淺色模式”作為主流的用戶界面視覺模式。
在 Mac OS 的系統(tǒng)上,用戶可以通過“通用設(shè)置-外觀”來對整體界面進行淺色、深色的切換,可以看出,蘋果早已把“暗黑模式”納入到他們的開發(fā)隊列中,也就是說,“暗黑模式”的概念主要來源于蘋果的 Mac OS,這也為“暗黑模式”的正式登場埋下了伏筆。
自從有了這個概念之后,很多網(wǎng)站都為用戶提供了“淺色”和“深色”兩套界面,便于用戶根據(jù)自己的習(xí)慣或愛好進行切換。在 Mac OS 之后,很多 App 和 Android 定制 ROM 也加入了所謂“深色模式”的支持,其中也不乏 Web 端的網(wǎng)站、系統(tǒng)等。
北京時間2019年6月4日,果粉期待已久的蘋果WWDC19如期而至。
發(fā)布會上,庫克一如既往地優(yōu)先調(diào)侃了Andriod系統(tǒng)一番….(蘋果一直喜歡用數(shù)據(jù)說話,想了解的同學(xué)可以回顧一下發(fā)布會的視頻)
言歸正傳,在發(fā)布了一系列硬件之后,庫克終于介紹了大家期待已久的 iOS 13。新發(fā)布的 iOS 13,除了提升系統(tǒng)流暢度和增加系統(tǒng)穩(wěn)定性外,還介紹了其他提升用戶體驗的優(yōu)化。
其中,最為引人注目的“暗黑模式”即將亮相于新系統(tǒng)。
發(fā)布會表示,暗黑模式可以“改善電池壽命,改善視力不佳和強光下的人的可視性,以及在弱光環(huán)境中更好地使用設(shè)備”。
“Wow,beautiful!”、“That’s beautiful!”、“That’s so beautiful!”發(fā)布會的主持人一邊演示使用在暗黑模式下的App應(yīng)用,一邊不由自主地發(fā)出贊美。這也許也受到了老喬的影響,猶如在劇場舞臺中心的話劇演員,有著一種無可比擬的自信和氣場。
但有意思的一點是,主持人展示了 iOS 13 暗黑模式的開發(fā)團隊合照,從極客穿著到賽博朋克式的暗黑搖滾裝扮,這一戲劇性的變化似乎在告訴大家:“玩,我們也是認真的。”
發(fā)布會上簡單演示了暗黑模式下的漂亮界面,雖然沒有過多地闡述暗黑模式的開發(fā)細節(jié),但是這標志著暗黑模式“重新”登上歷史舞臺。
我們從蘋果產(chǎn)品發(fā)展史中,不難發(fā)現(xiàn)蘋果對于用戶體驗的理解是具有創(chuàng)造性的,總是能先于用戶發(fā)現(xiàn)用戶的潛在需求。蘋果產(chǎn)品的發(fā)展史也可以稱之為用戶界面的演進史,從早期黑色背景的計算機桌面發(fā)展到以淺色為主的用戶界面,再到 iOS 13 正式發(fā)布的“暗黑模式”,這一過程貌似是在“返祖”,但這些始終是圍繞以用戶體驗為中心的改變和突破。
“暗黑模式”是什么?拋開技術(shù)理論,簡單理解就是降低用戶界面在設(shè)備上的亮度,以深色的背景、較低的對比度、灰階的色彩來呈現(xiàn)用戶界面,提升用戶使用產(chǎn)品的體驗。
上面我們提到了,根據(jù) Apple 官方的說法,暗黑模式可以“改善電池壽命,改善視力不佳和強光下的人的可視性,以及在弱光環(huán)境中更好地使用設(shè)備”。
我們可以圍繞這個說法,結(jié)合我們與設(shè)備、環(huán)境的關(guān)系進行探討。
隨著人們對智能設(shè)備的依賴性越來越強,設(shè)備使用的時間也高頻覆蓋了白天到黑夜,夜晚使用的頻率更是與日俱增,所以暗光環(huán)境的使用需求被實實在在地擺到了臺面上。以設(shè)計職業(yè)為例,在阿里巴巴 UCAN 2019 設(shè)計大會上分享的數(shù)據(jù)結(jié)果顯示:設(shè)計師群體夜晚的工作時間通常在5-6個小時…
不是在加班就是在加班路上的我們更習(xí)慣于在夜間工作,夜間安靜的環(huán)境更能讓我們專注設(shè)計、靈感爆棚。但這也在另一方面表達了我們需要設(shè)備更加符合我們在弱光環(huán)境下的視聽需求。
Dark Mode 由此應(yīng)運而生,使用暗色模式可以縮小屏幕顯示內(nèi)容與環(huán)境光強度的差距,可以保證使用者在暗光環(huán)境下使用設(shè)備的舒適度。也就是說 Dark Mode 可以降低屏幕的整體視覺亮度,降低對眼睛的視覺壓力,再也不用怕夜晚的設(shè)備屏幕刺瞎我們的雙眼了。
但這里我們要理解一個概念,“降低對眼睛的視覺壓力”并不等同于所謂的“護眼”,夜晚使用暗黑模式的設(shè)備,實際上并沒有改變屏幕的“頻閃”問題,所以說用戶看屏幕的時候依舊會有視覺疲勞的癥狀,所以各位大佬還是晚上少看屏幕,多愛護眼睛吧。
想象一下,我們在電影院看電影時,為什么要全場關(guān)燈?
甚至有些APP, 在影片的下方也會有一個模擬關(guān)燈效果的按鈕,來讓整個手機屏幕變黑, 只剩下視頻畫面的部分,這都幫助我們可以更專注、更沉浸在當(dāng)前的內(nèi)容下,也就是所謂的“沉浸感”。
這其中的原理就是色彩本身是具有層級關(guān)系的,深色會在視覺感官上自動后退,淺色部分則會向前延展,這樣對比強烈的層次關(guān)系可以讓用戶更注重被凸顯出來的內(nèi)容和交互操作;尤其在信息負責(zé)界面內(nèi)層級關(guān)系的合理拉開對操作效率都有明顯的促進作用。
這一點在股票交易軟件上就是最好的驗證,目前來看全世界絕大多數(shù)的股票軟件采用的都是負極性,也就是暗色底的設(shè)計方式。紅色和綠色代表的漲或跌(不同國家顏色表示可能不一樣)在這樣的深色背景下就會特別顯眼,還有一些顏色比如藍色用于某些數(shù)據(jù)的走勢圖。這樣的顯示幫助用戶更好地集中精力在數(shù)據(jù)獲取上,更快地做出決策。
這里所提到的消費品味是來自用戶層面的潛在心理需求。
從心理學(xué)角度而言,顏色可以影響觀者的感受和情緒,這直接影響到用戶對于一個事物的判斷和選擇,這就像我們消費購物一般,有時候我們的消費不完全是為功能、實用性買單,而更加看重的是一個產(chǎn)品的外觀屬性,當(dāng)產(chǎn)品的外觀符合我們的消費審美甚至超越預(yù)期時,我們往往會更快地做出消費選擇。
而黑色在積極層面的外在直觀表現(xiàn)為高貴、莊嚴、鎮(zhèn)定、神秘,這代表著黑色相比其他顏色存在著更多的可能性,這也造就了黑色成為百搭色,可以作為其他顏色的底色、陪襯色進行使用。暗黑模式也存在同樣的心理暗示,沉穩(wěn)、神秘的黑色會讓用戶聯(lián)想到產(chǎn)品的穩(wěn)定和高級,提升用戶的心理信任度,迎合用戶的消費品味。
最后才探討耗電功效方面的問題,算是一個壓軸問題了,在某種程度上說,智能移動設(shè)備目前最大的矛盾是性能與電池功效的博弈。如果去微博等社交網(wǎng)站進行搜索可以發(fā)現(xiàn),為了省電而使用深色主題或者說黑暗模式的用戶大有人在,尤其是一些中高端采用 OLED 屏幕的手機。這是為什么?
暗黑模式省電的作用來源于 OLED 這種材質(zhì)的特性,這種屏幕經(jīng)過多年發(fā)展如今已經(jīng)取代了 LCD 在中高端手機上的地位。和 LCD 依賴于背光不同,OLED 自發(fā)光的特性使得屏幕能夠獨立控制單個像素是否發(fā)光,也就是說畫面越黑,采用 OLED 屏幕的手機就越省電。下圖做了一個簡單的理解示例,每一列的格子代表亮度,在不同亮度下有相對應(yīng)的耗電量顯示,閃電的亮度代表耗電量的多少。
理解了簡單含義,我們再來看一下Notebookcheck上對于OLED功耗的專業(yè)研究數(shù)據(jù)。在使用 OLED 屏幕時,屏幕上顯示的內(nèi)容決定了功耗。當(dāng)屏幕基本全黑時(OLED <1% White),OLED 屏在任何亮度下的功耗都保持恒定。顯示了白色內(nèi)容的屏幕,功耗曲線會隨著亮度提高而逐漸變陡。
上面的可視化圖表相對來說可能需要一定的理解時間,讓我們翻譯簡化一下。
上圖顯而易見,OLED屏幕的耗電量不僅受到亮度高低的影響,關(guān)鍵在于在OLED屏幕顯示了什么,有多少區(qū)域是淺色甚至是白色的,有多少區(qū)域是深色甚至黑色的,深色區(qū)域占比越高,相比較之下OLED屏幕也就越省電。這也就證明:OLED屏幕在使用以深色為主的顯示模式時,能夠降低耗電量,提升供電效率,也就是改善電池壽命。
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
設(shè)計趨勢輪回,玻璃效果以一種新的展現(xiàn)形式回歸,我們以往對它的稱呼有毛玻璃效果、磨砂效果等,在下文中統(tǒng)稱為毛玻璃擬態(tài)。
設(shè)計趨勢總是在不斷的變化,近幾年擬物風(fēng)格又以新的形式——新擬態(tài)回歸大眾視野,蘋果發(fā)布了macOS Big Sur 操作系統(tǒng),整體風(fēng)格應(yīng)用了新擬態(tài)的設(shè)計思路,采用了3D質(zhì)感的元素設(shè)計,其中還包含了運用陰影、透明度以及背景模糊/高斯模糊手法模仿玻璃形態(tài),構(gòu)建空間感的新興擬物態(tài)風(fēng)格——毛玻璃擬態(tài)風(fēng)格。
毛玻璃視覺其實可以追溯到2007年微軟發(fā)售的 Windows Vista和Windows7,隨之后來的OS X 10.10(Yosemite)和iOS7中大量出現(xiàn)毛玻璃效果,比如底部快捷菜單欄、通知中心和多任務(wù)切換窗口等,蘋果公司加大了模糊程度,透明效果基于扁平,更順應(yīng)當(dāng)時UI扁平化的設(shè)計趨勢。
后來,蘋果在他們的移動操作系統(tǒng)中大大減少了毛玻璃效果,但是最近在 MacOS Big Sur 中又增加了毛玻璃質(zhì)感。微軟的 Fluent 設(shè)計系統(tǒng)也非常注重這一效果,他們稱這種效果為 “亞克力”,并將其作為設(shè)計系統(tǒng)的組成部分之一。
毛玻璃擬態(tài)模仿了塑料材質(zhì)(凹凸質(zhì)感,凸顯層次感),這個新的視覺風(fēng)格更加注重垂直空間Z軸的使用:
這是注重空間感的典型特征,意味著這種風(fēng)格有助于用戶建立界面的層次結(jié)構(gòu)和深度。用戶可以看到物體間的層次關(guān)系,哪一層在哪一層之上,就像空間中真實的玻璃一樣。
毛玻璃擬態(tài)效果之所以被大家應(yīng)用和認可除了它能帶來的優(yōu)秀視覺表現(xiàn),更重要的是其本身的功能意義,它能幫助設(shè)計師更好的拉開信息層級并達到視覺統(tǒng)一
(1)視覺表達
通過背景毛玻璃化,可以中和扁平化圖文帶來的生硬不立體。在卡片元素上添加毛玻璃效果,與其他元素疊加后視覺上建立層次感,將信息層級更好的表達出來;在圖標中增加毛玻璃效果,可以提升圖標通透的質(zhì)感。
(2)品牌感
良好的視覺統(tǒng)一,有助于提升產(chǎn)品的品牌感。
毛玻璃擬態(tài)效果并不好應(yīng)用于上線產(chǎn)品。它不適用于按鈕或開關(guān)(這些重要的界面元素應(yīng)該具備高對比度,更加清晰明確),模糊效果也要注意分寸,屏幕上過度使用模糊效果,會使整個 UI 對某些用戶可閱讀性差,同時也會使頁面看起來顯臟。
也可以這樣理解,使用毛玻璃擬態(tài)風(fēng)格的前提是卡片內(nèi)部有足夠的對比度和合適的間距來定義層次結(jié)構(gòu),并在視覺上 “分組” 所有相關(guān)的對象。它可以只在一個元素上使用,也可以作為卡片背景修飾視覺效果,這種很容易達到較好的視覺效果,頁面風(fēng)格也會特別亮眼,整體干凈、明亮。
用作卡片背景時,能很好的表達信息之間的層級感,朦朧透出下層視覺元素,營造了良好的視覺美感。
用作APP圖標,可以提升圖標通透的質(zhì)感。常見的三種圖標案例:A.頂部圖形為白色,底部圖形為其他色;B.頂部圖形和底部圖形為同色,頂部圖形顏色明度高;C.頂部圖形和底部圖形不同色
運用毛玻璃去包裝UI界面,頁面風(fēng)格整體干凈、明亮,有較好的視覺效果。
1.和任何基于卡片的布局一樣,物體離我們越近,它吸引的光就越多。在這種情況下,意味著它會更透明一些。
2. 整個效果的基礎(chǔ)是陰影、透明度和背景模糊的組合。這種風(fēng)格可以使用一個透明層,也可以使用多個透明層,但多個透明層疊加在復(fù)雜彩色背景上的效果會更好(當(dāng)至少兩個透明層出現(xiàn)在一個相當(dāng)復(fù)雜的彩色背景上時,玻璃形態(tài)的效果是最突出的)。
重要的是要記住,你不能讓整個形狀透明,需要調(diào)整填充的透明度來達到透明效果。如果不調(diào)整填充的透明度,僅僅是調(diào)整整個對象的透明度,就不會產(chǎn)生模糊的效果。
在上面的例子中,背景模糊值完全相同,但圓形圖像的疊加效果看起來完全不同。當(dāng)填充不透明度為 100% 時,對象的透明度再低也沒有用,根本無法得到想要的模糊效果。
最底層背景在這個效果中扮演著重要的角色。不能太簡單或太單調(diào),否則毛玻璃效果就看不出來,但也不能太復(fù)雜。
復(fù)雜的背景有助于玻璃形態(tài)的展現(xiàn),這可能就是蘋果選擇了彩色背景作為 MacOS Big Sur 默認壁紙的原因。當(dāng)模糊的透明層位于背景之上時,那些容易辨別的色調(diào)差異也很容易被看到。
用作卡片背景繪制操作比較簡單,使用背景模糊就可以搞定,重點在于根據(jù)實際情況進行透明度和模糊度的調(diào)整,這里就不再做展示。
第一步:繪制基礎(chǔ)圖形,頂部圖形顏色#DDEDFF,底部圖形漸變色#00EDFB——#001EEE
第二步:底部圖形復(fù)制一層,做高斯模糊效果,高斯模糊:12,不透明度72%,將模糊層置于頂部圖形上,添加蒙版
第三步:為了更好的增加圖標辨識度,增加漸變描邊,漸變色#FFFFFF——#D5E9FF,圖標繪制完成。
過程中用到的色值和模糊度可以根據(jù)視覺美觀度做適當(dāng)調(diào)整,也可為圖標增加陰影,提升整體效果。
作為設(shè)計師,我們可以看到,設(shè)計趨勢一直在變化,每隔幾年就會轉(zhuǎn)向另一種風(fēng)格,但似乎每種風(fēng)格又有自己的前世今生。所謂趨勢輪回,并不只是單純的回歸,而是以一種的更豐富、更立體、更具有層次感的方式呈現(xiàn)在人們面前。
我們要做的就是不盲目,不盲從,看清楚趨勢變化的本質(zhì)。
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
微信支付、支付寶支付這些常見的支付方式都屬于第三方支付,而在互聯(lián)網(wǎng)發(fā)展的下半場,第三方支付會走向何方呢?本文以第三方支付未來發(fā)展變遷方向洞察為重點,分析內(nèi)容主要包括了第三方支付行業(yè)發(fā)展變遷盤點和第三方支付行業(yè)變遷方向預(yù)判。
1999年,隨著首信易支付的成立,我國的第三方支付業(yè)務(wù)開始正式起步。這一階段,我國第三方支付行業(yè)的監(jiān)管相對混亂,行業(yè)的進入門檻也比較低;第三方支付公司在當(dāng)時所起的作用僅僅相當(dāng)于支付通道,商業(yè)模式單一,業(yè)務(wù)增值空間有限。加上該階段電子商務(wù)在我國尚處于市場起步期,消費者對于第三方支付的整體接受程度依舊不高。因此,當(dāng)時我國第三方支付行業(yè)整體的交易規(guī)模和增速均不突出,不同第三方支付公司之前的產(chǎn)品同質(zhì)化問題較為嚴重,企業(yè)之間的競爭較為激烈。一些規(guī)模較小、商業(yè)模式不清晰的第三方支付公司的業(yè)務(wù)體量隨之開始出現(xiàn)萎縮。
供需兩端雙向發(fā)力,第三方支付交易額快速增長。
供給端,線上交易領(lǐng)域,支付寶在2005年首次提出了“擔(dān)保交易”的概念。這一概念的提出不僅提高了消費者對第三方支付平臺的信任,也進一步拓展了第三方支付公司的業(yè)務(wù)想象空間。線下交易領(lǐng)域,拉卡拉從2007年開始大力進行線下便民支付點的建設(shè)和信用卡還款業(yè)務(wù)的推廣,充分滿足居民日常的支付需求;需求端,電商、在線航旅等行業(yè)的發(fā)展成熟也推動了消費者對于第三方支付的相關(guān)需求。在供需兩端的雙重作用下,2008-2010年,我國第三方支付行業(yè)的交易額連續(xù)3年增長率超過100%。
隨著行業(yè)的發(fā)展和成交額的快速攀升,依然處于監(jiān)管空白期的第三方支付行業(yè)開始出現(xiàn)挪用資金、非法套現(xiàn)等一系列的行業(yè)問題,監(jiān)管層也開始逐漸加強對于第三方支付行業(yè)的監(jiān)管。2010年,央行出臺《非金融機構(gòu)支付服務(wù)管理辦法》,確立了第三方支付相關(guān)的配套管理辦法和細則;2011年,央行正式開始發(fā)放第三方支付牌照,拉卡拉等公司成為首批持牌展業(yè)的第三方支付公司,我國的第三方支付行業(yè)開始正式進入合規(guī)化發(fā)展階段。
支付機構(gòu)積極響應(yīng)監(jiān)管要求,相關(guān)企業(yè)開始移動支付試點。
為第一時間獲得對應(yīng)的支付資質(zhì),眾多支付機構(gòu)積極對監(jiān)管的要求予以回應(yīng),努力滿足監(jiān)管的相關(guān)規(guī)定。
隨著網(wǎng)絡(luò)的逐漸進步和智能手機的問世,通信運營商、銀聯(lián)等機構(gòu)紛紛開始進行移動支付的試點,國內(nèi)的移動支付開始逐漸起步。2011年11月,支付寶正式推出了手機APP二維碼支付業(yè)務(wù),二維碼支付正式在國內(nèi)亮相。
伴隨著移動互聯(lián)網(wǎng)的發(fā)展和智能手機等硬件的逐漸成熟,打車、外賣、理財、紅包轉(zhuǎn)賬等手機端的交易場景開始接連出現(xiàn),居民對于移動支付服務(wù)的相關(guān)需求開始迅速攀升。各家支付機構(gòu)也開始加快移動支付相關(guān)技術(shù)的研發(fā)和市場推廣。在這一過程中,二維碼憑借著自身編碼范圍廣、傳播制作成本低、容錯率高、識讀方便等一系列優(yōu)勢成功上位,逐漸成為市場上最為主流的移動支付方式。
交易規(guī)模迅速攀升,支付機構(gòu)全面擁抱移動互聯(lián)網(wǎng)。
隨著場景、硬件的日趨成熟和居民對移動支付認可度的快速提高,我國移動支付市場的交易規(guī)模也迎來了爆發(fā)式增長。根據(jù)易觀分析數(shù)據(jù)顯示,2015至2017年,我國移動支付市場交易規(guī)模的增速連續(xù)三年超過100%, 2017年的交易規(guī)模增速更是達到了208.7% ;交易規(guī)模的飛速增長也加速了相關(guān)企業(yè)的業(yè)務(wù)布局。拉卡拉、中國銀聯(lián)等支付機構(gòu)先后推出了自己的智能移動支付產(chǎn)品,積極擁抱移動互聯(lián)網(wǎng)。
隨著時代的發(fā)展和社會的進步,我國的互聯(lián)網(wǎng)也正逐漸由消費互聯(lián)網(wǎng)向產(chǎn)業(yè)互聯(lián)網(wǎng)邁進:技術(shù)領(lǐng)域,人工智能、云計算、區(qū)塊鏈等技術(shù)逐漸發(fā)展成熟并被落地應(yīng)用;政策領(lǐng)域,監(jiān)管層積極出臺關(guān)于產(chǎn)業(yè)互聯(lián)網(wǎng)、工業(yè)互聯(lián)網(wǎng)等方面的相關(guān)支持性政策,大力扶持相關(guān)產(chǎn)業(yè)的發(fā)展;企業(yè)層面,拉卡拉、三一重工、海爾等不同類型的企業(yè)均開始進行產(chǎn)業(yè)互聯(lián)網(wǎng)、工業(yè)互聯(lián)網(wǎng)等領(lǐng)域的業(yè)務(wù)布局,準備以全新的姿態(tài)迎接新時代的到來。
1)支付在產(chǎn)業(yè)互聯(lián)網(wǎng)時代將逐漸成為商業(yè)社會運行基礎(chǔ)設(shè)施
隨著產(chǎn)業(yè)互聯(lián)網(wǎng)的來臨,數(shù)據(jù)對于各個企業(yè)的生產(chǎn)、經(jīng)營和創(chuàng)新都開始發(fā)揮越來越重要的作用。在這樣的大背景下,支付數(shù)據(jù)覆蓋用戶廣泛、真實有效、數(shù)量龐大的優(yōu)勢開始逐漸體現(xiàn)。支付數(shù)據(jù)和支付機構(gòu)開始在商業(yè)社會的運行過程中發(fā)揮越來越大的價值。支付也逐漸演變成商業(yè)社會運行的基礎(chǔ)設(shè)施。
高速發(fā)展過后,我國的第三方支付行業(yè)迎來了發(fā)展變革的十字路口:一方面,受到監(jiān)管政策趨嚴、成交額基數(shù)增大等原因的影響,第三方支付機構(gòu)傳統(tǒng)支付收單業(yè)務(wù)的增速開始放緩,業(yè)務(wù)的天花板逐漸開始見頂;另一方面,隨著我國數(shù)字經(jīng)濟的發(fā)展和產(chǎn)業(yè)互聯(lián)網(wǎng)時代的到來,越來越多的企業(yè)開始產(chǎn)生一系列金融服務(wù)、營銷、風(fēng)控等方面的增值服務(wù)需求,企業(yè)服務(wù)市場的發(fā)展?jié)摿﹂_始逐漸凸顯。在這樣的背景下,越來越多的支付機構(gòu)開始深挖自身已有數(shù)據(jù)資源的價值,積極利用人工智能、云計算、大數(shù)據(jù)等一系列前沿科技進行企業(yè)服務(wù)業(yè)務(wù)的拓展,開始進行由單一支付服務(wù)商向綜合型產(chǎn)業(yè)服務(wù)商轉(zhuǎn)型的嘗試,積極尋求自身的二次增長。
根據(jù)易觀分析的觀察,目前階段,我國第三方支付機構(gòu)轉(zhuǎn)型綜合型產(chǎn)業(yè)服務(wù)商的路徑主要有兩條:一條是以側(cè)重于B端企業(yè)或機構(gòu)的深度服務(wù),努力為合作的B端企業(yè)或機構(gòu)創(chuàng)造更大的價值;另一種則更加偏向C端消費者的深度運營,通過持續(xù)拓展服務(wù)場景和業(yè)務(wù)邊界來鞏固C端消費者與自身產(chǎn)品之間的關(guān)系,并為C端用戶提供更加豐富的產(chǎn)品服務(wù)。
盡管我國的很多第三方支付機構(gòu)已經(jīng)開始進行轉(zhuǎn)型綜合型產(chǎn)業(yè)服務(wù)商的努力與嘗試,但是其在轉(zhuǎn)型的過程當(dāng)中也不可避免的會面臨來自產(chǎn)品研發(fā)、營銷推廣、外部競爭、市場成熟度不高、數(shù)據(jù)安全等各種各樣潛在的風(fēng)險與挑戰(zhàn)。
2011年至今,央行共計發(fā)放了9批271張支付牌照,但是在2015年3月之后,央行就基本停止了第三方支付牌照的發(fā)放。這也就使得后續(xù)的公司只能通過收并購的方式來獲得相關(guān)的支付資質(zhì)。第三方支付牌照快速成為市面上的稀缺資源。
根據(jù)易觀分析不完全統(tǒng)計,2012年至今,我國境內(nèi)共發(fā)生了近100起支付牌照交易案例,國美、美團、唯品會、小米、滴滴、字節(jié)跳動等眾多企業(yè)均通過收并購的方式獲得了支付業(yè)務(wù)的“入場券”。
易觀分析認為,未持牌企業(yè)積極收購支付牌照主要是出于以下三個方面的考慮:1、確保自己支付收單業(yè)務(wù)的合規(guī)性,規(guī)避潛在的合規(guī)風(fēng)險;2、節(jié)省下對應(yīng)的支付通道服務(wù)費用,獲得對應(yīng)的備付金利息;3、獲得底層的支付數(shù)據(jù),方便企業(yè)構(gòu)建更加詳細的消費者和商家畫像,進行后續(xù)的精細化運營和業(yè)務(wù)拓展。
易觀分析預(yù)測,拼多多、字節(jié)跳動等企業(yè)的先后入場將會再次引發(fā)移動支付機構(gòu)對于C端市場的爭奪;另一方面,更有實力的市場參與者的加入也將對市面上的獨立第三方支付公司產(chǎn)生影響:依舊希望繼續(xù)獨立運營的第三方支付公司在未來將進一步加快自己對于場景和產(chǎn)品服務(wù)的建設(shè),努力構(gòu)建起自身的核心競爭力;而難以構(gòu)建起核心競爭壁壘的第三方支付公司則可能寄希望于其他公司的收并購需求。
隨著我國第三方支付行業(yè)的發(fā)展,我國的持牌第三方支付公司也進入相對成熟的發(fā)展階段,拉卡拉行業(yè)頭部企業(yè)開始逐漸得到資本市場的關(guān)注加碼。在這樣的背景下,我國的持牌第三方支付公司在近幾年開始頻繁的登陸資本市場。
隨著持牌支付機構(gòu)陸續(xù)獲得資本市場認可,同樣位于支付產(chǎn)業(yè)鏈上的非持牌支付產(chǎn)業(yè)服務(wù)商和終端廠商也開始逐漸獲得資本市場關(guān)注,二者與持牌支付機構(gòu)共同推動泛支付行業(yè)逐漸成為資本市場上一個重要的獨立板塊。
除了拉卡拉等已經(jīng)成功上市的泛支付公司外,收錢吧、PingPong等公司在近幾年均獲得高額融資;以銀聯(lián)商務(wù)為代表的幾家持牌支付機構(gòu)也在積極的謀求上市??梢灶A(yù)見的是,泛支付上市公司的陣容在未來將變得越來越大。
對于泛支付板塊中的相關(guān)公司來說,獲得資本市場的青睞將會為公司帶來更加充足的市場關(guān)注度、資金等相關(guān)資源,也可以推動公司的規(guī)范化發(fā)展。隨著頭部公司逐漸得到資本認可,越來越多的泛支付公司在將來也會開始嘗試登陸資本市場,整個泛支付板塊未來在資本市場的影響力和重要性也將不斷的得到提高。
泛支付板塊公司獲得資本市場關(guān)注的積極意義
海外市場前景依然廣闊,支付機構(gòu)積極構(gòu)建全球業(yè)務(wù)版圖。
除了繼續(xù)關(guān)注國內(nèi)市場的發(fā)展外,不少支付公司也已經(jīng)將自己的目光轉(zhuǎn)移到了海外市場。相關(guān)需求方面,隨著留學(xué)、旅游、購物等海外消費的快速發(fā)展,我國居民和商戶對跨境收付款的需求增長明顯;市場想象空間方面,以東南亞市場為代表的移動互聯(lián)網(wǎng)和移動支付依然處于快速發(fā)展階段,整個市場依然有著不小的增量空間;從產(chǎn)業(yè)成熟度的角度來看,我國移動支付的相關(guān)技術(shù)和商業(yè)模式已經(jīng)非常成熟,具備進行海外輸出的能力和條件。
國內(nèi)消費者和商戶跨境收付款需求增長明顯:
東南亞等海外移動支付市場依然有著不小的增量空間:
我國移動支付市場發(fā)展成熟,具備進行海外輸出的能力:
目前階段,我國支付機構(gòu)拓展海外市場有兩種比較主要的業(yè)務(wù)模式:一種是國內(nèi)支付機構(gòu)自己直接進行海外相關(guān)業(yè)務(wù)的展業(yè);另一種更為普遍的則是“出海造船”模式,即通過投資或合作的方式尋找本地的合作伙伴進行技術(shù)、商業(yè)模式的輸出或業(yè)務(wù)的合作推進。
在主要面向的客戶群體方面,在國內(nèi)C端移動支付市場有明顯流量優(yōu)勢的支付企業(yè)在海外可能同樣傾向于C端錢包賬戶體系的打造和消費者支付場景的拓展;而以拉卡拉為代表的其他支付機構(gòu)則把業(yè)務(wù)發(fā)展的重心放在了B端商戶上。
易觀分析認為,對于進行海外購物的消費者來說,支付機構(gòu)紛紛“出海”可以進一步優(yōu)化其跨境支付的體驗,更好的保障自身的資金安全;對我國的跨境貿(mào)易來說,跨境收付款產(chǎn)品服務(wù)的升級可以幫助相關(guān)企業(yè)減少收付款過程中遇到的問題,推動我國整個跨境貿(mào)易的發(fā)展和增長;對于拓展跨境支付業(yè)務(wù)的第三方支付機構(gòu)來說,跨境支付及相關(guān)增值服務(wù)可以幫助支付機構(gòu)尋找到新的業(yè)務(wù)增長點,實現(xiàn)公司的二次發(fā)展。
對消費者:可以讓更多的消費者在海外通過國內(nèi)的支付APP進行付款,進一步提高消費者跨境收付款的效率,優(yōu)化消費者跨境支付的體驗,更好的保障消費者的資金安全。
對我國的跨境貿(mào)易:跨境收付款及相關(guān)增值產(chǎn)品服務(wù)的升級可以幫助相關(guān)企業(yè)減少展業(yè)過程中遇到的問題,提高自身生產(chǎn)經(jīng)營的效率,推動跨境貿(mào)易企業(yè)以及我國整個跨境貿(mào)易行業(yè)的發(fā)展。
對第三方支付機構(gòu)自身:跨境支付及相關(guān)增值服務(wù)更高的利潤水平和更大的想象空間將使其成為支付機構(gòu)下一階段重要的業(yè)務(wù)增長引擎,幫助支付機構(gòu)優(yōu)化自身收入結(jié)構(gòu),實現(xiàn)營收和利潤的良性增長。
盡管“出?!痹诮鼉赡瓿蔀橹Ц缎袠I(yè)的熱門話題,但是支付機構(gòu)在境內(nèi)境外跨境支付業(yè)務(wù)拓展的過程中依舊可能面臨來自多方面的挑戰(zhàn)。境外業(yè)務(wù)拓展方面,海外市場的監(jiān)管政策、宏觀環(huán)境、用戶偏好、業(yè)務(wù)合作模式和國內(nèi)可能都存在著巨大的差異,這些外部因素的變化很可能使得國內(nèi)支付機構(gòu)之前積累的很多經(jīng)驗并不能發(fā)揮足夠的效用;相關(guān)人才的不足也對支付機構(gòu)的業(yè)務(wù)拓展造成了一定的影響。境內(nèi)業(yè)務(wù)拓展方面,相比較于傳統(tǒng)的境內(nèi)支付業(yè)務(wù),支付機構(gòu)對于跨境商戶的相關(guān)資質(zhì)審核、交易真實性的驗證和可疑交易篩查的難度也都會更大。
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
今年受到新冠疫情的影響,線上電子商務(wù)行業(yè)飛速發(fā)展。直播帶貨、社區(qū)團購等成為新的風(fēng)口,未來它們還能這么火嗎?本文作者從自身工作經(jīng)驗出發(fā),對2021年中國電商市場的趨勢進行預(yù)測,與你分享。
2020年受新冠疫情影響,線上電子商務(wù)行業(yè)飛速發(fā)展。社區(qū)團購,C2M趨勢越來越明顯,因此預(yù)計2021年將是中國電子商務(wù)市場充滿創(chuàng)新和擴展的一年。各商家將采用新的舉措和技術(shù),并希望將業(yè)務(wù)擴展到低端城市。以下是2021年中國電子商務(wù)市場的10大趨勢預(yù)測。
因此:2021年將是中國電子商務(wù)市場創(chuàng)新與擴展的一年。
實時流媒體在2020年對消費者的購物行為產(chǎn)生了更大的影響,并將在2021年繼續(xù)在中國電子商務(wù)市場中發(fā)揮越來越重要的作用。這種銷售媒介類似于電視購物(例如QVC),但在21世紀得到了升級。
直播會話的視頻內(nèi)容實時廣播,觀眾可以通過在線鏈接在觀看視頻的同時購買商品。就像QVC上的導(dǎo)購一樣,實時流媒體主持人出售各種各樣的產(chǎn)品,從服裝和化妝品到電子產(chǎn)品和汽車。
購物者被直播吸引的原因有幾個:
通過這些策略,直播主持人能夠吸引大量的購物者。例如,在2019年雙十一,李佳琦直播了六個多小時,吸引了3680萬觀眾。
在2019年雙十一期間,超過100,000個品牌使用在線直播作為銷售方式。在購物狂歡節(jié)的第一個小時內(nèi),在線直播產(chǎn)生的商品總銷量(GMV)超過了去年在線直播的全日總成交量??傮w而言,2019年11月11日,GMV達到200億日元(28.5億美元),約占阿里巴巴2684億日元總銷售額的7.5%。
關(guān)鍵意見消費者(KOC)是通過視頻制作和帖子發(fā)布以分享自己產(chǎn)品使用體驗感的普通消費者。這種新興趨勢將為品牌商和零售商提供一種新的傳播途徑,使他們采用有影響力的營銷方式,而不是使用KOL。由于包括快手、小紅書和抖音在內(nèi)的一些中國社交應(yīng)用程序的普及,KOC可以輕松共享其產(chǎn)品評論,從而影響其他購物者的購買決定。
KOC越來越受歡迎的原因之一是:消費者越來越意識到KOL是由品牌贊助來提出產(chǎn)品建議的人,因此他們認為提供的信息不那么可信和真實。另一方面,KOC本身就是日常消費者,他們更能提供公正的產(chǎn)品評論。
KOC越來越受歡迎的部分原因是購物者希望從日常消費者那里尋求建議。例如,新父母在選擇母嬰產(chǎn)品時會尋求他們的朋友和其他有經(jīng)驗的父母的建議。通過的社交應(yīng)用,這些購物者現(xiàn)在可以在做出購買決定之前,觀看經(jīng)驗豐富的KOC的視頻和評論。
實際上,KOC營銷是「完美日記」營銷計劃的關(guān)鍵組成部分之一,該計劃已使其成為中國化妝品品牌之一。在公司成立之初,該品牌就開始與KOC進行大規(guī)模合作,這使普通消費者覺得該品牌非常受歡迎。
短視頻應(yīng)用程序已涉足電子商務(wù)市場,我們預(yù)計這一趨勢將在2021年繼續(xù)。短視頻的長度通常為10–20秒,富含了各種各樣的內(nèi)容。據(jù)報道,一些用戶在短視頻應(yīng)用上日平均花費數(shù)小時。借助人工智能技術(shù)和算法,鼓勵用戶根據(jù)瀏覽歷史和喜好定制個性化內(nèi)容,更大提高了用戶對短視頻的擁護。
短視頻行業(yè)在中國蓬勃發(fā)展,截至2019年,中國的用戶數(shù)量超過8.2億。據(jù)商業(yè)智能提供商QuestMobile稱,這一總數(shù)同比增長了32%。在中國10個移動互聯(lián)網(wǎng)用戶中,平均有7.2個使用了快手和抖音等短視頻應(yīng)用程序。根據(jù)QuestMobile的數(shù)據(jù),自2018年以來,用戶在這些平臺上花費的時間同比增長了8.6%,總計每月超過22個小時。
為了利用這些統(tǒng)計數(shù)據(jù)和消費者行為模式,短視頻應(yīng)用程序已采取步驟以通過其用戶流量獲利:
到2021年,電商平臺將大力發(fā)展社區(qū)團購,如果消費者大量購買,團購將以大大降低的價格提供產(chǎn)品和服務(wù)。這種購物模式對預(yù)算有限的購物者特別是二、三線城市的購物者具有吸引力。
這些用戶在雙十一購物狂歡節(jié)中提供了巨大的消費能力:聚劃算報告稱,有576種產(chǎn)品在前兩個小時內(nèi)收到了超過1000萬張訂單;京東表示,其40%的新客戶來自靖西。而拼多多在11月11日的前16分鐘內(nèi)售出了1000多輛汽車。
對品牌的影響:團購模式將以較低的價格提供給想要擴展到中國低端城市的品牌。這些地區(qū)的消費者往往對價格更為敏感,并且可能會尋找便宜貨。團購還為零售商提供了清理庫存的好機會。
小程序可在支付寶,美團和微信等應(yīng)用程序中運行。他們?yōu)槠放铺峁┝艘粋€額外的在線平臺來銷售其產(chǎn)品,用戶無需下載單獨的應(yīng)用程序即可執(zhí)行類似的功能。
品牌可以使用小程序作為大型電子商務(wù)平臺的補充,而不是替代。小程序用作輔助銷售渠道,可以列出通過快速促銷快速銷售的需求商品。小程序也可以用作品牌工具——品牌可以創(chuàng)建交互式的視覺程序,以更好地吸引客戶并鼓勵他們與朋友分享內(nèi)容。微信小程序現(xiàn)在支持增強現(xiàn)實(AR),它將虛擬圖像疊加到物理世界上。這種類型的第一個是阿瑪尼的化妝品小程序,該程序允許用戶通過用戶在手機上使用的自帶攝像頭來測試不同化妝品的外觀,例如各種色調(diào)的唇膏。
資料來源:阿瑪尼的微信小程序
小程序為希望打入低端市場的品牌提供了優(yōu)勢,購物者可能不愿下載新的應(yīng)用程序。品牌可以將小程序與團購結(jié)合起來,以訪問較低線城市的微信用戶。
對品牌的影響:由于小程序的容量很輕,因此品牌在此投資進行營銷,客戶參與和電子商務(wù)是一件好事。微信小程序的創(chuàng)造者微信報告說,截至2019年,它已擁有7億用戶,他們每月使用微信小程序42.6次。
我們預(yù)計到2021年,物流提供商將通過升級物流基礎(chǔ)設(shè)施和增加保稅倉庫的產(chǎn)能來提供更快的交貨速度。這樣就可以為更多產(chǎn)品提供當(dāng)天交貨。阿里巴巴的菜鳥計劃旨在通過幫助物流公司大規(guī)模部署物聯(lián)網(wǎng)(IoT)解決方案來數(shù)字化并加速整個交付過程。菜鳥計劃在2020年至2022年之間將1億臺智能設(shè)備連接到其IoT技術(shù),包括其倉庫,交付機器人和算法支持的管理系統(tǒng)。
菜鳥還將通過最后一公里送貨業(yè)務(wù)“菜鳥郵局”建立10萬個中轉(zhuǎn)站,以增加送貨選擇。菜鳥郵局提供定期送貨,智能儲物柜和送貨上門取件等服務(wù)。
通過采用5G技術(shù),物流提供商將能夠提供更,更快的交付。京東物流于2019年北京開設(shè)了首個由5G供電的智能物流園區(qū),并使用一代的連接性對叉車的位置和路線進行實時監(jiān)控,并提供異常預(yù)警情況。
對品牌的影響:新技術(shù)將推動中國交付的進一步加速。品牌和零售商可以利用諸如智能路由之類的工具,該工具使用機器學(xué)習(xí)算法來優(yōu)化交付路線,從而提高交付效率。
中國的消費者對制造商(C2M)模式將成為電子商務(wù)發(fā)展的新動力,幫助企業(yè)更好地滿足消費者的需求并實現(xiàn)銷售增長。
在C2M模式中,工廠變得以消費者為中心。零售商和制造商從客戶那里收集數(shù)據(jù),并使用大數(shù)據(jù)創(chuàng)建客戶資料,分析消費特征并計劃生產(chǎn)。這有助于制造商預(yù)測產(chǎn)品需求并減少庫存和供應(yīng)鏈風(fēng)險,這也使品牌商和零售商受益。
在2019年的光棍節(jié)購物節(jié)期間,天貓用戶搶購了1.70億個C2M產(chǎn)品。一家公司報告說,電動牙刷的銷量在11月11日達到了25,000。羅曼利用天貓的消費者見識來影響牙刷的設(shè)計,例如牙刷頭的尺寸和牙刷的顏色等。
C2M模型還與中國對產(chǎn)品個性化需求的增長相吻合,中國由80年代后的消費者(1980-1989年出生的人)和90年代后的消費者(1990-1999年出生的人)主導(dǎo)。C2M模式將允許制造商和零售商根據(jù)消費者的需求生產(chǎn)產(chǎn)品。
品牌影響:根據(jù)中國研究公司艾瑞咨詢的數(shù)據(jù),中國的C2M市場在2018年達到175億日元(25億美元),預(yù)計到2022年將達到420億日元(60億美元),復(fù)合年增長率為24.4%。據(jù)Statista估計,這相當(dāng)于2018年中國電子商務(wù)總銷售額的0.4%和2022年中國電子商務(wù)總銷售額的0.6%。品牌可以使用C2M模型更好地滿足消費者需求,并提高整個供應(yīng)鏈的效率。
垂直市場是電子商務(wù)平臺,在該平臺上,商品和服務(wù)被出售給特定的客戶群,他們可以通過在線社區(qū)相互聯(lián)系。我們預(yù)計此類網(wǎng)站將在2021年蓬勃發(fā)展。Babytree(專注于母嬰產(chǎn)品)和Gegejia(面向女性市場的全球食品進口商)等網(wǎng)站和應(yīng)用都是成功的垂直市場的例子。
對品牌的影響:隨著消費者對其購買選擇的了解越來越復(fù)雜,我們希望垂直的電商站點能夠吸引人們的注意力,不僅提供產(chǎn)品知識,而且還提供志趣相投的客戶可以進行交互的社區(qū)。品牌可以與這些平臺一起有效地將其產(chǎn)品定位到適當(dāng)?shù)南M者基礎(chǔ)。
我們預(yù)計跨境電商的格局將在2020年得到鞏固。阿里巴巴于2019年9月收購了中國當(dāng)時最大的跨境電商平臺考拉,并將其整合到天貓。然后,阿里巴巴將占中國跨境電商市場的50%以上:根據(jù)研究公司iMedia Research的數(shù)據(jù),網(wǎng)易考拉在2019年上半年占據(jù)了27.7%的市場份額,而阿里巴巴的天貓全球市場則占據(jù)了25.1%的份額。
這項收購將增加阿里巴巴接觸需要跨境購買商品的中國購物者的機會。這也將幫助該公司實現(xiàn)天貓的商業(yè)模式多樣化,該模式主要涉及邀請外國品牌在其網(wǎng)站上開設(shè)在線商店——考拉通常直接從外國商人那里大量購買各種商品,然后再轉(zhuǎn)售給中國消費者。首席執(zhí)行官Daniel Zhang表示,阿里巴巴對考拉的收購將通過阿里巴巴整個生態(tài)系統(tǒng)的協(xié)同效應(yīng),進一步提升該公司為中國消費者提供的進口服務(wù)和體驗。
實時流媒體將在2021年的電子商務(wù)中扮演更重要的角色,因為它使品牌和零售商可以實時向消費者推銷產(chǎn)品,并為消費者提供限時折扣的優(yōu)勢。
電商的格局將變得更加多樣化,短視頻平臺和小程序?qū)⒊掷m(xù)開展直播帶貨,為零售商提供諸如AR之類的技術(shù),以進一步與潛在客戶互動。電商大廠將繼續(xù)投資,以擴大產(chǎn)品范圍,例如阿里巴巴收購中國跨境電子商務(wù)平臺考拉,并利用技術(shù)為消費者提供更無縫的購物體驗(例如,使用5G連接簡化交付流程)。
基于關(guān)系的營銷方法將在2021年激增:垂直市場為購物社區(qū)提供參與機會。團購將以相對較低的成本提供產(chǎn)品,從而成為零售商吸引來自中國二線城市消費者的一種有效方法。
藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
藍藍設(shè)計的小編 http://www.yvirxh.cn