首頁

UI設計師在項目各階段該做些什么?

ui設計分享達人


如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

文章從項目流程的各階段來講解UI設計師應該做些什么,如何做才能把自己的價值在項目中體現(xiàn)出最大化!

講解對象:處于中小型公司項目的UI設計師(目前現(xiàn)狀:相比起大廠的設計師來言缺乏流程和規(guī)范,也不懂系統(tǒng)的工作方法,容易陷入無人帶+無人指導+無標準流程的尷尬境地,不知道如何在項目中體現(xiàn)出自己更大的價值,設計也沒有自己的一套可支撐的體系,在項目實施過程中永遠處于被動方)


注明:此次只分享一些大的方向,并不會具體講解哪一塊如何去實行,在一些重要的部分會稍微提一下,因為涉及的內容太多所以只能以后分塊面來分享給大家。


OK,廢話不多說,進入正題:

首先梳理了一個簡化版的中小型公司項目流程與角色分工表(表格注明:一般中小型公司是沒有交互設計師與用研的,交互設計的活兒都是交給產品經理來做,所以交互設計角色我把它歸為產品經理;視覺設計會在后面重點強調所以簡化說明;開發(fā)測試這一塊與我講解的內容關聯(lián)不大所以也給簡化說明了,但是在開發(fā)測試階段會有更重要的任務讓我們設計師去做,后面我會詳細講解)。

從上圖中可以看出UI設計在項目中主要就是進行視覺設計這一塊,但真的是這樣嗎?其實并不是,一位出色的UI設計師在項目的各個階段都應該體現(xiàn)出自己的價值,特別是對于中小型公司,公司想要的是如何生存下去,就更需要團隊里的每一個人在產品中創(chuàng)造更多的價值,而不是像流水線工人一樣做完自己的事就什么都不管了,這樣的團隊是活不下去的,正因為這樣,這也是我們設計師證明自己價值的一個機會,那么我們在項目各階段該做些什么呢?


一:產品立項+交互設計階段

因為主要講解中小型公司,所以我把產品立項與交互設計放在一個階段來講,雖然這一階段沒有任何視覺可視化設計,但要體現(xiàn)設計師的價值這一階段就是重要前提,那么我們怎么做呢?


1.查看迭代的產品文檔,實時了解產品信息(一般中小型公司的產品立項已經成立,直接開始進入交互設計階段)

目的:設計前提就是了解產品,這一點是最基本的。

延展:有助于后面協(xié)助UE“部分內容”的分析。

重點:著重了解這三大塊:1.市場調研與客戶需求分析。2.需求文檔。3.產品特性概覽及概要描述。


2.主動協(xié)助產品完成UE的“部分內容”,“部分內容”包含:市場分析/用戶畫像/痛點/競品分析/使用場景(因為中小型公司的項目都比較趕,有些產品經理做UE這塊內容的時候可能沒考慮太多細節(jié),有些內容沒有去做,所以這時就可以協(xié)助產品主動去完成這些分析文檔)

目的:有利于做視覺分析時提供更好的思路與決策,減少走彎路,減少不必要的溝通成本。

延展:對產品信息進行文字提煉,做一個有利于視覺團隊理解的表格文檔,方便做視覺稿時能直觀的看到產品分析,也為了后期有UI新成員加入時更快的熟悉產品提供必要的文檔。(表格沒必要做的多好,簡單直觀才是最重要,后期再根據(jù)視覺風格統(tǒng)一優(yōu)化)

表格示例:

重點:協(xié)助UE內容重點不在于幫助產品經理更細化的分析產品,重點是在此過程中能更好的拓展自己的知識面,提升自我的分析能力,為后期的視覺稿提供更好的理論支撐,以及對自己的崗位轉型也具有很大幫助。


3.輸出關于設計的競品分析文檔(協(xié)助完成UE內容后)

目的:作為視覺規(guī)范/界面視覺的參考,讓自己的設計更具有說服力。

延展:如果有足夠多的時間可以細化更多內容,進行對比分析,以便于后面做視覺稿時能快速進行布局決策。

重點:可以形成一套屬于自己的競品分析文檔,以后可以套用到其他項目中,我個人的設計競品分析文檔是從4個層面/3種表現(xiàn)形式來進行分析的。4個層面為:表現(xiàn)層/框架層/結構層/范圍層;3種表現(xiàn)形式為:分析列表;思維導圖;圖文結合。

給大家舉三個不同形式的例子:

01-表現(xiàn)層+分析列表形式:

02-結構層+思維導圖形式:

03-范圍層+圖文結合形式:

二:視覺設計階段

這一階段是設計師最熟悉的,也是很多設計師所痛心的,流程混亂會導致你做很多無用功,沒有合理規(guī)范以至于進度提不上來,設計出的界面卻說不出任何依據(jù),也許我的一個設計思路能解決你們的難題。


第一步:根據(jù)產品文檔與設計競品分析文檔確定視覺風格,根據(jù)視覺風格做出視覺概念稿(建議3版),確定好視覺概念稿后主視覺設計師針對主要功能界面設計風格定位稿。(設計風格定位稿必須要結合競品分析文檔來做,讓自己的每一塊設計區(qū)域都有據(jù)可循)


第二步:當出了定位稿后,就可以制定設計的周期節(jié)點(注:也可以制定周期后再確定風格定位稿,把定位稿歸位節(jié)點內)


第三步:制定文件命名規(guī)范;確定設計規(guī)范(迭代);建立組件庫(迭代)

1.文件命名規(guī)范:為了提高內部交接效率,盡量使文檔的命名與層級統(tǒng)一

示例:

2.確定設計規(guī)范:設計規(guī)范并不是一步就能做好的,項目前做基本的設計規(guī)范,項目中進行迭代,項目結束后再進行總結輸出最終檔。

那么我們現(xiàn)在要做的就是項目前的基本設計規(guī)范,前期建議這些規(guī)范是必須要的:統(tǒng)一設計環(huán)境/字體/行高/界面柵格/顏色/icon制作規(guī)范/輸出規(guī)范/最小基礎間距/按鈕。(規(guī)范沒必要一次性就想做的非常完美,在設計中都是要不斷迭代的)

3.建立組件庫:組件庫是通過對功能及視覺表達中元素的拆解、歸納、重組;并基于可被復用的目的,形成規(guī)范化的組件,通過多維度組合來構建整個設計方案,將這些組件整理在一起,便形成組件庫。簡單來說就是可復用/節(jié)省產出時間/視覺統(tǒng)一,加快我們的設計步伐,讓我們把更多時間用于專注于用戶體驗和對產品的創(chuàng)新。(注:組件庫也是需要不斷的迭代的,在項目完成后可以把組件庫歸位設計規(guī)范文檔里面)


第四步:規(guī)范設計流程

根據(jù)每個項目不同/每個公司不同設計流程都有些不同變化,規(guī)范設計流程包含這三塊:設計組交付流程;產品交付流程;前端交付流程。

目的:直接減少了因時間有限導致的設計誤差及衍生的研發(fā)返工,為項目的高質量交付奠定了基礎。


第五步:視覺稿設計+視覺稿交付

視覺稿設計:設計視覺稿是為了讓自己的視覺稿有據(jù)可行,需要結合產品文檔/競品分析文檔/設計理論這三大塊來作為依據(jù)參考進行設計。

視覺稿交付:與開發(fā)商討出最佳交付方案,統(tǒng)一輸出規(guī)范。


三:開發(fā)測試階段

這一階段屬于設計的一個空檔期,很多設計師在這一階段都開始了休閑時光,只是做一些查缺補漏的工作,其實這一階段對于設計師來言是一個體現(xiàn)自我價值的重要階段,那么我們應該怎么做呢?


1.與前端工程師經常溝通,查查看寫出的界面是否有偏差(因為有些情況下程序寫出來的界面與你所做的界面有偏差,如果不經常溝通,那么他在做同樣組件時也會犯同樣錯誤,有問題及時糾正,免得來來回回耽誤工作進度)


2.重點:總結輸出設計文檔(定稿設計規(guī)范/定稿競品分析文檔)

①定稿設計規(guī)范第一版:包含設計過程中所有迭代的規(guī)范內容以及組件庫

作用:對于設計師而言是展現(xiàn)業(yè)務能力的體現(xiàn),對于整個團隊而言是提升生產效率的重要工具。

②定稿競品分析文檔(設計類)第一版:把項目中所有的競品分析文檔歸類,以及因時間問題某些板塊未做的競品分析加入迭代,綜合輸出最終檔。

作用:簡單來說就是更快為設計提供具有可行性/有依據(jù)性的視覺稿。


四:上線階段

作為最激動人心的階段,為了避免上線后不必要的錯誤以及產品后期的迭代考慮,還是有許多工作需要做的。

1.交付物走查(排查交付給開發(fā)的文件,查看是否有圖標/界面/提示信息等的遺漏)

2.驗收工作(界面是否與高保真原型圖保持一致,圖片是否正常顯示,打開界面速度是否正常,動效是否達到預期等)

3.后續(xù)延伸(因項目時間原因UI樣式/交互/情感化設計還沒做到更細致,可提上日程留至于下期改版。

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


設計精致的UI界面-排版篇

ui設計分享達人

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

前言



從本周開始,接下來時間里,會和大家分享如何創(chuàng)建精致的UI界面,共五部曲,為什么要做這個分享?曾經我學習UI設計時,網(wǎng)上資料很多,但是參差不齊,對于新人而言,這是很痛苦的,進步慢。因此我想通過之前踩過一些坑,集合自己的工作經驗,把一些知識點分享出來。

分享的最終目的是沉淀自己,同時也希望能給有想要提升排版能力的設計師帶來一些幫助與啟發(fā)!所以本系列文章并不一定適合所有人。

那么本周就先從排版篇幅開啟….




為什么要學習排版



排版是界面設計中最難的部分,也是非常重要的一部分,它以各種形式存在界面中,純文本排版,圖形文排版,圖片文本排版等等,這是我們在做設計時候,經常會面臨的問題,好的排版能有效地向用戶傳遞關鍵的信息,同時也能提升產品使用體驗。在我們日常生活中,離不開設計排版,包括經常見到的各種廣告與電影宣傳海報,如果不能讓用戶在短時間內記住關鍵信息,這個設計就是失敗的。因此我希望通過今天這篇文章,能夠讓你對排版有一些新的認識。




提升設計排版有哪些方法



在界面設計中,影響排版設計的因素有很多,我總結歸納了7個維度(當然還有其他更細的,在這里就先暫時不講),它直接影響整個排版質量,這些方法當然不是絕對,但是如果能巧妙綜合得運用到界面中,能保證大部分界面設計感得以提升,當然也是需要不斷刻意練習來提高的。


分別是:

  1. 合理運用空間的力量

  2. 大小的力量

  3. 論顏色的重要性

  4. 對齊的力量

  5. 平衡定律

  6. 選擇好的字體

  7. 清晰了解設計目標


下面我會集合一些案例來和大家講解下





合理運用空間的力量



空間即我們常說的留白,當設計元素緊緊地聚集在一起時,界面看起來沒有重點,因此需要和諧的運用它,空間的運用規(guī)則直接影響產品的性格,小空間和大空間在視覺感受上,兩者完全不同,那么我們在界面設計中如何去更好的運用空間來設計排版。

有一個很好的方法就是可以運用網(wǎng)格去搭建空間,在平面設計中,運用得非常多,那么在用戶界面中,同樣也可以運用網(wǎng)格去搭建,下面看一個案例





如上圖作者把一個界面分為4Gird,通過搭建好的網(wǎng)格來進行界面中元素排版,右側是我拆解的圖(備注:網(wǎng)格的搭建并沒有任何強制性的規(guī)定需要搭建多少列,最終的搭建列數(shù)需要根據(jù)這個產品內容復雜程度去定義的)比如我最近在做車載HMI設計語言,同樣也運用了網(wǎng)格,那么我會根據(jù)整個車載HMI產品復雜程度去搭建,同時也運用了幾種網(wǎng)格配合使用。




上面兩個例子我們可以發(fā)現(xiàn) 設計師運用了大空間來設計界面,這使得整個界面呼吸感更強,更透氣,因為也是娛樂類偏雜文產品,所以設計會偏藝術化一些。



韓國29cm產品是我比較喜歡的一個app,整體設計呼吸感很強,留白空間大,視覺焦點清晰





大小的力量


我們都知道大的物體更吸引眼球,更容易引起我們的注意,那么在設計中,我們一般都會將重要元素放大,突出顯示,


a和b那個更吸引你?答案是a.  因為a類型排版看起來很大,更具有吸引力





上面案例中算是大小方法上運用比較好的,我們可以看出視覺層次非常清晰了 ,首先我能快速知道哪些重要信息,肯定是封面圖,接著左上角logo,然后就是導航和標題了,最后就是針對每個內容塊的一些詳細文案解釋。




簡單示例,重要的信息一定要大,次級信息弱化。






論顏色的重要性



顏色在排版設計中起著很大的作用,能起到點睛之筆,又或者為畫面帶來活力,又或者代表著品牌,當然我們在UI界面中字體顏色一定要慎用,因為不同顏色含義是不同的。合理恰當運用顏色, 能夠瞬間提升設計品質感。




上面這個web設計中,設計師通過紅色來強調重要信息,同時也讓灰白的畫面有了些許不同之處。




對某些文本使用輔助顏色,例如鏈接文本,圖1 使用方式正確。圖2將顏色大量使用在正文,嚴重影響視覺體驗




上面兩圖都在恰當時候使用顏色,比如打開開關按鈕,又或者輸入文本高亮顯示等,右側只有在選擇文本階段,使用顏色提示




避免像圖2那樣使用對比度低的顏色



少量顏色能提升界面品質感,在關鍵的地方使用品牌顏色或者輔助色其他通過我們前面講的大小對比和空間來完成整體界面設計





對齊的力量



對齊是界面設計中我們經常提到話題,也是提升界面品質感最重要的一個隱形的力量,也許有時候我們會忽略他,有時候會不經意間就沒做好。




對齊的界面比不對齊的要整齊很多,視覺流也符合用戶閱讀習慣




我們可以借用前面所學的網(wǎng)格來對齊,這樣不僅設計有節(jié)奏感, 同時畫面很整齊美觀




我們界面設計中可以有三種思路對齊方式,當然根據(jù)業(yè)務板塊去選擇合適的對齊方式,三種對齊方式都有一個隱形的軸(看我標的線),然后圍繞這個去排版設計,自然形成一個規(guī)則的視覺流




上面案例中作者整體偏左對齊,這樣形成以左為中心一個軸展開視覺流走向





平衡定律



我們在做界面設計時候,會經常遇到有人說你的設計,要么是這邊太重了,要么就是太輕了,或者這邊要不加點東西進去,不然太空了,為什么?這就是平衡定律,如果同一個環(huán)境下的物體沒有保持平衡關系,我們視覺感受上是很不舒服的。下面我們看幾個例子


圖1和圖2 我們可以看出; 圖2 給人第一感受就是不平衡的,整體視覺重心偏左了 




上圖案例,設計師通過按鈕來平衡整個畫面視覺重心,因為左側內容多,如果按鈕很弱或者很小,是很難平衡畫面的,因此我們做界面時候,定義一些按鈕大小也是非??季康?




左邊視覺界面,右邊拆解原型出來,我們可以看到設計師也是通過元素合理分布使得界面整體平衡






選擇好的字體  



字體選擇對界面排版非常至關重要,這也是所有界面排版中必要的一步,不同字體有不同的性格屬性,我們需要根據(jù)產品來選擇恰當?shù)闹杏⑽淖煮w,同時,也需要記住,一個產品APP界面設計中,字體最好不要超過兩種

推薦一些我認為2019比較好用的英文字體,大家做概念設計時候或者提案方案包裝時候是可以用到的哦(吐血推薦)


字體:Montserrat       字體:Nexa 



字體:Futura         字體:Playfair_Display 


中文好用的字體,大家應該都知道,平方字體,思源黑體,漢儀旗黑,蘭亭纖黑,我就不做示例了。






清晰了解設計目標



終于到最后一趴了,最后這點是整個設計排版的核心之一,為什么?如果不清晰設計目標,那么整個排版風格也許最后產出和你用戶群體或者產品性格是兩種類型的,不同產品風格會有不同的排版style

比如我們產品是品,那么整體排版設計風格一定是使用大網(wǎng)格,大空間去設計,字體纖細等。如果是簡約現(xiàn)代呢?又或者母嬰產品,科技產品,娛樂產品等等,每個會有一些特殊排版思路。所以了解你的設計目標,并確定設計原則。

有了這些原則與目標,那么接下來就是開始找參考,找靈感找到對應產品他們是如何排版,如何控制畫面節(jié)奏感的,推薦多去使用pinterest或者behance






總結


通過七大點排版思路,可以更好的運用在界面設計中,每個排版原則并不是獨立的個體,他們之間是相輔相成的關系,比如大小離不開網(wǎng)格,也離不開對比,顏色等等,缺乏某些元素,那么界面就會缺失靈魂,設計產出質量并不好!好了本期到這里結束,下期會繼續(xù)和大家分享如何巧妙運用圖形提高界面品質感和增強細節(jié)!


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

未來的情感化界面設計

資深UI設計者

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

情感化在我們的決策過程中起著至關重要的作用。一秒鐘的情感交互可以改變人對產品的整體體驗


人類是一種情緒驅動的物種;我們選擇某些產品并不是因為它們有意義,而是我們認為它們會給我們帶來什么樣的感受。未來的界面將在產品設計的基礎上使用情感化的概念。人們使用的經驗將基于智商(IQ)和情商(EQ)。


本文試圖展望未來,看看我們將在未來的十年內設計什么樣的界面。我們將仔細研究三種交互媒介:


01、語音

02、增強現(xiàn)實(AR)

03、虛擬現(xiàn)實(VR)



未來情感化界面的實例

將來的界面會是什么樣子?盡管我們還沒有這個問題的答案,但是我們可以討論界面可能具有的特性。在我看來,我相信我們最終會遠離那些充滿菜單、面板、按鈕的界面,而轉向更“自然的界面”,即擴展我們身體的界面。未來的界面不會鎖定在物理屏幕上,而是使用整個五官感覺的力量。

因此,他們需要的學習成本更少——理想情況下,根本沒有學習成本。


情商在商業(yè)中的重要性

除了讓體驗更加自然和減少學習成本外,情感化設計還為產品創(chuàng)造者帶來了另一個好處:它提高了用戶對產品的使用率。合理的利用人類對情感的行動能力來創(chuàng)造更好的用戶參與度。



體會真實的語音界面

現(xiàn)在,以語音為主要界面的產品越來越受歡迎。我們當中的許多人在使用亞馬遜Echo和蘋果Siri進行日?;顒?,如設置鬧鐘或預約等。但目前市場上的大多數(shù)語音交互系統(tǒng)仍有一個與生俱來的限制:他們沒有考慮用戶的感受,因此,當用戶現(xiàn)在與谷歌這樣的產品交互時,他們會有很強的與機器交流的意識,并非是真正的人類。系統(tǒng)可預測地響應,并編寫響應腳本。與這樣一個系統(tǒng)進行有意義的對話是不可能的。


但是如今市場上有一些完全不同的系統(tǒng)。其中一個是社交聊天機器人應用程序Xiaoice。這個應用程序的核心是一個情感計算框架;這個應用程序是建立在這樣一個理念之上的,即首先要與用戶建立情感聯(lián)系。Xiaoice能夠動態(tài)地識別情緒,并通過長時間的對話和相關的回應吸引用戶。因此,當用戶與Xiaoice互動時,他們會覺得自己在和一個真正的人交談。


許多人在電影《她》(2013)中看到了基于語音的互動影響力。Theodore ( Joaquin Phoenix 主要角色) 愛上了一個 Samantha (一個復雜的操作系統(tǒng))。這也使我們相信,未來基于語音的交互系統(tǒng),主要目的之一將是為用戶提供虛擬伴侶。這部電影最有趣的是 Theodore 沒有 Samantha 的視覺形象——他只有她的聲音。要建立這種親密關系,就必須產生反映一致個性的回應。這將使系統(tǒng)具有可預測性和可信賴性。


雖然技術離Samantha這樣的操作系統(tǒng)還很遙遠,但我相信語音優(yōu)先的多模式界面將是語音支持界面發(fā)展的下一篇章。這些界面將使用語音作為主要的交互方式,并在創(chuàng)建和構建連接感的上下文中提供附加信息。


Image title

為Brain.ai設計的語音界面示例(圖片來源:Gleb Kuznetsov)



AR體驗的演變

增強現(xiàn)實(AR)被定義為現(xiàn)實世界之上的數(shù)字覆蓋,并將我們周圍的物體轉化為交互式數(shù)字體驗。我們的環(huán)境變得更加“智能化”,用戶的手指尖上會出現(xiàn)“有形”物體的錯覺,這樣就在用戶和產品(或內容)之間建立了更深層次的聯(lián)系。


使用AR重新定義現(xiàn)有概念

AR的獨特之處在于它為我們提供了與數(shù)字內容進行物理交互的非凡能力。它可以幫助我們看到以前無法看到的東西,這有助于我們了解更多關于周圍環(huán)境的信息。AR屬性有利于幫助設計人員使用熟悉的理念創(chuàng)造新的的層次體驗。


例如,通過使用移動AR,可以打造一個新的飛行體驗感受,允許乘客查看有關其它班機或當前航班飛行進度的詳細信息:


Image title

AR在空中客車A380的飛行體驗中。(圖片來源:Gleb Kuznetsov)


AR幫助我們在空間中找到自己的路,并讓我們一目了然地獲得所需的信息。例如,AR可用于為當前位置創(chuàng)建豐富的上下文提示。被稱為SLAM(同步定位和映射)的技術非常適合這種場景。SLAM允許對環(huán)境進行實時映射,還可以將多媒體內容放入環(huán)境中。


為用戶提供價值的機會有很多。例如,用戶可以將他們的設備指向建筑,并在屏幕上了解更多關于這個建筑的信息。它能夠顯著的減少工作量,并通過允許導航和訪問實現(xiàn)輕松的情感體驗。


Image title

在上下文中提供其他信息(圖片來源:Gleb Kuznetsov)


我們周圍的環(huán)境(如墻壁或地板)可以變成一個可交互的場景,這種方式在過去僅限于我們的智能手機和電腦。


你在下面看到的概念設計就是這樣的;它使用物理對象(白墻)作為通常使用數(shù)字設備傳送的內容的畫布:

Image title

交互式墻的概念 - 在現(xiàn)實世界之上的數(shù)字覆蓋。(圖片來源:Gleb Kuznetsov)


避免信息過載

許多人都看過一個叫做“超現(xiàn)實”的視頻。在這段視頻中,物理世界和數(shù)字世界已經融合,用戶被大量信息所淹沒。技術允許我們同時顯示幾個不同的對象。如果使用不當,很容易造成過載。信息過載是一個嚴重的問題,它會對用戶體驗產生負面影響,避免信息過載將是AR設計的目標之一。精心設計的應用程序將會過濾掉那些與使用人工智能的用戶不相關的內容。


高級個性化

當系統(tǒng)實時地根據(jù)用戶的需求和期望來調整內容或功能時,就會發(fā)生數(shù)字體驗的個性化?,F(xiàn)在許多移動應用和網(wǎng)站使用個性化的概念來提供相關內容。例如,當你訪問Netflix時,你看到的電影列表會根據(jù)你的興趣進行個性化設置。


AR眼鏡允許創(chuàng)造一種新的個性化水平,即“高級”的個性化水平。由于系統(tǒng)“看到”了用戶看到的內容,因此可以利用這些信息提出相關建議或在上下文中提供其他信息。試想一下,你很快就會戴上AR眼鏡,傳輸?shù)揭暰W(wǎng)膜的信息將根據(jù)你的需要進行調整。


從增強現(xiàn)實走向虛擬現(xiàn)實,創(chuàng)造沉浸式體驗

AR體驗具有自然的局限性。作為用戶,我們在內容和內容之間有明確的界限; 這條線將一個世界(AR)與另一個世界(現(xiàn)實世界)分開。這條線讓人感覺到AR世界顯然是不真實的。


你可能知道該如何解決這個限制,例如虛擬現(xiàn)實(VR),當然。虛擬現(xiàn)實并不是一種全新的媒介,但直到最近幾年,技術才達到讓設計師創(chuàng)造沉浸式體驗的程度。


沉浸式VR體驗消除了現(xiàn)實世界與數(shù)字之間的障礙。當你戴上VR耳機時,你的大腦很難處理你收到的信息是否真實。

以下是設計人員在創(chuàng)建沉浸式虛擬環(huán)境時需要記住的內容:

01、寫一個故事

有意義的VR需要有一個強有力的故事核心。這就是為什么在你開始設計VR環(huán)境之前,你需要為用戶旅程寫一個故事。一個被稱為“故事板”的強大工具可以幫助你做到這一點。使用故事板,可以創(chuàng)建故事并檢查所有可能的結果。當你審視你的故事時,你將看到何時以及如何使用視覺和音頻提示來創(chuàng)造一種沉浸式的體驗。


02、與角色建立更深層次的連接

為了讓用戶相信虛擬現(xiàn)實中他們周圍的一切都是真實的,我們需要與用戶扮演的角色建立聯(lián)系。最明顯的解決方案之一是在虛擬場景中包含用戶手的表示。這個表示應該是實際的手-而不僅僅是一個假造的復制品??紤]不同的因素(如性別或膚色)是至關重要的,因為這會使互動更加現(xiàn)實。

Image title

用戶可以看到他或她的手,看他們看起來像一個角色。(來源:leapmotion)


也可以將現(xiàn)實生活中的一些對象帶到虛擬現(xiàn)實環(huán)境中,以創(chuàng)建這種連接。例如,一面鏡子。當用戶查看鏡像并在反射中看到其角色時,它可以在用戶和虛擬角色之間實現(xiàn)更真實的交互。

Image title

虛擬現(xiàn)實用戶會查看虛擬鏡像并將自己視為VR環(huán)境中的角色。

03、使用手勢而不是菜單

在設計沉浸式虛擬現(xiàn)實體驗時,我們不能依賴與傳統(tǒng)的菜單和按鈕形式。為什么呢?因為顯示菜單相對容易打破沉浸感。用戶將會知道他們周圍的一切都不是真實的。設計師不需要使用傳統(tǒng)的菜單形式,而是需要依賴手勢。設計界仍在為使用手勢定義一種通用語言的過程中,參加這項活動是有趣和令人興奮的。棘手的部分是讓用戶熟悉和可預測的手勢。

Image title

試圖將現(xiàn)有的交互概念重用于VR體驗。不幸的是,這個概念會打破沉浸感。新媒體需要新的互動模式。


04、與VR環(huán)境中的元素交互

要創(chuàng)建一個感覺真實的環(huán)境,我們需要讓用戶能夠與現(xiàn)實中的對象交互。理想情況下,環(huán)境中的所有對象都可以設計成允許用戶觸摸和查看它們的方式。這樣的物體會起到刺激作用,幫助你創(chuàng)造一種更沉浸的體驗。觸摸對于探索環(huán)境極其重要;嬰兒在最初幾天獲得的最重要信息是通過觸摸獲得的。


05、在虛擬現(xiàn)實中分享情感

虛擬現(xiàn)實有機會成為一種新的社會體驗。但要做到這一點,我們需要解決一個重要的問題,即,把非言語的暗示帶入交互中。


當我們與他人互動時,我們獲得的信息中的一個重要部分來自肢體語言。驚奇、厭惡、憤怒——所有這些情緒都存在于我們的面部表情中,在面對面的交流中,我們從眼睛區(qū)域推斷信息。當人們在虛擬現(xiàn)實環(huán)境中交互時,提供這些信息是很重要的,以此來創(chuàng)建更真實的交互。


好消息是,頭戴式設備(HMD)將很快覆蓋情感識別。在虛擬現(xiàn)實中,幾乎任何人與人之間的互動都會從面部表情中受益。


06、為VR環(huán)境設計聲音和音樂適合

音頻是沉浸式體驗的重要組成部分。如果不為環(huán)境設計聲音,就不可能創(chuàng)造真正的沉浸式體驗。聲音既可以用作背景元素(即周圍風的聲音)也可以用作方向。在后一種情況下,聲音可以作為提示-通過播放方向性(聲音來自何處)和距離(用戶可以將注意力集中在特定元素上)。


在為虛擬現(xiàn)實設計音頻時,最重要的是使聲音成為3D。2D聲音對虛擬現(xiàn)實來說不太好,因為它會使一切變得過于平坦。三維聲音是你可以聽到的聲音,在你周圍的每個方向-前面,后面,上面和后面-所有的地方。您不需要專門的耳機來體驗3D聲音;可以使用HMD的標準立體聲揚聲器來創(chuàng)建它。


頭部跟蹤是良好聲音設計的另一個關鍵方面。讓聲音以現(xiàn)實的方式表現(xiàn)是至關重要的。這就是為什么當用戶移動頭部時,聲音應該根據(jù)頭部移動而變化。


結論

當我們考慮到產品設計的現(xiàn)代狀態(tài)時,很明顯我們只是處于冰山一角,因為我們非常局限于平板電腦。

我們見證了人機交互(HCI)的根本轉變——重新思考數(shù)字體驗的整個概念。在未來的十年里,設計師們將打破玻璃(我們今天所熟知的移動設備時代),轉而使用未來的接口——復雜的語音接口、先進的ARS和真正的沉浸式VRS。當我們要創(chuàng)造一種新的體驗時,我們必須明白,我們唯一的界限就是我們的大腦告訴我們,它必須一直是怎樣的。

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

圍觀Twitter 網(wǎng)頁版重磅更新

資深UI設計者

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

這是一個移動端的時代,Twitter 的移動客戶端經歷了很多版本的迭代,但是桌面端的更新改版則非常的克制。

一周之前,Twitter 將接近7年未曾大幅度改版的桌面端頁面,從里到外重新翻新了設計。

新浪微博的每一次小幅度調整都會帶來大量的吐槽和不適,更不用說像Twitter 這樣的世界級的社交媒體網(wǎng)站。用戶的不適應不理解和負面反饋是避免不了,這樣的大幅更新改版背后,有著這個平臺不得不做的理由。

最近 Twitter 新版背后的設計師接受了連線雜志的采訪,深入地聊了一下改版背后的考量。

設計技術和工具的快速發(fā)展,視覺設計本身,尤其是 UI 界面的很多具體的執(zhí)行端的工作慢慢的沒有那么麻煩了,但是找到為什么這么設計的設計決策,并不是那么簡單。

保持一致:緊跟趨勢的一次重設計

在整體視覺風格上,Twitter 桌面端的設計給人的整體感知是更加現(xiàn)代的——并且和移動端版本的設計靠近且保持了一致。這絕對是一個以數(shù)字產品為核心的科技公司應該做到的最基本的事情。

原本置于頂部的導航欄消失了,功能性更強的左側邊欄承載了主要的導航功能。

其中,原本被隱藏的「書簽(bookmarks)」和「列表(LIsts)」是非常實用的內容管理功能,在這次改版的時候被直接顯示在側邊欄當中。

而更重要的改變在于,關于當下正在發(fā)生的熱門事件,單獨占據(jù)了右側的側邊欄「Trends for you」,大家正在熱烈討論的熱門事件以Twitter 中標志性的標簽(Hashtags)的形式呈現(xiàn),相當于微博中的「熱門微博」。而這在老版的 Twitter 中,這類內容的存在感并沒有那么強烈,原本存在于第一屏的左側側邊欄中,并且只有標簽,除非你有意識地去關注和點擊,否則很容易錯過。

搜索欄同樣被挪到了右側邊欄,置于「熱門趨勢」內容的頂部。這一設計巧妙的地方在于,它暗示了內容呈現(xiàn)的邏輯:當你搜索內容的時候,搜索結果會直接覆蓋在右側,而不會占據(jù)中間的主要的信息流。

毫無疑問,新版的 Twitter 在布局上更加扁平了,但是信息的扁平化呈現(xiàn)還不止布局上,交互上也相應的變化。在老版的 Twitter 中,當你點擊具體的推文條目的時候,內容會以彈出框的形式呈現(xiàn),但是新版中則會在當前層中直接擴展開顯示,不會彈出,整體的融合感和有機感會更強。

老版 Twitter 中推文彈出框

新版 Twitter 中的界面

同樣的,用戶在回復、轉推和點贊的時候,也不用在不同的彈出框模式下進行,而是更加直覺地在當前的頁面中完成,整體感更強,更加直覺。

用戶交互頻次相對較高的轉贊評和「熱門」和主要信息流都不會在彈出框和疊加層控件中完成了,主要信息流也不會被因此而覆蓋,整個 Twitter 因此顯得更加敞亮開闊。

另外一方面,新版 Twitter 提供了更加豐富的個性化設計的體驗,這也是對于 Twitter 用戶體驗的一次重要提升:

雖然在之前老版的 Twitter 中也可以定制字體大小色彩,但是之前的字體大小是純粹的隨意設置,這種自由度讓很多并不熟悉的用戶難以控制好文本和色彩的對比度,從而造成了整體視覺的愉悅度較低的情況。

新版中的配色和字體大小都是經過調校之后,比較合理的選擇,這樣擁有了足夠的選擇空間,又保持了整體視覺體驗上的愉悅性的設計。在產品顆粒度的控制上,Twitter 有著一套成熟精準的設計方案。

與此同時,所有人都期待的,深色模式,同樣隨著這次頁面重設計,一并打包更新了:

對于深色模式的控制,Twitter 和和其他的平臺略有一點不同,他們所設計的深色模式包括「昏暗(Dim)」和「熄燈(Light out)」兩種,前者的背景色是深灰,而后者則幾乎是全黑。

任何一個社交媒體平臺,大量的用戶涌入進來之后都會面臨著復雜的管控問題,更不用說 Twitter 這個已經存在了13年的世界性的平臺。許多狀況不可能簡單的一刀切來解決。

重設計背后:設計解決不了全部的問題

作為平臺,Twitter 已經在竭力推動「健康的對話」,但是在充滿分歧和對抗的網(wǎng)絡當中,情緒化是常態(tài),簡單的依靠 Twitter 官方的帳號來發(fā)聲,并不足以覆蓋如此廣泛的垂直領域和復雜多樣的用戶群體,以及不同的國家和地區(qū)。

「我們以前經常會推出一些新的設計和小功能。上線之后,過一陣子我們再搜出來,用投影儀投到墻上重新審視,」Twitter 的聯(lián)合創(chuàng)始人 Biz Stone 說:「然后我們會覺得,好像不應該這么設計?!?

「我們的目的是為公眾的對話來服務的。但是目標明確之后,還需要問一個問題:我們真的夠好嗎?」Biz Stone 在采訪的時候,這么說道。正是在這樣一個問題促使之下,Twitter 的改版重設計就悄然推動起來了。

從左到右分別為 Biz Stone,Bryan Haggerty 和 Mike Kruzeniski 。圖片來自 Wired,攝影師:Samantha Cooper

Twitter 團隊對此選擇了謹慎行事。他們選擇了類似灰度測試的方法,讓不同的用戶參與到不同的「測試」當中來,包括不同的書簽模塊的設計,不同的深色模式,不同的搜索模式,等等。絕大多數(shù)的設計都正面的,但是它們也并不是爆炸性的。

如今所呈現(xiàn)出來的新版頁面當中,絕大多數(shù)的設計都克制而微妙,以往的很多功能都得到了簡化。「我們正在試圖尋找合適的機會,重新創(chuàng)造更加大膽的設計,但是它需要一個穩(wěn)固的基礎,所以我們打算從這一次的重設計開始,從我們最好的功能和服務開始。這就是基礎?!筎witter 的高級產品設計總監(jiān) Mike Kruzeniski 面對連線雜志的采訪,是這么解釋他們設計的初衷。

所以,Twitter 的這次重設計只是一個開始。對于這個平臺上大量的關于仇恨和騷擾相關的負面內容,清理起來并不是一套規(guī)則就可以全部解決的,而 Twitter 更傾向于人為來處理和干預,但是平臺本身需要更好的支持這方面的功能。

在 Twitter 早期階段,視覺設計并不是他們的重心?!肝覀冎皇潜M全力地讓產品具備可用性,」Stone 回憶當時的情況:「我們并沒有試圖讓它看起來好看……我們只是努力讓平臺保持活力?!巩敃r的 Twitter 整個團隊大概只有30個人。

實際上,隨著后面更加專業(yè)的 UI 設計師加入進來之后,整個團隊的設計能力也越來越強。UI 界面是Twitter 和用戶進行溝通的媒介。

雖然現(xiàn)在是移動端為主的時代,但是桌面端 Twitter 的重要性并沒有弱化。Twitter 的網(wǎng)頁重設計項目的負責人 Jesar Shah 說:「人們在桌面上大量使用 Twitter 來搜尋感興趣的信息,跟他們息息相關的信息內容?!乖陧撁娴淖髠龋幸粋€快速的賬戶切換的功能,對于這一點,Shah 補充道:「圍繞這個功能點,我們從全球不同的地方獲得了反饋。比如日本就是Twitter 最大的市場之一,當?shù)赜脩艋谧约翰煌呐d趣點創(chuàng)建的賬戶,比如一個賬戶專門是關于美食的,一個是專門關于旅行的,還有一個則是給自己的寵物貓的。無論你使用哪個設備,都要能夠快速便捷地切換帳號,這是我們這么長時間的調研中,聽到最多的一個需求點?!?

從左到右分別為 Ashlie Ford,Marina Zhao 和 Jesar Shah ,她們主導了這次 Twitter 的設計。

「我們需要確保整體體驗足夠優(yōu)秀,所以原則上需要嚴謹。鑒于我們服務對象是全球客戶,所以我們需要盡可能滿足不同用戶的訴求?!筍hah 和 Ford 所帶領的團隊專門創(chuàng)建了一份調查問卷,以獲取反饋。他收到了來自全球總計20萬份問卷,F(xiàn)ord 的團隊花了整整一周的時間,借助翻譯工具將其中來自非英語國家的問卷都翻譯出來,并且梳理匯總了。

「用戶肯定會以為我們不會仔細閱讀這些問卷,但其實我們都仔細閱讀過了。」Shah 說道。她閱讀到的第一個用戶需求反饋就是想要更多的表情符,為了應對這樣的需求,Twitter 制作了一個分組表情輸入控件。同時,他們還提供另一個不斷更新的熱門 Gif 圖片表情合集,非常貼合用戶需求了。

Twitter 已經 13歲了。

在 這個社交媒體平臺上,@realDonaldTrump 可以進行「Twitter 治國」,還有大量的流言和不真實的信息,騷擾和不夠人性化的內容。這都是客觀存在的,亟待解決。在今年年初的時候,策展人 Chris Anderson 將 Twitter 比作是正在撞向冰山的泰坦尼克號。的確如此。

但是,設計改變不了一切。Twitter 的設計團隊在接受采訪的時候也坦誠地接受了這個事實。但是他們認為,設計可以幫助他們界定和構建 Twitter 功能,并且逐步地幫助用戶來解決身份認同的問題。

「如果你在 Twitter 上問一個用戶,Twitter 是什么,你會得到一千個答案?!筀ruzeniski 說:「曾經我們認為這樣很糟糕,但是現(xiàn)在我認為這是一個很棒的事情。因為現(xiàn)在我們可以更好地幫你找到特定的興趣,并且和你的興趣、你所關注的主題連接到一起。」

結語:圍繞人,而不是產品

曾經的推特是一個鋪滿木地板,到處都是品牌標志性藍色的「鳥籠」式的建筑,但是如今重新裝修過的辦公室則更加現(xiàn)代,墻壁上到處是各種各樣的涂鴉,這些涂鴉代表著Twitter 這個平臺內的各種垂直社區(qū),比如 Black Twitter、NBA Twitter,以及各路名人的粉絲社區(qū)。

走過Twitter 的辦公室,你會清晰地收到這樣的一個信息:一切都是關于人的,而不是產品。

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

柯里化、原生bind、防抖節(jié)流函數(shù)、實現(xiàn)promise

seo達人

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

多參數(shù)柯里
原生bind
實現(xiàn)promise
防抖節(jié)流函數(shù)
多參數(shù)柯里化

參數(shù)fn可以是function(a,b,c){},也可以是function(a,b,c,d,f){}

// 支持多參數(shù)傳遞
function progressCurrying(fn, args) {

    var _this = this
    var len = fn.length;
    var args = args || [];
    return function() {
        var _args = Array.prototype.slice.call(arguments).concat(args);
        // 如果參數(shù)個數(shù)小于最初的fn.length,則遞歸調用,繼續(xù)收集參數(shù)
        if (_args.length < len) {
            return progressCurrying.call(_this, fn, _args);
        }

        // 參數(shù)收集完畢,則執(zhí)行fn
        return fn.apply(this, _args);
    }
}

原生js實現(xiàn)bind

Function.prototype.myBind = function(Othis){
  if(typeof this !== "function"){
    return new TypeError("not a function");
  }
  let _this = this;
  let args = [...arguments].slice(1);
  let func = function(){};
  let fBound = function () {
    return _this.apply(this instanceof func ?this:Othis,[...arguments].concat(args));
  }
  func.prototype = _this.prototype;
  fBound.prototype = new func();
  return fBound;
}

防抖函數(shù)

//每wait時間內執(zhí)行一次,若期間被觸發(fā),則重新執(zhí)行
function debounce(func,wait) {
  var timeout ;
  return function(){
    let args = [...arguments];
    let _this = this;
    if(timeout){
      clearTimeout(timeout);
    }
    timeout = setTimeout(function() {
      func.apply(_this,args);
    }, wait);
  }
}

節(jié)流函數(shù)

//每wait時間執(zhí)行一次
function throttle(func,wait){
  var timeStart = 0 ;
  return function(){
    let _this = this;
    let args = [...arguments];
    let now = Date().now();
    if(now - timeStart >wait){
      func.apply(_this,args);
      timeStart = now;
    }
  }
}

實現(xiàn)一個promise

    function _Promise(func){
        this.status = 'pending'
        this.result = '' ;
        func(this.resolve.bind(this),this.reject.bind(this));
    }
    _Promise.prototype.resolve = function(result){
        if(this.status == 'pending'){
            this.status = 'fullfilled';
            this.result = result;
        }
    }
    _Promise.prototype.reject = function(error){
        if(this.status == 'pending'){
            this.status = 'rejected';
            this.result = error;
        }
    }
    _Promise.prototype.then = function(preResolve,preReject){
        let _isPromise ;
        if(this.status == 'fullfilled'){
            _isPromise = preResolve(this.result);
        }else if(this.status == 'rejected' && arguments[1]){
             _isPromise = preReject(this.result);
        }
        return _isPromise instanceof _Promise ? _isPromise:this;
    }

實現(xiàn)一個promise.all()

 function promiseAll(promiseArray){
        //首先參數(shù)一定是一個數(shù)組
        //然后此函數(shù)返回的是一個promise,如果全部成功,則返回結果的數(shù)組,只要有一個失敗,則返回失敗的結果
        return new Promise(function (resolve,reject){
            if(!Array.isArray(promiseArray)){
                return reject(new TypeError("not a function"));
            }
            let resolveNum = 0;
            let arrNum = promiseArray.length;
            let resolveResult = [];
            for(let i=0; i<arrNum ;i++){
                (function (i){
                    Promise.resolve(promiseArray[i]).then(function(result){
                        resolveNum ++;
                        resolveResult.push(result);
                        if(resolveNum == arrNum){
                            return resolve(resolveResult);
                        }
                    },function(error){
                        return reject(error);
                    })
                })(i);
            }
        }) //返回的promise結束
        
    }
藍藍設計sillybuy.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、網(wǎng)站建設 、平面設計服務。

前端性能優(yōu)化

seo達人

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

減少頁面加載時間的方法:
1.壓縮html css js等文件
2.減少DNS解析
3.減少DOM元素,對于相關操作可以緩存節(jié)點
4.改變頁面元素樣式時盡量操作className,而不是頻繁使用xxx.style.(其實還有很多這種DOM修改操作的細節(jié)比如opacity替代visibility ,多個DOM統(tǒng)一操作(雖然V8會有緩存優(yōu)化) ,先將DOM離線,即display:none;修改后顯示 ,不要把DOM放在已給循環(huán)中作為循環(huán)變量 ,不要使用table )
5.避免不必要的重定向
6.合并js css及圖片,減少請求數(shù)量
7.使用CDN
8.合理利用緩存
9…

關于CDN?
https://zhuanlan.zhihu.com/p/39028766

CDN中文名“內容分發(fā)網(wǎng)路”,作用是減少傳播時延,找最近的節(jié)點。CDN本質就一個是緩存,只是這個緩存離你特別近,不管是作為用戶還是開發(fā)人員都能從中享受一點福利。
CDN的優(yōu)點
1.訪問加速
2.減輕服務器負載
3.抗住攻擊
CDN的缺點
1.只能對靜態(tài)資源加速
2.內容更新時需要分發(fā)到其他節(jié)點
3.代價高昂
與傳統(tǒng)網(wǎng)站訪問方式的不同
傳統(tǒng)的網(wǎng)站會直接解析域名獲得IP地址然后發(fā)送請求
使用了CDN的網(wǎng)站則增加了緩存層,解析域名→獲取對應CNAME域名→對獲取的域名進行解析得到緩存服務器的IP地址,將用戶的訪問請求引導到最優(yōu)的緩存節(jié)點而不是源站。

總結:通過權威DNS服務器來實現(xiàn)最優(yōu)節(jié)點的選擇,通過緩存來減少源站的壓力。主要應用于靜態(tài)網(wǎng)頁、大文件的下載等等。
應用與踩坑

緩存設置
max-age在Cache-Control中經常用于緩存的控制,可是max-age設置的緩存會應用于一個請求經過的每一級,如果我們希望CDN不緩存那么久,要怎么辦呢?那就是s-maxage,它用于設置代理服務器的緩存時間,會覆蓋max-age的設置,這樣我們可以把max-age用于本地緩存,把s-maxage用于CDN緩存時間,避免臟數(shù)據(jù)的產生。

緩存命中率
對于一個緩存而言,還有一點非常重要,就是你的緩存到底有沒有用,衡量這個東西的就是緩存命中率。如果只是靜態(tài)資源,在刷新緩存之后,可能導致命中率下降,因此CDN的資源不適合經常刷新,換句話說,如果一個請求結果會經常進行變更,那么CDN基本就沒有什么存在的意義了。

判斷是否命中緩存
還要考慮的一件事是:這個資源是否命中了CDN,是否是因為CDN導致的問題。

在各大廠商的CDN返回的數(shù)據(jù)中都會有一個X-Cache,上面內容是Hit或者Miss,還會加上諸如Memory或者Disk的縮寫表示內存還是磁盤,如果出現(xiàn)Upstream或者Miss則表示沒有命中。

資源預熱
緩存設計中,預熱是很重要的環(huán)節(jié),在最初剛開始啟動CDN的時候,CDN上并沒有緩存數(shù)據(jù),此刻大量的請求全部打向源站,肯定會把源站打掛,預熱就是實現(xiàn)緩存熱門數(shù)據(jù),這樣在業(yè)務上線時,CDN上已經有所需的數(shù)據(jù)了

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

在商業(yè)環(huán)境中的UX體驗衡量指標

資深UI設計者

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

好的衡量指標帶你上天堂,不好的衡量指標帶你睡…

嗨,本周Nathan 與大家分享下一些在UX 工作中,常會聽到的一些衡量指標專有名詞,有些或許是你常常聽到但不太確定的,有些則可能是你所在的領域或項目比較少討論的。

雖然在大多數(shù)的公司中,與中小型的設計團隊,采用快速定性的研究,可能是比較符合CP 值的方式。但當產品、用戶甚至團隊具有一定規(guī)模時,關于量化指標的重要性,在2019 年的今天想必已經不需要再重復敘述。

不太一樣或是常被誤會的是,對于設計師來說,多數(shù)在工作中使用的量化衡量指標,其實大多是圍繞設計工作的顯性部分,也就是可用性(Usability) 上,而可用性工作其實只是UX Design 的一環(huán)。

但, UX 畢竟是由商業(yè)環(huán)境中反推學術的一門職位。

如果僅僅只是將量化指標用在UX Designer 的工作上,反而是自己自廢武功。不要忘記小至前端展現(xiàn),大至商業(yè)策略,都可以是UX Design 的范圍。

Five Levels of UXs ConversionXL

因此如何學習使用一些既帶有商業(yè)特性,又能體現(xiàn)用戶體驗的指標,是每個UX 工作者,多少都要知道的。

We are not design the UX,but we can design for UX

另外,本篇主要在分享一些使用體驗橫標指標上的一些迷思,與介紹工作中常用的一些指標,至于如何透過這些指標幫助UX Designer 在工作中提升重要性,來自證UX 工作能帶來的價值部分,可以看一下Nathan 以前寫過的一篇古早文。

 

1、關于數(shù)據(jù)指標與衡量的常見迷思

01 數(shù)據(jù)指標的使用,不符合GSM 原則

當有一定的用戶后,結合常見的數(shù)據(jù)分析工具或內部團隊自建的數(shù)據(jù)埋點,網(wǎng)站和應用馬上就能出現(xiàn)許多可供分析的數(shù)據(jù),似乎只要有這些數(shù)據(jù),令人驚喜的洞察就會自動浮出水面。

GSM(Goal-Signal-Metrics)是Google 提出的目標導向衡量模型,用來拆解用戶使用產品時的設計目標-行為信號-衡量指標的一種模式。

Google GSM Framework, Goal-Signal-Metrics

在商業(yè)場景中,所有的數(shù)據(jù)衡量必定帶有明確的目標,比如:透過觀察寬口轉化和窄口轉化,分析廣告投放效益以及GMV 成本。甚至,如果僅基于這些觀察數(shù)據(jù)進行動作性的優(yōu)化,沒有配合中長期的決策時,變化僅會流于短期效益。

02 顯而易見的數(shù)據(jù)指標,不代表就是有幫助的

一個數(shù)據(jù)指標容易監(jiān)測與計算,并不意味著它對你的產品來說就是重要的。透過現(xiàn)在大部分的分析工具,可以很容易就監(jiān)測跟蹤成百上千的各種指標,而且分析的工具也層出不窮。新產品團隊往往因為能獲取大量的數(shù)據(jù),然后就期望洞察自動出現(xiàn),但往往不遂人意。

例如,網(wǎng)頁或App 的PV 數(shù)據(jù)很容易收集,但如果你的網(wǎng)頁或產品是屬于內容消費類型的,它就無法呈現(xiàn)用戶是否在你的網(wǎng)站消費內容(有效時長更具代表性)。高的PV 或許是由市場廣告轉化過來的用戶,但對內容消費類的產品目標,肯定不是確定每個用戶到底瀏覽了多少頁面,PV 可能是衡量廣告效果的重要度量,但它并不是監(jiān)測用戶參與度的良好方式。

如果你不確定你正在用的數(shù)據(jù)指標,是否有正向幫助的話??梢詤⒖糀ARRR 的轉化模型,來幫助自己梳理清楚核心的轉化鏈路。

03 單一的數(shù)據(jù)指標,對于效果衡量可能是模糊的

如上面所說相較于PV、UV、DAU,用戶在網(wǎng)站或應用中的有效停留時長,可能更適合用來衡量用戶在產品中的參與度。

但停留時間越長可能是正面的,也可能是負面的。在電商產品類的轉化過程中,如果在關鍵的轉化節(jié)點用戶停留較久,可能意味著用戶因困惑、分心或挫敗而花費了大量時間。即便同時監(jiān)測網(wǎng)站或應用的停留時長和轉化率,你可能仍然不清楚為什么用戶參與度如此高,對于最后的成交卻沒有太大幫助。

這時就需要透過配合更細致的數(shù)據(jù)指標組合,慢慢的定位用戶在操作步驟中的關鍵問題,并嘗試透過A/B Testing 來解決。

04 正確的衡量指標,要依產品、企業(yè)本身而制定

大家常用的數(shù)據(jù)指標,并不一定適合自己當前產品階段或企業(yè)目標。

正常而言企業(yè)的主力產品,正是代表著企業(yè)主要的商業(yè)營利模式,因此在發(fā)布產品后要監(jiān)測的各種衡量指標,通常在產品準備進入市場前,都已依照商業(yè)模式進行拆分。但在產品的冷啟動時期,這些依商業(yè)模式拆分的指標,很多時候無法反映出,企業(yè)的產品是否正在往好的方向成長。

比如Saas服務類型的產品,通常都會使用凈收入留存NDRR (Net Dollar Retention Rate)作為主要的商業(yè)模式指標,但在前期用戶量少時,搭配NPS或PSAT等類型的指標,才能夠好的回歸到Saas產品的服務體驗本質。了解企業(yè)目前提供的服務,對用戶來說是否是正向的,并且能持續(xù)增長。

05 大多時候,衡量指標并不會純粹與設計相關

在產品開發(fā)迭代中發(fā)布新功能后,數(shù)據(jù)可能會開始上升。產品團隊可能認為這是新功能的發(fā)布造成的,但銷售部分卻可能會將它與一項新的促銷活動聯(lián)系起來,而UX 團隊則可能認為這與他們的新設計相關。

這種場景在產品的數(shù)據(jù)到達一定規(guī)模時十分常見。真實情況是只能透過控制一些固定因子,來做更細部的A/B Testing 拆分。但大多時候產品的迭代時間與開發(fā)資源,很難真正做到能明確確認是因為什么原因。

因此結合前面所說的,各團隊在主要的數(shù)據(jù)指標中,配合其他輔助指標,甚至提取更與團隊緊密相關的個別指標,來了解在產品的迭代過程中,各自團隊做的決策是否是正向的。

用戶體驗指標,跟易用性和商業(yè)指標目的不同

下面就會介紹幾種工作中常用的,與體驗相關的衡量指標,部分指標在訂定的一開始,本身即包涵了商業(yè)與體驗維度。

 

2、工作中可能用到的幾種體驗衡量指標

大部分的體驗衡量指標,都會基于三個主要價值觀,結合其他用戶態(tài)度類型作為衡量基準。

  1. 可用性
  2. 參與度
  3. 轉化率+ User Attitude

下面介紹幾種,在工作中可能常用到的通用型,與不同業(yè)務場景型的體驗衡量指標。

2.1 通用型

01 傳統(tǒng)網(wǎng)站服務使用的PULSE

PULSE 是基于商業(yè)和技術的衡量模型,被很多組織和公司廣泛應用于跟蹤產品的整體表現(xiàn)。包含:

  • Page view 頁面瀏覽量
  • Uptime 響應時間
  • Latency 延遲
  • Seven days active user 7天活躍用戶數(shù)
  • Earning 收益

但不難看出PULSE 指標僅覆蓋了UX 設計中最最基礎的可用性部分,和衡量用戶體驗的直接關系不大,難以評估設計工作到來的影響,畢竟這個指標創(chuàng)建之初是用來衡量產品的技術與商業(yè)效果。

因此為了彌補PULSE 指標中存在的問題,Google 提出了HEART 指標模型。HEART 是“以用戶為中心度量的指標體系,以及把產品目標與創(chuàng)建指標體系相互關聯(lián)的過程”

02 以使用者為中心的HEART

HEART其實也是業(yè)界使用的老黃歷了,尤其常用GA ( Google Analytics ) / Adobe Omniture的人一定都對他不陌生。

早期產品開發(fā)上線的階段,大多是訂定業(yè)務KPI 作為衡量項目產出的價值,但在用戶體驗的部份,卻很難有可視化以可及量化的衡量指標。因此Google 嘗試把產品目標以及體驗指標相互結合,建立以用戶為中心的HEART 度量體系。

Google Heart 體驗衡量指標模型

 

2.2 Saas 服務型

01 NPS( Net Promoter Score凈推薦值)

凈推薦值最早是由貝恩咨詢的創(chuàng)始人Fred Reichheld 在2003 提出,通過測量用戶的推薦意愿,從而了解用戶之于產品或服務的忠誠態(tài)度。

NPS 算是近幾年用戶體驗領域上的當紅指標(甚至業(yè)內還有所謂的NPS 教派XD),基本上互聯(lián)網(wǎng)類產品都可以使用。其基本核心理念是,一個企業(yè)的用戶可被劃分為三類:推薦者、中立者和批評者。

  1. 推薦者是投入且重復使用產品的用戶,他們會熱情地向其他人推薦你的產品或服務。
  2. 被動者是對產品滿意,但缺乏熱情和忠誠度的用戶,他們很容易轉而投向使用競爭者的產品或服務。
  3. 批評者是那些明顯對企業(yè)的產品或服務不滿意的那部分用戶

相較于其他的指標,NPS 詢問的是意愿而不是情感,對用戶來說更容易回答,且直接反應了客戶對企業(yè)的忠誠度和購買意愿,在一定程度上可以看到企業(yè)當前和未來一段時間的發(fā)展趨勢和持續(xù)盈利能力。

02 CES( Customer Effort Score用戶費力度)

CES 指的是你的產品或服務,會需要用戶花費多少力氣才能滿足自身需求。

根據(jù)Oracle 的一項研究,82%的人把他們的購買經歷描述為“花費太多的努力”,CES背后的理論就是,應該想辦法減少客戶為了解決問題而付出的努力。CES可以幫助你找出可優(yōu)化的方向,更容易理解在哪里進行改善,較低的費力度也與客戶留存直接相關,從而增加客戶的生命周期價值。

一般情況下,大多會先利用CSAT、PSAT這類的指標來衡量客戶對產品或服務的體驗反饋,當這套標準的價值到達臨界點時,就應該嘗試CES作為滿意度指標的擴充,更充分的評估Saas產品的用戶體驗情況。

03 FCR( First contact resolution一次性解決率)

作為Saas類服務型產品,在獲取新客或幫助舊客時,大多是通過客戶服務,在許多的互聯(lián)網(wǎng)公司Customer Service團隊也是重點投入資源的。而「FCR一次解決率」即是用來衡量這類客戶服務的指標。

FCR 是指客戶的服務需求在第一次客戶服務中完全解決的占比率。

測量一次性解決率是相當簡單的。通過單次交互(電子郵件響應,電話,聊天會話等)解決你收到的客戶請求數(shù)量,并除以同一時期收到的請求總數(shù)。

一次性解決率不僅對Saas 產品的客戶至為重要,也能體現(xiàn)客戶服務的績效和表現(xiàn),甚至深入到每個員工的層面上。

 

2.3 系統(tǒng)性評估型

01 SUS( System Usability Scale系統(tǒng)可用性量表)、QUIS(Questionnaire for User Interface Satisfaction用戶交互滿意度)

SUS 應該也算是用來評估單個用戶使用某個產品的可用性時,最常見的指標了。SUS 是一種用來量化定性數(shù)據(jù)的方法,并不僅僅依靠數(shù)據(jù)統(tǒng)計,需要結合用戶具體參與來進行調研,通常作為可用性測試的組成部分。

SUS 通常用來作為改版效果的整體評估,在使用時可以對題目的主詞產品進行替換,這些替換對最后的測量結果都沒有影響。

而QUIS 則可以說是SUS 的進階版,會更注重具體頁面或操作節(jié)點的易用性,通常作為SUS 的延伸使用。比較簡單的QUIS 版本包括27 個問題,分為5個類別:

Overall Reaction 總體反應、Screen 屏幕、Terminology/System Information 術語/系統(tǒng)信息、Learning 學習、System Capability 系統(tǒng)能力

02 CSAT( Customer Satisfaction客戶滿意度)、PSAT( Purchase Satisfaction購買滿意度)

客戶滿意度也算是經典的衡量指標之一了,隨著商業(yè)競爭的激烈,各類型的產品與企業(yè)都對客戶滿意度更加重視,很多時候你所熟悉的電話滿意調研、電子郵件調研,甚至直接在消費后的星級評分,其實都是關于這類問題的問券。

PSAT 則是在CSAT 的基礎上,針對消費類型產品進行細化,強調售后使用體驗的部分。這類問卷的好處是簡單且擴展性強,可大至系統(tǒng)小至任務。

但缺點就是用戶容易在中等范圍內回答問題,無法給企業(yè)帶來真實的反饋。而且,即使在客戶滿意度很高的情況下,依然有可能遭遇留存流失問題。

因為滿意度并不直接與客戶忠誠度相關聯(lián)。

其他相關的系統(tǒng)性可用型指標當然還有許多,不過在工作流程中一般來說都較少會使用到,主要還是更具專業(yè)性的用研User Researcher 角色較常使用,包含:

  • SUMI(Software Usability Measurement Inventory 軟件可用性測試)
  • CSUQ(Computer System questionnaire 計算機系統(tǒng)可用性測試
  • USE (Usefulness, Satisfaction, and Ease of Use 有用性、滿意度、易用性)

 

2.4 電商產品型

01 PSM(Price Sensitivity Measurement 價格敏感度測試)

PSM 衡量目標用戶對不同價格的滿意及接受程度,了解其認為合適的產品價格,從而得到產品價格的可接受范圍。

PSM 考慮了消費者的主觀意愿,又兼顧了企業(yè)追求最大利益的需求。但測試過程主要基于目標對象的自然反應,沒有涉及到任何競爭產品的信息。所以在橫向拉通上顯得較為薄弱。

也正因為缺少對于競爭產品的分析,所以PSM 目前主要集中在自成體系的產品鏈路中,用來配合Saas 服務或虛擬產品的定價,在實體產品中已經較少被使用。

02 DSR(店鋪質量評分)

DSR 算是電子商務類產品中的特殊指標,初期是在在阿里巴巴的電商生態(tài)中大規(guī)模使用,目前也慢慢變成電商場景的通用指標。

DSR 是指買家在電商平臺上購物成功后,針對本次購物給出的評價分數(shù)。買家可以評分的項目包括「描述相符、服務態(tài)度、發(fā)貨速度、物流速度」4 項。

DSR 評分計算方法:每項店鋪評分取連續(xù)6個月內買家給與該項評分的總和/連續(xù)6個月內買家給與該項評分的次數(shù),統(tǒng)計最近180天

DSR 評分直接影響賣家在電商平臺中,商品搜索曝光權重的高低,從而影響商品與店鋪的排名。因此對于平臺類的UX Design Team 來說,建立類似DSR 的曝光評分機制,也是間接影響服務提供商的產品體驗,進而提升整體平臺中的用戶體驗質量。

03 ZMOT(Zero Moment Of Truth第零關鍵時刻)、FMOT(First Moment Of Truth第一關鍵時刻)、SMOT(Second Moment Of Truth第二關鍵時刻)

FMOT & SMOT 是目前新零售場景常會提到的指標模型,但其實在傳統(tǒng)的零售行業(yè)早就是一個通用的衡量指標,F(xiàn)MOT 指的是消費者在接觸到對應商品貨價的關鍵3~7 秒,所有的商品售價、包裝、擺設都是在這關鍵3~7 影響消費者拿取商品甚至購買的關鍵因素。

而SMOT 則是指這類實體產品,在消費者購買回家后的首次體驗,是否符合這個商品的廣告語,對于一個品牌來說,即是是否成功地履行了它的承諾還是令人感到失望,這也是消費者是否會成為一個品牌的粉絲,甚至在線上或線下渠道分享的關鍵(是否很像NPS 的精神?)。

延伸出的ZMOT,即是線上線下結合的新零售關鍵指標,讓消費者在「尚未接觸」到特定商品前,就透過線上向消費者進行行銷,當消費者主動進行相似活動、搜索時,就能接收到產品的正面訊息來影響消費意向。

本質核心也就是

當廣告出現(xiàn)在用戶需要的時刻,就變成了服務

ZMOT & FMOT & SMOT

 

2.5 主觀評估型

用戶體驗的主觀評估,大多是偏觀察式的方法,也是大家比較耳熟能詳?shù)挠枚ㄐ哉{研法,比如眼動儀、觀察法、品牌問卷… etc.。

當然如果要盡可能嘗試量化這類User Attitude 主觀評估數(shù)據(jù)時,前提都是把用戶體驗理解成兩種維度,一種維度是實用性(Pragmatic)偏向常說的可用性,另一種是享樂性(Hedonic)也就是常說的舒適性,享樂性維度還會被拆分成了幾種屬性,例如Stimulation和Identification。

01 UEQ(User Experience Questionnaire 用戶體驗調查表)

UEQ 是SAP 開發(fā)的一套定量分析用戶體驗的工具。用戶在問卷上表達出他們在使用產品和服務中的感受,印象和態(tài)度,然后生成一個包含用戶體驗數(shù)個方面的量化表。包括傳統(tǒng)的易用性方面的指標:

  • Efficiency
  • Perspicuity 易懂
  • Dependability 可信任

也包括三個體驗方便的指標:

  • Attractiveness 吸引度
  • Stimulation 激勵性
  • Novelty 新鮮度

02 HQ(Hedonic Quality享受性質量)、PQ(Pragmatic Quality實用性質量)& AttrakDiff

HQ 主要是用來消費型產品的情感衡量指標,較常使用消費者對于消費類型產品的評價。而PQ 則主要是在易用性層面上加入主觀因素的評分,如果要針對性地對HQ & PQ 進行系統(tǒng)性評分,AttrakDiff 則是一個較常使用的工具。

AttrakDiff 包含了28 項題目,每一項都是一個7 分制量表,分和最高分代表一對具有評價性質的反義詞,用戶需要根據(jù)使用產品過程中的某一方面的體驗從低到高進行評分,比如“混亂的— — 清晰的”,分數(shù)越高,表明產品的某一方面設計得越清晰。

 

3、寫在最后

在產品或業(yè)務中導入體驗數(shù)據(jù)衡量指標,不是新入行的設計師想像的這么簡單。真正的實務過程絕不是將文章中的指標,直接導入自己對接的產品中,每一個數(shù)據(jù)指標都有其目的,且不同的人即便看到的數(shù)據(jù)相同,也都會有自己的解讀方式。

過于依賴指標,如果不隨時依據(jù)市場動態(tài)與公司策略進行調整,不僅容易因為短期的良好數(shù)據(jù)忽視了中長期的產品成長,也會慢慢的喪失設計師的感性創(chuàng)意能力。

所以,清楚的認知到哪個指標可以幫助我進行什么樣的設計策略。才是真正的使用方式。千萬別讓設計師變成動作導向的工作職位,

Value-Driven 價值導向的工作模式,才是設計師的生存法則

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

產品設計師要了解的數(shù)據(jù)指標

資深UI設計者

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

很多設計師和產品經理在剛入門時,都會對一些數(shù)據(jù)指標很模糊(這些花花綠綠的是啥玩意兒)。尤其是與產品團隊和運營扯需求、與開發(fā)談指標、談實現(xiàn)等場景,數(shù)據(jù)指標就更為常見。假如我們對指標不了解、沒有概念,則會被多方質疑你的專業(yè)能力,同時你也無法提升“數(shù)據(jù)驅動業(yè)務、數(shù)據(jù)驅動產品、數(shù)據(jù)驅動設計”的核心能力。


關注數(shù)據(jù)指標,不僅僅是產品經理或運營的“專利”,作為交互和UI設計師也需要掌握這方面的技能,來幫助我們產出更貼近用戶行為的設計。同時,監(jiān)測產品數(shù)據(jù)也有2個重要作用:一是可以監(jiān)控產品迭代中的問題點和設計點、運營和市場活動的收入水平等,看看他們目前處于什么狀態(tài),也可以為后續(xù)產品迭代的方向提供參考幫助。二是通過對數(shù)據(jù)的挖掘和分析,可以發(fā)現(xiàn)新的商業(yè)機會和產品爆發(fā)點,也就是近兩年咱們經常聽到的數(shù)據(jù)增長、用戶增長、增長設計概念。


因此,作為一名設計師或產品經理必須要了解與業(yè)務相關的核心數(shù)據(jù)指標。由于所在領域不同、業(yè)務不同,因此團隊所關注的數(shù)據(jù)側重點也不同。今天就從“網(wǎng)頁基礎指標、用戶數(shù)據(jù)指標、如何獲取數(shù)據(jù)指標、產品設計的生命周期”來梳理我們產品設計者常見的指標維度。

Image title



一、什么是數(shù)據(jù)指標?


它是對當前業(yè)務有參考價值的統(tǒng)計數(shù)據(jù),是通過對于業(yè)務需求的進一步抽象,并進行數(shù)據(jù)埋點后,加工出來的一套計算規(guī)則,并通過有效的方法論和數(shù)據(jù)可視化呈現(xiàn),最終能夠解釋業(yè)務變化和用戶行為。當然,不是所有的數(shù)據(jù)指標都叫指標,只有對當前業(yè)務有參考價值的指標才可稱作指標,同時要具備:可統(tǒng)計、可分析、可監(jiān)測的特點。



二、網(wǎng)頁基礎指標


先了解下流量的概念:分為站外流量來源站內流量路徑。以下就拿電商產品舉例:

站外流量:通過其他平臺或外界媒體進入到你的店鋪就是站外流量。又分為免費和付費,免費有自然流量和搜索流量(比如在百度搜你店鋪的名稱并點擊進入,這就是從免費的外界平臺進入),而付費則主要是一些廣告投放的流量(比如將你的店鋪鏈接付費植入到某公眾號,讓他幫你推廣,既從他公眾號進入店鋪的流量)。


站內流量:通過平臺內的推薦入口或者搜索路徑等方式,進入到你的店鋪就是站內流)。主要指用戶在網(wǎng)站內的行為路徑。



PV(頁面瀏覽量)


用戶每1次對網(wǎng)站中的每個網(wǎng)頁訪問(成功訪問/進入)均被記錄1次。用戶對同一頁面的多次訪問,訪問量累計。在一定統(tǒng)計周期內用戶每次刷新網(wǎng)頁1次也被計算1次。

理論上PV與來訪者數(shù)量成正比,但是它不能精準決定頁面的真實訪問數(shù),比如同一個IP地址通過不斷的刷新頁面,也可以制造出非常高的PV。



UV(獨立訪客人數(shù))


訪問網(wǎng)站的一臺電腦客戶端為一個訪客。00:00~24:00內相同的客戶端只被計算一次。

使用獨立用戶作為統(tǒng)計量,可以更加精準的了解一個時間段內,實際上有多少個訪問者來到了相應的頁面。



VV(用戶訪問次數(shù))


當用戶完成瀏覽并退出所有頁面就算完成了一次訪問,再次打開瀏覽時,VV數(shù)+1。VV同時也是視頻播放次數(shù)(Video View)的簡稱。



PV、UV、VV有啥區(qū)別?


比如你上午打開了UI中國,訪問了兩個作品頁面并關閉網(wǎng)頁。下午又打開了UI中國,訪問了五個作品頁面。則當日統(tǒng)計結果為:PV=5、UV=1、VV=2

Image title



跳出率


一個非常重要的指標,表示用戶來到網(wǎng)站后,且沒有進行操作就直接離開的比例,代表著陸頁面(訪客進入網(wǎng)站的第一個頁面)是否對用戶有吸引力,常用的計算方式是落地頁面的訪問量除以總訪問量。


比如,在一個統(tǒng)計時間內,網(wǎng)站有1000個不同用戶從某個鏈接進入,其中有50人沒有二次瀏覽行為,是直接退出網(wǎng)站的,那么這個鏈接的網(wǎng)站跳出率為:50/1000=5%。然而有些退出的行為不能作為退出考慮,比如頁面上刻意添加的導出鏈接,如合作伙伴的網(wǎng)站等,還有聯(lián)系我們,付款頁面等,都不算是負面的跳出,所以要根據(jù)不同情況統(tǒng)計有效的數(shù)據(jù)才能得出可靠的跳出率。


統(tǒng)計一個網(wǎng)站的跳出率是非常有必要的,能幫助產品提高用戶粘性。跳出率高,說明用戶體驗做得不好,用戶進去就跳出去了,著陸頁沒有滿足用戶的期望與需求,或是人群定位不精準。相反如果跳出率較低,說明用戶體驗做的很好,最起碼用戶能在第一時間獲取自己需要的內容,并且可能還會二次光顧。



退出率

針對網(wǎng)站內某一個特定的頁面而言,退出率是衡量從這個頁面退出網(wǎng)站的比例,通過一個頁面的退出次數(shù)除以訪問次數(shù)。


退出率反映了網(wǎng)站對用戶的吸引力,如果退出百分比很高,說明用戶僅瀏覽了少量的頁面便離開了,因此需要改善網(wǎng)站的內容來吸引用戶,解決用戶的內容訴求。



跳出率與退出率又有啥區(qū)別?


跳出率是指用戶進入網(wǎng)站起,沒進行什么跳轉操作,又從這個頁面退出或關閉的比例。退出率則是無論用戶從哪個頁面進入網(wǎng)站,最終從這個頁面退出的比例。


跳出率適用于訪問的著陸頁 (即用戶成功訪問的第一個頁面),而退出率則適用于任何訪問成功并退出的頁面,既用戶在網(wǎng)站上訪問的最后一個頁面 。退出率通常針對局部的頁面來統(tǒng)計,比如支付流程退出率高,那就要針對現(xiàn)狀對流程做優(yōu)化。但站在網(wǎng)站總體的角度統(tǒng)計退出率沒啥意義,因為有訪問網(wǎng)站,就必然有離開網(wǎng)站。而跳出率則可以適用于著陸頁面,也可適用于網(wǎng)站整體。



平均訪問時長

指在特定統(tǒng)計時間段內,瀏覽網(wǎng)站的一個頁面或整個網(wǎng)站時,用戶所停留的總時間除以該頁面或整個網(wǎng)站的訪問次數(shù)的比例。


如用戶在網(wǎng)站特定時間內總停留時間為1000秒,在這段時間內,總的訪問次數(shù)是100次,那么這個頁面或網(wǎng)站的平均訪問時長就是1000秒/100=10秒。


該數(shù)據(jù)是分析用戶粘性的重要指標之一,也可以側面反映出網(wǎng)站的用戶體驗。平均訪問時長越短,說明網(wǎng)站對用戶的吸引力越差,可用內容信息越少。



轉化率


在一個統(tǒng)計周期內,完成轉化行為的次數(shù)占推廣信息總點擊次數(shù)的比率。


轉化率=(轉化次數(shù)/點擊量)×100%。以用戶登錄行為舉例,如果每100次訪問中,有10個登錄網(wǎng)站,那么此網(wǎng)站的登錄轉化率就為10%,而最后有2個用戶關注了商品,則關注轉化率為2%,有一個用戶產生訂單并付費,則支付轉化率為1%。


轉化率是產品盈利的重要指標之一,它直接反映了產品的盈利能力。不同行業(yè)的轉化率,關注點也不同,比如電商產品就要關注銷售轉化,看看參與活動的用戶當中有多少是在活動后產生支付的,有需要的還可以根據(jù)數(shù)據(jù)分析出人均購買次數(shù)和購買金額。再比如我們監(jiān)測注冊量,就要關注注冊轉化率,看看這個活動給產品帶來了多少新增用戶。所以轉化率可以針對性分析產品在哪些方面做的不足,可以快速定位到問題點。



轉化率是采用訪客數(shù)量(UV)還是訪問量(PV)?


這需要根據(jù)團隊數(shù)據(jù)分析的目的而定。比如采用訪問量,就是認為每次訪問都可產生付費。若采用訪客量,就認為用戶多次訪問才能購買是正常的行為。個人建議前期采用訪客數(shù)量,以排除自己團隊對網(wǎng)站訪問的數(shù)據(jù)干擾,因為訪問量是可以通過同一個IP不斷刷新網(wǎng)頁而遞增的,而訪客數(shù)量是精準到一個IP地址(既一個用戶、一個設備)。



回購率


指用戶對商品或者服務的重復購買次數(shù)(回頭客)。


重復購買率有兩種計算方法:一是所有購買過產品的用戶,以每個人為獨立單位重復購買產品的次數(shù),比如有10個客戶購買了產品,5個產生了重復購買,則重復購買率為50%;二是單位時間內,重復購買的總次數(shù)占比,比如10個客戶購買了產品,其中有3人產生二次購買,3人中又有1人產生三次購買,則重復購買次數(shù)為4次,重復購買率為40%。重復購買率越高,則用戶對產品的忠誠度就越高,反之則越低。




三、用戶數(shù)據(jù)指標


ARPU


即每個用戶平均收入。


ARPU=總收入/用戶數(shù)。它注重的是一個時間段內運營商從每個用戶所得到的收入,衡量互聯(lián)網(wǎng)公司業(yè)務收入的指標。ARPU值高說明平均每個用戶貢獻的收入高,但無法反映利潤情況,因為利潤還需要考慮到成本。果每用戶的成本也很高,那么即使ARPU值很高,利潤也未必高。

而用戶數(shù)可以是總平均在線用戶數(shù)、付費用戶數(shù)或是活躍用戶數(shù),不同產品標準可能存在差異。ARPU注重特定時間段內從每個用戶所得到的收入,衡量互聯(lián)網(wǎng)公司業(yè)務收入的指標。ARPU值高說明平均每個用戶貢獻的收入高,但未必說明利潤高,因為利潤還需要減去成本。ARPU的高低沒有絕對的好壞之分,分析的時候需要有一定的標準。ARPU值高說明平均每個用戶貢獻的收入高,這段時間業(yè)務在上升。



新增用戶


既安裝應用后,首次成功啟動產品的用戶


按照統(tǒng)計跨度不同分為日新增(DNU)、周新增(WAU)、月新增(MAU)。新增用戶按照設備維度進行去重統(tǒng)計,如果該設備卸載了應用,一段時間后又重新安裝了該應用,且設備未進行重置,若再次打開應用,則不被計算為一個新增用戶。


新增用戶量指標主要是衡量營銷推廣渠道效果的最基礎指標。新增用戶占活躍用戶的比例也可以用來用于衡量產品健康程度(產品沒有新增和活躍,就進入“絕癥狀態(tài)”)。如果某產品新用戶占比過高,那說明該產品的活躍是靠推廣得來,這種情況非常有必要關注,尤其是新增用戶的留存率情況。

Image title




活躍用戶


既在特定的統(tǒng)計周期內,成功啟動過產品的用戶。除此之外,我們還可以將活躍用戶定義為某統(tǒng)計周期內操作過產品核心功能的用戶(按照設備去重統(tǒng)計)。


活躍用戶是衡量產品用戶規(guī)模的重要指標,和新增用戶相輔相成。如果只看一個指標來定義產品的成功與否,那一定是活躍用戶數(shù)。當然,一般重點關注核心用戶規(guī)模即可。希望用戶每天都使用的應用有新聞APP、社交APP、音樂APP等,其產品的KPI考核指標一般都有日活躍用戶數(shù)這項。但對于某些低頻消費需求和臨時性需求的APP,比如旅游、攝影、工具類等,可能會關注月活躍數(shù),甚至特定周期內的活躍數(shù)。


活躍用戶數(shù)根據(jù)不同統(tǒng)計周期可以分為日活躍數(shù)(DAU)、周活躍數(shù)(WAU)、月活躍數(shù)(MAU)。


DAU(日活):某個自然日內成功啟動過應用的用戶,該日內同一個設備多次啟動只記一個活躍用戶;


WAU(周活):某個自然周內成功啟動過應用的用戶,該周內同一個設備多次啟動只記一個活躍用戶。這個指標是為了查看用戶的類型結構,如輕度用戶、中度用戶、重度用戶等;


MAU(月活):某個自然月內成功啟動過應用的用戶,該月內同一個設備多次啟動只記一個活躍用戶。這個指標一般用來衡量被服務的用戶粘性以及服務的衰退周期。



留存率


既在某一統(tǒng)計時段內的新增用戶數(shù)中再經過一段時間后仍啟動該應用的用戶比例(留存率=留存用戶/新增用戶*100%)。通常重點關注次日、3日、7日、30日即可,并觀察留存率的衰減程度。


次日留存率:即某一統(tǒng)計時段新增用戶在第二天再次成功啟動應用的比例。如果次日留存率達到50%以上,說明這個產品已經是非常優(yōu)秀了;


7日(周)留存率:即某一統(tǒng)計時段新增用戶在第7天再次成功啟動該應用的比例。這個時間段內,用戶通常會經歷一個完整的產品體驗周期,如果這個階段用戶能夠留下來繼續(xù)使用,很有可能成為產品的忠實用戶;


30日(月)留存率:即某一統(tǒng)計時段新增用戶在第30天再次成功啟動該應用的比例。通常移動端產品的迭代周期為2~4周一個版本,所以月留存率能夠反映出一個版本的用戶留存情況,一個版本的更新,或多或少會影響部分用戶的體驗,所以通過對比月留存率能判斷出每個版本的更新對用戶的影響面積,從而定位到類似問題進行優(yōu)化。

Image title



若以上時段的留存率低,會映射出哪些問題?


次日留存率低:說明所針對的用戶群對我們的產品不感興趣;


7日留存率低:說明我們產品的內容質量太差,用戶過了新鮮勁兒之后發(fā)現(xiàn)產品用起來特別枯燥;


30日留存率低:版本迭代規(guī)劃做得不好,功能更新、內容更新、BUG修復、性能等都做得比較差,此時需要重新規(guī)劃迭代內容,不可一錯再錯。


留存率是驗證用戶粘性的關鍵指標,設計師和產品經理通??梢岳昧舸媛逝c競品對標,衡量用戶的粘性和忠誠度。對于一個版本相對成熟的產品,如果留存率有明顯變化,那就說明用戶質量有變化,很可能是因為推廣渠道等因素所引起的。同時,留存率也是產品改版的重要指標,產品體驗越好,越符合用戶需求,則留存率越高。若產品本身滿足的是小眾低頻需求,留存率則選擇雙周甚至是30日進行監(jiān)測。一般來說,留存率低于20%會是一個比較危險的信號。



流失率


指那些曾經使用過產品或服務,由于各種原因不再使用產品或服務的用戶。用戶流失率=某段時間內不再啟動應用的用戶/某段時間內總計的用戶量。流失率和留存率有緊密關聯(lián),流失率高既留存率低,但活躍度不一定高,因此需要綜合分析。也是重點關注次日、7日、30日的流失率。


對于流失用戶的界定依照產品服務的不同而標準不同,對于微博和郵箱這類用戶幾乎每天登錄查看的產品而言,可能用戶未登錄超過1個月,我們就可以認為用戶可能已經流失了。而對于電商產品而言,可能3個月未登錄或者半年內沒有任何購買行為的用戶可以被認定是流失用戶,所以不是每個產品都有固定的流失期限,而是根據(jù)產品屬性而判斷。設計師和產品經理需要找到流失的異常數(shù)據(jù),定位流失用戶的原因,并在下個版本中修復產品中存在的問題。甚至還可以定位到流失的具體用戶ID,通過當時用戶注冊的個人信息進行跟進,我們最常見的就是游戲類產品“召回老玩家”的運營手段。



一次性用戶


既新增日后再也沒有啟動過應用的用戶。


一次性用戶是關鍵的營銷指標,和判斷無效用戶的標準,從中把目標用戶過濾出來。一般劃定的界限是至少超過7天時間才能夠定義是否是一次性用戶。



使用時長


既統(tǒng)計時間段內,某個設備從啟動應用到結束使用的總計時長。


一般按照人均使用時長、次均使用時長、單次使用時長進行分析,衡量用戶產品著陸的粘性,也是衡量活躍度,產品質量的參考依據(jù)。



啟動次數(shù)


既統(tǒng)計時間段內,用戶打開應用的次數(shù)。


重點關注人均啟動次數(shù),結合使用時長可進行分析。用戶主動關閉應用或應用進入后臺超過30s,再返回或打開應用時,則統(tǒng)計為兩次啟動,啟動次數(shù)主要看待頻數(shù)分布情況。



使用間隔


既用戶上次使用應用的時間與再次使用時間的時間差。


使用頻數(shù)分布,觀察應用對于用戶的粘性,以及運營內容的深度。雖然是使用間隔,但是通過計算同一設備,先后兩次啟動的時間差,來完成使用間隔統(tǒng)計,充分考慮應用周期性和碎片化使用的特征。




四、如何獲取這些數(shù)據(jù)?


在工作中可能會發(fā)生這種情況“上文提到的數(shù)據(jù)指標有些看不到”、“不知道怎么看”,最終因為沒有數(shù)據(jù)而無法進行監(jiān)測和分析。這里主要是因為在產品上線前沒有對數(shù)據(jù)進行開發(fā)統(tǒng)計。這部分工作一般是由產品經理去規(guī)劃,開發(fā)來執(zhí)行,設計師也可以提出自己想要監(jiān)測數(shù)據(jù)的需求給到開發(fā),我們把這個規(guī)劃叫做“數(shù)據(jù)埋點”。


埋點其實是對產品的一個可視化健康檢查,貫穿產品的整個生命周期,使產品逐步達到最佳狀態(tài)(需要數(shù)據(jù)結果和產品迭代相互呼應),為未來產品優(yōu)化方向給出指導意見。當然,埋點的目標不同,最終數(shù)據(jù)驗證的結果也會有所不同。


比如,新版本上線,需要驗證用戶行為和功能效果的幾種場景:


(1)新功能是否得到了用戶的使用與認可?本次新增的功能用戶點擊率和活躍度怎樣?

(2)用戶在核心功能的操作路徑上是否順暢?有沒有因為功能按鈕的設計而導致無效點擊增多?

(3)在某個特別的節(jié)日進行了產品內的banner推廣或者促銷,該活動運營的效果如何?新用戶增長是怎樣的?

...


所以說,埋點是互聯(lián)網(wǎng)領域非常重要的數(shù)據(jù)獲取手段。埋點采集信息的過程一般也稱作日志采集。通俗點講,就是在APP或者WEB產品中植入一段代碼,監(jiān)控用戶行為事件。典型的應用場景就是某個運營活動,頁面的點擊量(PV)有多少,點擊用戶數(shù)(UV)有多少,都是用埋點數(shù)據(jù)進行計算的。當然這些信息并不是消費一次就沒用了。通過埋點收集到的信息,可以作為監(jiān)控并通過可視化數(shù)據(jù)呈現(xiàn)出來,幫助產品、設計、運營人員看到產品的長期表現(xiàn),也可以作為基礎原料,進行復雜的運算,用于用戶標簽、渠道轉化分析、個性推薦等等。比如我們用某資訊類產品看新聞的時候,會發(fā)現(xiàn)每次推薦的內容都是上次所點擊的相關類別,這就是通過埋點數(shù)據(jù)獲取的用戶行為習慣,通過數(shù)據(jù)進行個性化推薦。


除了對需要監(jiān)測的特定功能區(qū)做埋點之外,一般大公司也有自主研發(fā)的供內部產品組使用的數(shù)據(jù)分析系統(tǒng),一些關鍵數(shù)據(jù)在上面都能夠實時監(jiān)測到,并有特定的團隊去維護它。其次,現(xiàn)在市場上還有很多數(shù)據(jù)統(tǒng)計工具可以自動監(jiān)測到產品的相關數(shù)據(jù),大多都是付費的,這里就不打廣告了,百度搜索關鍵詞會出現(xiàn)一大堆類似的數(shù)據(jù)監(jiān)測產品。




五、產品階段不同,關注的數(shù)據(jù)也不同


產品階段就是產品生命周期,可分為初創(chuàng)期、成長期、成熟期、衰退期,每個階段的工作權重和數(shù)據(jù)關注點都會有所區(qū)別。

Image title



1、初創(chuàng)期


初創(chuàng)期的重點在于驗證產品的核心價值,通過某種產品或服務可以為特定的人群解決某個問題。這時我們需要關注的關鍵數(shù)據(jù)是目標用戶畫像,同時是第一批種子用戶對產品的使用情況和反饋建議。所以初創(chuàng)期更需要設計師和產品經理去做定性分析(比如用戶訪談),直接確定產品是否滿足了用戶需求、產品有沒有覆蓋到更多的使用場景等。因此產品初期我們可以不用在數(shù)據(jù)分析上投入更多精力。說白了,該階段用戶量較少,用戶行為等數(shù)據(jù)還停留在比較初期的階段,所以數(shù)據(jù)分析的效果不能發(fā)揮到最大化,且價值不明顯。該階段就是先保證產品順利上路,同時要綁定一批種子用戶,解決基本的用戶訴求,讓產品和團隊先生存下來。階段與手段不匹配的情況下,還把某些事情強加上去,這就是“作秀”。



2、成長期


經過了產品打磨的初始階段,產品一般會有較好的留存率,這個時候產品開始進入自發(fā)增長期(成長期)。該階段的產品已經能夠解決用戶的基本訴求了,所以將側重點關注在用戶的生命周期的管理,為產品吸引更多的新用戶來使用(新鮮血液),既拉新和留存,那么我們數(shù)據(jù)關注的重點也要放在拉新和留存上。

拉新要關注推廣數(shù)據(jù)和推薦數(shù)據(jù):


(1)推廣數(shù)據(jù):就是產品以拉新目的所采取的所有推廣運營活動和行為的指標數(shù)據(jù),不同推廣方式(線上+線下)的到達率、觸達面積、點擊率、轉化率、二次訪問率、流失率。比如我們舉辦了一場線下活動,現(xiàn)場實到多少人、哪些是目標用戶、哪些不是目標用戶、有多少人當場試用了我們的產品,又有多少人在活動后下載了產品等等。


(2)推薦數(shù)據(jù):是用戶是否愿意將產品推薦給他人的行為數(shù)據(jù)分析。這里我們在數(shù)據(jù)上可以關注整個分享環(huán)節(jié)動態(tài),比如產品有100個種子用戶,他們中有多少人只是自己用產品、有多少人會分享給朋友、他們的分享行為帶來了多少新增用戶等,這些數(shù)據(jù)會告訴我們產品在用戶心中的位置。


留存則是要做用戶的留存分析:


重點有用戶的次日留存率、7日留存率、30日留存率、日活、周活、月活、產品頁面訪問深度、退出率等等。需要注意的是,這些指標不能單獨監(jiān)測,需要將他們結合起來看。說透了,留存就是要提高目標用戶在核心場景的反復出現(xiàn)頻率和停留時間(核心場景既產品的主要功能、主要盈利模式和用戶最喜歡的模塊)。



3、成熟期

隨著用戶快速增長,產品不斷完善,產品在進入成熟期前后,設計師和產品經理的重心開始從用戶生命周期的前半段(吸引、激活、留存)往后半段(流失、回流)開始偏移并做出相應的產品設計,同時也更關注商業(yè)化行為,既用戶價值(用戶給產品帶來的價值,產品給開發(fā)者帶來的價值)。


這里的用戶價值指的是用戶對公司和產品的商業(yè)價值,既解決產品訴求。和我們經常說的用戶訴求有所不同。該階段我們要根據(jù)用戶的情況進行細分,“保大棄小”,盡可能提升高價值用戶的活躍度,對于低價值用戶可以適當?shù)販p少投入精力。有增長就有減少,所以除了對用戶活躍度的關注之外,還需關注核心場景的用戶行為數(shù)據(jù)和高價值用戶的流失率。


假設我們的產品日活和周活都很高,但是核心場景上的點擊率或是停留時間非常低,核心場景關系到公司商業(yè)目標和價值的實現(xiàn),用戶在這一塊的行為少,要么你的用戶不是目標用戶,要么你的核心場景存在比較大的缺陷讓用戶不滿意。高價值用戶的流失率也是一個道理,都是值得引起我們警惕的數(shù)據(jù)指標。



4、衰退期

每個產品都有一個生命周期,這是受市場因素導致的,此時用戶會逐漸流失(這里說的流失并不是完全放棄我們的產品,而是從降低活躍度漸漸走到消失),既被其它新產品的體驗模式所吸引,所以這時應該更關注用戶流失后使用的產品,分析競品的商業(yè)模式和功能,同時監(jiān)測流失速度,需盡快拓展產品邊界,尋找新的切入點。




六、敲黑板

Image title



1、改版前不放在心上,迭代發(fā)布后才關注數(shù)據(jù)


對于平常就很少關注數(shù)據(jù)的設計師來說,經常在改版前因為專注于界面上的優(yōu)化,而忽略了真實的用戶行為。


真實案例:我們產品中有一個步進器組件,用于客戶選擇相應的天數(shù),且此項為必填項。之前我們內部的溝通結果是提供一個7天的默認值,當然對此默認值是有爭議的,有的同事認為默認10天比較合理,所以為了驗證用戶的操作習慣,我們在上線前對該組件進行了埋點。經過用戶使用過一段時間之后,我們通過數(shù)據(jù)發(fā)現(xiàn)大部分用戶在使用步進器時,點擊“減少”比“增加”的次數(shù)要多,而且一般停留在5天,就這樣我們把默認值從7天優(yōu)化為5天,減少了大部分用戶的2次點擊,并且在類似的業(yè)務模塊內,會記住用戶上次所選的值,從而提高填寫表單的效率。

Image title



雖然只是一個小小的交互優(yōu)化,但足以證明設計師關注產品數(shù)據(jù)不僅能夠驗證設計結果,還能對產品體驗不斷打磨,精細化提升用戶體驗。很顯然,如果沒有此次對數(shù)據(jù)的監(jiān)測和教訓,只會讓我們繼續(xù)活在自己的世界里,永遠也不會在意這個小問題,導致這個組件繼續(xù)復用、濫用,一錯再錯,直到用戶親自給我們提優(yōu)化建議的時候,就已經太晚了。


所以,如果你想讓某個設計方案更貼近用戶或者想對比改版前后的效果,那就需要提前將自己的埋點需求整理成Excel表格,發(fā)給相關的開發(fā)同事,再對照交互原型詳細討論這些埋點,確保雙方理解一致,不至于最后埋點的數(shù)據(jù)不是自己想要的。


下面是我在工作中用到的埋點需求表(用戶行為統(tǒng)計表)和數(shù)據(jù)收集表,大家可以參考使用:

Image title




2、成為一名解決產品問題的設計師


隨著互聯(lián)網(wǎng)行業(yè)的發(fā)展,行業(yè)對我們設計師的要求只會越來越高,從近兩年冒出的UX設計崗、產品設計崗就能感知到。所以,未來的界面設計師一定會更關注產品和數(shù)據(jù),不再是曾經“畫”頁面的團隊底層執(zhí)行者了,了解一些數(shù)據(jù)知識可以將用戶的行為可視化,以便更清晰的了解用戶行為,經過一段時間的數(shù)據(jù)對比,設計師和產品經理可以共同驗證并規(guī)劃后面迭代的方案,預測產品的走向與趨勢。并且通過數(shù)據(jù)分析,可以量化交互方案的效果,作為一名解決產品問題的設計師,可以主動去承擔一些用研工作,化被動為主動。



以上是一些基礎的數(shù)據(jù)指標,希望對你有所幫助。若有來自不同行業(yè)和業(yè)務的產品數(shù)據(jù)指標,歡迎討論交流~



是的,我們距離目標又近了一步,標紅的你都看了嗎?

Image title

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


用大數(shù)據(jù)告訴你什么樣的圖!

資深UI設計者

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

創(chuàng)意是營銷中離消費者最近的環(huán)節(jié),同樣也是最性感、最直接的部分。但為什么我們都看過杜蕾斯海報卻依舊寫不出好文案?一個好創(chuàng)意如何誕生?

近日,阿里媽媽發(fā)布《美妝行業(yè)淘寶首焦創(chuàng)意洞察》(以下簡稱《報告》),試圖通過數(shù)據(jù)洞察的方式幫助品牌商家更懂創(chuàng)意,探討什么樣的創(chuàng)意真正能被消費者買單,怎樣的創(chuàng)意生產能提升運營效率,最終幫助品牌實現(xiàn)生意增長。

以消費者運營為中心,好創(chuàng)意從洞察開始

如果說創(chuàng)意表現(xiàn)是營銷的末端,那么洞察則是營銷的起點,在營銷媒體「傳播體操」看來,創(chuàng)意和洞察更是「術」與「道」的關系。因為有了消費者洞察,才會有推廣策略,從而產生許多創(chuàng)意。

創(chuàng)意能讓品牌與用戶實現(xiàn)更好的溝通,但數(shù)字化時代,媒體形態(tài)多元化、觸點碎片化,對創(chuàng)意提出了更高要求。

以 618 這類大型營銷節(jié)點為例,阿里媽媽此前洞察到,618 消費者是以女性為主的 1-2 線高學歷高消費家庭用戶,90 后年輕人群為次主流消費群體。消費人群老齡化與年輕化并行,渠道下沉趨勢顯現(xiàn)。

因此在創(chuàng)意和營銷上,品牌方應重點關注 4 個人群:崛起的新生代,承載主力核心的小鎮(zhèn)青年、城市青年,以及正在興起的中老年人群。懂得消費者需求及市場變化,始終圍繞以消費者運營為核心,才能讓創(chuàng)意發(fā)揮更大的營銷價值。

此前,阿里媽媽基于行業(yè)推出系列洞察報告,此次首次發(fā)布創(chuàng)意領域的營銷洞察,則進一步豐富洞察維度,持續(xù)輸出營銷洞察能力。

算法解決「審美打架」難題,多元素組合產生好創(chuàng)意

這或許也讓品牌、商家和設計師們曾經的矛盾被解決。此前,在面對銷售的需求時,視覺設計的結果需要為用戶下單購買、產生交易服務,往往會與審美「打架」?!秷蟾妗吩噲D減小品牌方和設計師的認知溝壑,通過解讀創(chuàng)意圖片背后的運營邏輯,為好的創(chuàng)意提供數(shù)據(jù)基礎。

《報告》聚焦美妝行業(yè)的展示類營銷創(chuàng)意。通過對海量創(chuàng)意樣本的算法支持及數(shù)據(jù)分析,《報告》分析了淘寶首頁焦點圖(以下簡稱「首焦」)這一表現(xiàn)創(chuàng)意的關鍵區(qū)域,挖掘創(chuàng)意特征對點擊效果的潛在提升效應。

《報告》發(fā)現(xiàn),淘寶首焦曝光點擊后的流量聯(lián)動效應明顯,首焦上的點擊進店能夠有效提升消費者在其他渠道上的進店概率,而在資源位與定向方式固定的前提下,創(chuàng)意設計往往是影響點擊率的第一要素。

從數(shù)據(jù)上進一步看到,首焦點擊人群較非首焦點擊人群,在后續(xù)其他觸點上的進店概率會高出一籌,尤其在美容護膚/美體精油和彩妝類目分別提升了 9.1 倍和 11.2 倍。這意味著,首焦投放有助優(yōu)化全店流量獲取能力。若需完成拉新任務,可以考慮首焦投放與其他營銷方式組合。

具體來看,《報告》逐一拆解了首焦圖片的創(chuàng)意構成──調性、色調、標示、文本內容、商品數(shù)量、人像。在控制創(chuàng)意之外的潛在影響因素下,阿里媽媽透過洞察報告還原創(chuàng)意質量的高低對營銷效果的影響差異,從而得出最優(yōu)的組成方式。

好創(chuàng)意帶來生意增長,阿里媽媽提供數(shù)字化創(chuàng)意解決方案

不過,在大家積極探索新內容形態(tài)的當下,為什么靠圖片傳達信息依舊重要?在阿里媽媽營銷研究中心高級行業(yè)研究專家蘇寅看來:「從展現(xiàn)形態(tài)上來看,圖片創(chuàng)意依舊是品牌方與用戶溝通的重要抓手。作為基礎的信息媒介,圖片與視頻類內容深度聯(lián)動,功能互補,形成品牌與消費者的立體化溝通?!?

「互聯(lián)網(wǎng)女皇」瑪麗·米克爾發(fā)布的《2019年互聯(lián)網(wǎng)趨勢報告》也佐證,雖然短視頻直播增長迅速,但使用圖片成為越來越重要的溝通方式,基于圖片的通訊也得到計算機視覺及人工智能的推進。而在廣告營銷領域里,圖片創(chuàng)意的價值也正在被逐漸受到關注。

有數(shù)據(jù)支撐的創(chuàng)意洞察后,數(shù)字化營銷時代也需要更數(shù)字化的創(chuàng)意解決方案。

隨著報告的發(fā)布,阿里媽媽將攜手旗下平臺創(chuàng)意中心,為品牌和商家提供數(shù)字化的創(chuàng)意解決方案。作為國內領先的提升營銷效率的全域創(chuàng)意解決方案平臺,創(chuàng)意中心接下來也計劃把創(chuàng)意黑科技和創(chuàng)意資產的能力,與生態(tài)中的各類伙伴進行合作,賦能整個營銷創(chuàng)意行業(yè)。

除此,阿里媽媽也從產品功能、營銷策略上提供賦能。

旗下展示營銷產品智鉆在 618 前實現(xiàn)升級,在展現(xiàn)形式上首次突破淘寶首焦靜態(tài)圖片形態(tài),以創(chuàng)意元素組件化的形式,創(chuàng)新支持微動效、倒計時、店鋪回頭客等組件。品牌商家因此有了更多展示信息增益的可能,可提升創(chuàng)意對消費者的心智傳達和溝通效率,同時也能提升轉化效果。

附完整版報告內容:




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

vue父子組件互相傳值

seo達人

如果您想訂閱本博客內容,每天自動發(fā)到您的郵箱中, 請點這里

一、父組件給子組件傳值

1、父組件調用子組件的時候,綁定動態(tài)屬性

/*傳值可以是值“title”、是方法“run”、是組件“this”*/
<v-header :title="title" :run="run" :home="this"></v-header>
1
2
2、在子組件里面通過props接受父組件傳過來的數(shù)據(jù)

<script>
    export default{
props:['title','run','home']
}
</script>

二、父組件主動獲取子組件的數(shù)據(jù)和方法

1、調用子組件的時候定義一個ref

<v-header ref="header"></v-header>
1
2、在父組件里面通過以下方式獲取屬性和方法

this.$refs.header.屬性
this.$refs.header.方法

三、子組件主動獲取父組件的數(shù)據(jù)和方法

this.$parent.數(shù)據(jù)
this.$parent.方法

四、非父子組建傳值

1、新建一個js文件 然后引入vue 實例化vue最后暴露這個實例

VueEvent.js

import Vue from 'vue';
var VueEvent = new Vue();
export default VueEvent;

2、在要廣播的地方引入剛才定義的實例,并進行廣播

home.vue

<script>
import VueEvent from './VueEvent.js';
    export default{
        methods:{
            emitNews(){
                /*廣播數(shù)據(jù)*/
                VueEvent.$emit('to-news',this.數(shù)據(jù))
            }
        }
}
</script>

3、在要接收數(shù)據(jù)的地方接受廣播

news.vue

<script>
import VueEvent from './VueEvent.js';
    export default{
        /*在生命周期函數(shù)里寫,編譯的時候就調用*/
        mounted(){
            /*接受廣播*/
            VueEvent.$on('to-news',function(data){
                console.log(data);
            })
        }
}
</script>


日歷

鏈接

個人資料

藍藍設計的小編 http://sillybuy.com

存檔