<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          首頁

          優秀app改版欣賞

          資深UI設計者


          ● 京東金融 App 首頁三大改版


          3.x 版本到馬上上線的 4.x 版本,公司的戰略方向以及產品運營方向都在不斷的變化(有接觸過京東金融 App 的人都知道視覺變化很大)。作為公司的移動端產品,既要滿足用戶體驗和需求,又要滿足內部業務的擴展。所以我們要不斷優化各種布局和細節,把用戶體驗和內部需求做到最好。



          3.X 版本是我接首頁優化的第一個版本。改版期間我們經歷了很多,除了本身業務以外,更重要的是我們發現之前首頁有很多問題。其實優化產品最基本的方法就是發現了一些問題,然后去解決這些問題。問題可能是產品問題、業務需求擴展、運營需求滿足,最后才是體驗和視覺。這些問題能得到解決產品就能得到優化。


          以賬戶為中心是當時產品的主要方向,整體都在強調財富管理。所以之前的界面在賬戶為主和業務擴展上都存在很大問題,一是業務拓展存在局限性,二是賬戶感不強。


          經過一大堆方案和設計圖的轟炸,最終確定了大的方向,突出理財金額和業務和信貸業務。把一些數字突出放大,讓用戶打開產品既能看到自己想看到的東西。賬戶感的體現我們把數字和一些文字說明當成首屏最主要的東西,少一些運營,少一些 banner 。就像是在銀行打出的紙質賬戶信息,上面很少會出現廣告。


          ▲ 還是之前的方法,經過上線一段的時間去發現問題。隨著業務和功能的增多,原來的布局已支撐不了公司方向的支持這是之一。之前的視覺也有一些缺陷,進入 App 整體看上去沒有重點的,純白色很干凈但是也沒有能跳出來吸引眼球的東西,也不能把重要業務區別與其他業務。

          這次增加了一些產品本身頻次的功能,如掃一掃、簽到、每天領券等。還有怎么樣能突出重點業務的展示,讓用戶在視覺局部上有所重點。業務的擴展性通過左右橫滑來實現。


          ▲ 怎么樣能把多量的業務,重新布局到有限的界面里,而且不能降低用戶的使用體驗,是我們這一版要解決的問題。就是化繁為簡。

          這次我們把業務場景劃分成「賺錢」「花錢」「借錢」,相對應是「理財」「白條購物」「現金借貸」。使用三個Tab 簽和最簡單的布局方式來排版。用戶理解相對也會變的容易,界面整體看起來也簡單明了。


          首頁的改版看似簡單,其實背后有很多的付出。不斷的優化討論、不斷的視覺方案,我們不斷在尋找新的突破,希望能讓各個方面都達到最大效能。



          ● 理財日歷

          「理財日歷」是整合用戶關于所有金融業務的,按照時間線索智能提醒和自動完成的一款產品。

          · 產品目標:幫助用戶記錄金融事件和跟錢相關的事件,例如理財到期、白條還款事件、生活繳費事件等等。一條     時間線可以把用戶所有的事件聯系起來的。讓用戶把時間用在更重要的事情上。

          · 產品關鍵性詞語:時間、自動記錄、提醒、設置自動完成



          當我們進入 App 時,需要進行很多不同的操作,進入到不同的業務線頁面才能完成我想要做的事情。這時整合業務聚合內容就變的很重要。需要有一個平臺把跟用戶強相關的金融事項和其他事項整合,這樣就不用花費很多時間來處理各種事件。

          日歷是一個強時間線的用戶固有思想形態,我們需要把除了基礎的時間、記錄事件和日常提醒功能做好外,還要讓用戶習慣這里面有跟我理財相關的事項。針對使用產品用戶的特征,在視覺布局上不能難以接受,日歷主要的時間、每天事項、后續事項查詢和增加事項都要合理排布。


          為了增加日歷的整體氛圍,除了時間的排布,我們為每一個月和每一個節氣增加了插畫。每一條信息的分類都用 icon 表示,突出強弱,增加氛圍。


          日歷添加事項和設置頁面,以進度的感覺讓用戶去更好的完成事項的設置。推薦事項也是用戶最常用的、最容易跟時間所對應的事項。



          日歷的分享模塊是很重要的一個細節,我們希望它能更好的去傳達這是一款有溫度的產品。它也是對外發聲的一個利器。

          怎么樣才能激發用戶分享的欲望呢,用戶打開界面的分享動機是什么?我們知道用戶分享有幾點:有用的、有趣的、相互比較、用戶認同等等。

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加微信ban_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~
          希望得到建議咨詢、商務合作,也請與我們聯系。 

          作者:程大專 來源:站酷

          分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。 

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
          UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          秩序之美-淺析柵格系統

          資深UI設計者

          前言

          現如今隨著設備尺寸的多種多樣,產品在設計過程中需要適配到更多尺寸,布局方案與柵格系統的搭配使用,可以很好的做到跨平臺跨尺寸適配,極大的提升設計效率。之前有小伙伴分享過適配選型的文章中也提到過柵格,大家可以回顧一下【Web產品的適配設計選型】。


          其實,絕大多數的設計師都知道柵格很重要,市面上很多企業級系統也都在用柵格系統去規范化信息內容的排版布局,但很多設計師直接面對結論大多是一知半解,自己做設計時有些無從下手。


          作者瀏覽了大量文章結合工作中的經驗總結分享給大家,希望能幫助理解柵格系統的本質,并能舉一反三應用在產品設計中,首先從基礎的柵格系統解析開始吧。

          文章概覽

          Chapter One 柵格的由來

          最早的柵格概念,來源于平面設計中的“網格”,早在1692年,新登基的法國國王路易十四不滿于法國當時印刷水平,命人成立了管理印刷的皇家特別委員會。旨在設計出科學的,合理的,重視功能性的新字體。委員會由數學家尼古拉斯加宗(Nicolas Jaugeon)擔任領導,以羅馬體為基礎,采用方格為設計依據,每個字體方格分為64個基本方格單位,每個方格單位再分成36個小格,這樣,一個印刷版面就有2304個小格組成,在這個嚴謹的幾何網格網絡中設計字體的形狀,版面的排版,試驗傳達功能的效能,這是世界上最早對字體和版面進行科學實驗的活動,也是柵格系統最早的雛形。再后來,20世紀初,平面設計師們發現通過維持視覺秩序,能使版面更加清晰有效地傳遞信息,由此便逐漸演變出一種平面設計的方法,直到20世紀40年代后期,第一次出現了使用網格進行輔助設計的印刷作品。由瑞士設計師大師Josef Müller-Brockmann(約瑟夫·米勒-布羅克曼)所著的《平面設計中的網格系統》一書,自1961年出版以來暢銷至今,對設計界有著深遠的影響。史稱Swiss Typography Movement (瑞士新浪潮平面設計運動),后來成為全球風靡的International Typographic Style (國際主義設計風格) 。


          Chapter Two 柵格是什么

          簡單來說:柵格是通過規則的網格陣列,形成穩定的基礎框架,來規范界面中模塊的布局與信息元素的分布,輔助設計師組織信息的工具。前面講到UI設計中常用的柵格系統是從平面網格系統中發展而來,柵格與網格的本質其實是相通的。那么有同學會問,兩者區別在哪呢?平面設計中【網格】應用的媒介一般為固定的紙張規格,寬度和高度都是固定的,網格的劃分方式是一個個等分的方格。UI設計中【柵格】寬度受設備寬度變化而變化,高度由內容多少來決定。因此設計時只需制定縱向的分割規則,以規范縱軸方向內容的對齊、間隔等元素的排布,這也是我們看到柵格往往都是一列一列呈現的原因。

          Chapter Three 為什么使用柵格

          • to用戶
            內容布局的規律性,減少了用戶的認知成本:
            柵格一定程度上從設計師的角度定義了對齊關系,留白關系,圖文的比例分割關系等排版中重要部分的限制規則,幫助我們更好的執行設計,輸出更具有平衡和感秩序感的版面,清晰的頁面信息展現,有利于提高用戶的閱讀和瀏覽效率,減少認知成本。
          • to設計師
            提升決策效率與設計輸出的統一性:
            對于較大的團隊,設計師使用柵格系統能夠降低決策成本,采用一套統一的標準來對設計師進行約束和高效協同,讓設計師快速定位通用規則并執行設計,提高設計師的決策效率,規范設計產出的質量。同時也避免了各式各樣頁面出現的混亂場面,當存在多業務線共用同一系統規范或者多設計師協作設計項目時,柵格系統利于幫助加強設計一致性,統一輸出標準。
          • to開發
            提高設計還原度,減少解釋成本:
            在與開發側對接協作過程中,我們有一套自上而下的有規可循的設計規律,且規則計算的原理與開發習慣保持一致,能避免細節的反復溝通,提高開發的設計還原度,減少不必要的解釋成本。
            此外柵格同樣利于設計師和開發人員對組件和模塊的復用,進一步提高協作效率。
          • to響應式
            更加規律性、合理性的實現自適應:
            現如今多屏設計是商業設計中不可或缺的一部分,響應式設計自然也已成為設計中必不可少的一環,柵格系統的建立,可以讓響應式布局變得有規可循,兼容不同的設備尺寸,更加規范合理的完成頁面在多平臺多尺寸下的自適應設計。



          Chapter Four 柵格的構成要素

          • 網格(Gird):
          • 列(Column)
          • 水槽(Gutter)
          • 邊距(Margin)
          • 柵格總寬(Container)
          • 容器盒子(Col-n)

          市面上各系統對于柵格的名詞描述各有不同,新手往往會看的越多,越迷惑,其實大可不必糾結具體叫法上的細微差異,萬變不離其宗,理解其本質表達的意思和柵格的結構原則即可,下面會對這些基礎名詞進行一些解釋。


          1. 網格(Gird):最小單元-8像素原則

          網格(Gird)的基本構成就是單元格,由格子組成網,形成網格。最小單元格是界面的單位基礎,所有界面元素都按照這個基礎單位布局分布,它對于創造性的決策具有重要的指導意義。

          通常,我們利用 8 作為最小單元格建立網格。

          使用 8 的倍數來定義模塊的間距與元素的尺寸。

          那么為什么是8,而不是別的數字?原因如下:

          a.偶數思維:8作為偶數,能適應市面上絕大多數設備屏幕,更為普適。在輸出各種倍圖時也能保證尺寸不出現奇數以及0.5、0.75等次像素的出現(iOS導出1、2、3倍圖,Android導出1、1.5、2、3、4倍圖均為偶數)。

          b.規律性:所有元素以8像素為步進單位,利用8或8的倍數規范元素和間距大小,(例如使用4、8、16、24、32等和8具有規律關系的數字)有規可循。

          c.節奏感:相比于6、10 等數字,以8為單位,在視覺感受上既不顯得過于瑣碎,也不會因為間隔太大而顯得內容分散,更容易保證頁面效果的協調性。

          d.目前市面上眾多開源代碼也都以8的倍數作為默認設計大小,可行性已經得到多輪過驗證,設計師在與開發對接過程中對頁面有較為統一的理解,有效降低合作成本,在設計還原度上也更有保障。


          劃重點:注意這里給的是建議尺寸,最小單位的制定還需要結合具體的使用場景來決定,我們以解決問題為最終目的。



          2.列(Column)

          (Column)的作用通常是用來對齊內容,列也是柵格的數量單位,大家可以理解設置柵格數量就是設置列的數量,如 12 柵格就有 12 列、24 柵格就有 24 個列,通過控制列數,可控制界面排版的呼吸節奏,列數越多,內容排布可以越精細,也容易分割的太細碎,反之列數越少,內容排布也越容易稀疏松散。


          3.水槽(Gutter)

          理解了列,再來說水槽(Gutter),水槽就是列于列之間的分隔間距,這里水槽的作用是幫助區塊內容做分隔,需要注意,水槽內不可放置任何板塊內容。

          水槽寬度在一定程度也會對界面的風格有影響,水槽越大,留白越多呼吸感越好,適合一些輕松的內容瀏覽類頁面展示,相反水槽越小,留白小內容緊湊,適合一些嚴謹的工具型面板類內容展示,各有利弊,大家可根據設計目標權衡設計策略。


          4.邊距(Margin)

          邊距(Margin)有時候也會被叫安全邊距,是指設計內容距離屏幕邊緣的距離,顧名思義,安全邊距內是禁止放內容的,可以類比為平面設計里的出血概念,主要用來控制屏幕核心內容的展示邊界。

          邊距值越小,界面核心內容的有效利用空間越大,布局相對來說會比較寬松,相反,邊距值越大,兩邊留白大呼吸感強,但有效利用區域相對小,內容排布相對更緊湊,也可能會容易擁擠。這里建議界面的邊距可以根據屏幕尺寸做適配,通過斷點響應變化,這樣可以更好的保證在不同屏幕上界面呼吸節奏都相對舒適。


          5.柵格總寬(Container)

          柵格總寬(Container)就是指頁面柵格系統的總寬度,即所有列寬加水槽寬度加安全邊距的總和。

          6.容器盒子(Col-n)

          建立好基礎柵格之后,我們可以根據內容去定義一塊內容占用幾個列的寬度,我們把這個區域理解為容器盒子,容器用來集合下級組件,也可以是對文字、圖片、按鈕等多個復雜元素的集合,按照頁面結構可以由小到大依次從組件 – 容器 – 模塊 – 頁面 – 場景進行組合拼裝最終形成設計方案。

          Chapter Five 如何制定柵格系統

          定義柵格系統之前,我們先了解熟悉下計算公式

          如果你已經理解了前面的柵格要素的作用和用法,那么接下來就可以按照以下步驟在自己的畫板上創建柵格系統。

          1.確定柵格區域

          注意柵格區域不一定是畫布的全部區域,我們可以先將頁面按照功能模塊劃分為全局控制層、內容層、背景層、臨時層。通常我們大多是對內容層進行柵格化。

          通常web端常用的三種布局如下圖所示,建議按照實際使用場景靈活的選擇布局形式后,再確定需要柵格化的區域。


          當我們遇到一個wed端的內容瀏覽類網站,一般會采用上下布局,通常會基于 1920 或 1440 尺寸作為設計稿寬度,但由于需要適配主流尺寸中的最小尺寸,核心內容展示會控制在 1024(這里不是絕對值,不同產品根據實際情況數字會有上下浮動),其他空白區域即為安全邊距,這是web網頁中常見的一種適配方案。


          2.選擇柵格列數

          12柵格和24柵格是目前比較常見的列數結構。選擇使用哪種柵格結構,取決于產品對設計的要求。
          12柵格:當產品涉及到多平臺發布,內容較為簡單,單個容器盒子內信息面積較大時,可以考慮采用12柵格來兼容。

          24柵格:如果當前產品發布于pc,內容較多,且功能繁雜時,則需要更靈活的柵格系統去規范信息內容的布局,這時我們可以考慮采用24柵格,國內較為主流的企業級設計系統 Ant Design采用的就是24 柵格。

          3.定義水槽(Gutter)和邊距(Margin)

          前面講到過在產品 UI 中邊距(Margin)的值對視覺的呈現的影響,這里就不做過多贅述。這里科普一個叫做“Rem”的計算單位,(Rem 是開發常用的計算方式,設計和開發基于同一套原理進行設計,在協作過程中能夠極大提高協作效率,并且減少維護成本),通常制定柵格系統時,我們可以用1Rem的值來定義水槽(Gutter),它的靈活最強,可作為柵格系統的基準值。而邊距(Margin)的值通常就是1.5Rem 或者 2Rem?;诔S玫?倍或者8倍間距系統規范,一般最為常用的基礎間距為 4,8,16,24,32,48,我們可以在這些基礎值里去選擇匹配產品的柵格系統基準值。

          通過Rem基準值,我們還可以輕松得到一套匹配的間距系統,以1Rem=16為例,可以得到以下間距系統:

          掌握以上要點,即可get一套匹配產品設計要求的柵格系統。


          Chapter Six 柵格系統的應用與響應式


          固定柵格

          簡單來講,在固定柵格中,頁面拉伸時,元素的尺寸和間距都是固定的,頁面每到一個斷點尺寸,就會減少或增加最邊緣的內容元素。體現到柵格上,頁面寬度變化過程中未達到預設臨界值時,柵格系統本身的列與水槽寬度不變,頁面所有元素布局也不會有變化,直到到達臨界值,柵格列數會隨著瀏覽器寬度,增加或減少,邊緣內容進行換行顯示

          典型案例:Dibbble、Behance


          優點:

          適配規則簡單,實現成本低

          缺點:

          適用范圍小,拉伸過程邊距不是固定的,大多只適用于內容居中的上下布局類型產品

          一個頁面盡量只有一種卡片尺寸,否則邊距不統一

          卡片尺寸固定,在過大或者過小的屏幕尺寸上,比列容易顯得不協調


          流動柵格

          流動柵格中頁面邊距和內容間距固定不變的,頁面內容隨著頁面尺寸變化而變化,可以是增刪邊緣元素展示個數,可以是調整元素展示比例,最終效果是始終保持內容卡片橫向充滿屏幕可用空間,這種彈性布局能更好的適應不同分辨率體現到柵格上,頁面邊距和水槽寬度是固定不變的,列數在適配過程中也是固定不變的,拉伸過程中的實際列寬是通過柵格區域的百分比縮放而來,這時列的寬度就不一定最小單位的倍數了。

          典型案例:百度圖片、花瓣


          優點:

          可以兼容不同尺寸的卡片混排

          頁面邊距也能保持一致,拉伸過程中拉伸過程中過渡平滑,不顯得突兀

          缺點:

          頁面伸縮時,不可避免的會出現卡片尺寸忽大忽小



          混和柵格

          在實際項目中,流動柵格和固定柵格的組合使用也是比較常見的做法,一些后臺系統設計、工具型的界面設計會較經常使混合柵格的形式, 混合布局既有固定的內容寬度,也有流動的寬度,靈活性更高,對與內容復雜的產品十分友好

          典型案例:Ant Design Pro


          優點:

          容器承載內容靈活性高,不同分辨率下都能達到較為理想的視覺效果

          缺點:

          規則復雜,實現成本高


          Chapter Seven 柵格系統使用要點

          最后再來總結下柵格系統在使用過程中一些使用要點:

          1.內容區塊的定義要從列開始到列結束,可以任意分割,比如 6×2、3×4、4×3。

          2.水槽內禁止放置任何內容元素

          3.安全邊距內禁止放置任何內容元素

          4.除非特意設計,否則不要在列之外區域放置元素

          5.只要框架(父級)元素對齊柵格,原子組件(子級)可以不完全對齊列

          6.對于柵格的區域選擇,可以根據實際業務場景靈活應用,不一定非要整個畫布區域

          7.可以使用嵌套柵格,我們通常會用一套柵格標準來全局控制整個界面,但不乏有些產品中會出現一些典型模塊的內容密度和全局柵格的匹配度不高,這種情況我們可將特定區域單獨定義柵格值,嵌入到總的柵格系統中結合使用。


          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系

          作者:沙拉   來源:站酷

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          醫療行業優秀設計分享之一:app設計界面欣賞

          資深UI設計者

          醫療小程序Redesign
          醫療小程序Redesign
          醫療小程序Redesign
          醫療小程序Redesign

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          元宇宙正在被帶入流量的陷阱

          資深UI設計者

          元宇宙的爆火讓許多企業都將目光瞄準這片領域,并試圖從中分一杯羹。然而值得注意的是,元宇宙不能被當作流量的工具,這種發展趨勢是應當被避免的。本篇文章里,作者就元宇宙和流量的關系發表了他的看法,一起來看一下。

          人們對于流量的迷戀并不僅僅只是在短時間內就可以消除的,正如人們對于不同事物的喜好,正如人們約定俗成的習慣。

          對于流量,同樣如此。雖然我們一直都在說流量時代行將終結,互聯網時代終會過去,但是,人們對于真正造就這一切的流量卻有著無法抗拒的好感。于是乎,所有的行為,所有的動作都在圍繞著流量展開,縱然是那些頭部的巨頭亦不例外。

          從某種意義上來講,互聯網巨頭們對于流量的焦慮要比那些中小型的玩家要強得多。正如龐大的流量帶給了互聯網巨頭們絕對的優勢一樣,一旦流量的優勢不再,一切都將從頭開始。

          于是,我們看到了幾乎所有的互聯網巨頭在將維持現有的流量地位,特別是維持現有的優勢的流量地位當成是主要目標。有人選擇用新技術,有人選擇用新模式,盡管名頭不同,但是,底層邏輯卻是相通的。

          曾經,元宇宙的出現讓點燃了人們的熱情,很多人認為,元宇宙將會給我們帶來一個全新的時代。

          沒錯,元宇宙的確可以給我們帶來一個全新的時代。但是,如果我們僅僅只是將流量看成是元宇宙的終局,甚至將元宇宙看成是一個維持自身流量地位的工具和手段,未免有些太過短視與淺薄了。然而,正是這樣一種短視和淺薄的事情,卻正在元宇宙身上上演著。

          01

          很多人僅僅只是將元宇宙看成是一種營銷的新方式,而他們的底層邏輯便是借助元宇宙來盡可能多地獲得、激活并轉化流量;很多人僅僅只是將元宇宙看成是一種工具和手段,而他們的底層邏輯便是元宇宙盡可能地維持、堅守并塑造業已形成的流量優勢;很多人僅僅只是將元宇宙看成是一種概念,而他們的底層邏輯便是借助元宇宙獲得資本的關注,贏得資本的青睞……

          很顯然,無論是以上的哪一種模式,我們都可以非常明顯地看出流量在其中所扮演著的重要作用和地位。不可否認的是,哪怕是在元宇宙業已非?;鸨臅r候,依然加持元宇宙的概念,還是存在著巨大的機會的。

          但是,如果我們僅僅只是將所謂的加持元宇宙看成是一個概念本身,抑或是僅僅只是將加持元宇宙的終極目標看成是流量,未免有些太過俗套了。

          可以確定的是,元宇宙的確可以給人們帶來一種完全有別于互聯網的體驗,很顯然,這種方式的確可以激活流量,留存流量,甚至是獲取流量。但是,如果我們僅僅只是將元宇宙的功能和作用局限在這個層面上,那么,元宇宙的功能和作用非但無法得到最大限度地發揮,甚至還將會把元宇宙帶向死胡同里。我認為,流量之外的元宇宙,才是真正意義上的藍海。

          流量之外的元宇宙,才是我們真正應該思考和關注的地方。同互聯網一樣,流量之外的元宇宙,其實是一個借助元宇宙的方式和方法,對行業進行深度影響與改造的過程。在這個方面,元宇宙其實是有著自身的天然優勢的。

          02

          提及元宇宙,我們首先想到的是各式各樣的新技術,有大數據,有人工智能,有物聯網,有區塊鏈,可以說,元宇宙就是一個新技術的聚合體。

          試想一下,如果這個新技術的復合體,僅僅只是圍繞著流量這個核心,那么,它的功能和作用是無論如何都無法得到最大限度的發揮的,而且它的作用和功能也是極大地低估的。

          然而,正是這個對元宇宙并無任何益處的方向,現在正在被越來越多的玩家所推崇,所加持。

          無論是Meta,還是微軟,甚至是其他的一些玩家,無一不是如此。當元宇宙的終極目標僅僅只是流量的時候,它僅僅只是互聯網模式變換了一下技術,改變了一下門面,本質上并未真正改變以流量為終局的發展模式。

          如果真的如此,那我們還不如將元宇宙時代看成是互聯網時代罷了,元宇宙時代不過是一種互聯網的進化罷了。或許,這才是劉慈欣之所以會對元宇宙擔憂的關鍵所在。

          我想,這才是元宇宙玩家真正應該規避的地方。對于經歷了互聯網時代的洗禮的人們來講,我們應該明白僅僅只是以流量為終極追求的元宇宙將會走向何方,所以,當我們剛開始探索元宇宙的時候,就應當規避掉目前的這種發展怪圈,跳出流量的牽絆,站在更高的維度來看待與探索元宇宙的發展新方向。

          將元宇宙的目光更多地投向流量之外的深海,尋找流量之外的發展新方式,開啟元宇宙的新紀元,才是我們真正應該去思考和關注的地方,才是元宇宙真正能夠發揮出自身效力的地方。

          當元宇宙規避掉了流量的陷阱,開始將目光投向產業的藍海,它所帶來的將不再僅僅只是一種由外而內的淺層的體驗上的提升,而是帶來的是一種由內而外的深層次的產業和生活方式上的提升。當元宇宙有了產業的支撐,并且真正以產業來建構全新的流量運行邏輯,而不是以營銷和體驗啦建構全新的流量運行邏輯的時候,元宇宙才算是真正進入到了屬于它的時代。

          03

          元宇宙,一片熱火朝天。然而,在這樣一片熱火朝天的背后,我們聞到的依然是熟悉的味道。所有的元宇宙玩家都在將目光聚焦在流量上,全然沒有顧及到流量之外的領域。當元宇宙的功能和作用僅僅只有流量,那么,它的作用是被極大地低估的。以一種全新的視角來看待元宇宙,并且真正找到流量之外的發展新模式,或許才是元宇宙真正可以給我們帶來新的想象力的關鍵所在。


          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          資深UI設計者

          為把握文化產業未來創新發展趨勢,持續推動我國文化產業高質量發展,本文對2021年度我國文化產業“十二大”熱點現象進行了梳理盤點。跟著作者一起來看看吧。

          文中熱點總結得到中國人民大學文化產業研究院、中國民營文化產業商會、騰訊文旅產業研究院等相關專家學者的意見指導,并得到新榜(上海看榜信息科技有限公司)對“年度文化產業熱點關鍵詞的傳播力和影響力”的大數據分析支持(對閱讀數、收藏數、點贊數、互動率、評論數及播放數等維度進行匯總整理):

          1.  元宇宙,互聯網及文化產業的下一個成長空間
          2. NFT,文化產業新模式
          3. 文化振興鄉村,煥發鄉村文旅新活力
          4. 數字文化,構建文化產業新生態
          5. 傳統文化“活化”,彰顯文化自信魅力
          6. 虛擬數字人,創造偶像文化新經濟
          7. 直播電商,后疫情時代的常態消費模式
          8. 游戲電競,助力游戲產業高速發展
          9. 沉浸式娛樂,文化場景的創新熱點
          10. 亞文化“破圈”,Z世代引領新消費浪潮
          11. 快文娛當道,年輕一代的文化消費新主流
          12. 私域流量,品牌營銷新陣地

          一、2021年我國文化產業發展的重大影響因素

          1. 疫情防控常態化

          自2020年新冠疫情發現以來,疫情在全球快速傳播,重挫了全球經濟發展,對各個國家和地區造成了不同程度的影響。根據世界衛生組織的官網統計數據,截至2021年12月29日,全球累計確診病例2.8億例,死亡540萬例。按聯合國人口基金會發布的《2021世界人口狀況》的全球人口75.97億計算,全球新冠疫情單位人口感染率約為37,即全球平均每37人中有1人確診新冠肺炎。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          全球新冠疫情(截至2021年12月29日)

          數據來源:世界衛生組織官網

          新冠疫情對全球和全國的文化產業產生了前所未有的影響,不斷改變著文化產業發展的產業邏輯和商業模式。

          受疫情持續影響,2021年文化產業發展趨于緩慢,尤其是線下文化消費受到疫情嚴重沖擊,大量企業面臨業績下滑、經營困難、人員流失等窘境。

          但隨著文化與科技的深度融合,疫情之下,云演出、云會展、云觀影等“云經濟”的產業地位不斷提升,數字影視、線上社交、電子競技、直播購物等細分領域增長迅速,進一步加快了文化產業的數字化轉型升級,同時促使文化產業與科技、商業、零售、制造、服務等領域進一步融合。

          2. 數字文化深化“上云用數賦智”

          在疫情防控常態化、科技不斷發展、人民對美好生活需求日益提高的背景下,數字技術發展深刻地改變了人們的娛樂方式,大眾消費數字文化產品和服務的頻次越來越高,尤其是年輕人對于應用最新技術、新鮮度和體驗感強、極具創意和時尚潮流的數字產品青睞有加。

          隨著虛擬現實、大數據、區塊鏈、全息成像、裸眼3D、人工智能等高新技術的加速應用,數字文化產業取得了爆發式增長,行業內生動力不斷增強。

          根據西方發達國家經驗,文化消費占消費總量比重約30%。根據2019年的數據,我國人均文化娛樂消費支出僅占消費支出的4%,可見數字文化龐大的消費市場剛剛起步,未來有非常廣闊的發展空間。

          3. 國家鄉村振興戰略

          2021年作為“十四五”開局之年,中央一號文件《中共中央 國務院關于全面推進鄉村振興加快農業農村現代化的意見》發布,國家鄉村振興局正式掛牌成立,國家農村工作的重心從精準扶貧全面轉向鄉村振興,而鄉村振興的重中之重在于產業振興。

          我國鄉村擁有豐富的歷史文化名鎮(村)、傳統村落、民族村寨、農業文化遺產、非物質文化遺產等文化和旅游資源,文化振興鄉村成為促進鄉村新產業、新業態提質升級發展的重要抓手。

          “十四五”期間,文化產業將進一步融入國民經濟主戰場,尤其在服務鄉村振興等國家重大戰略的落地方面將發揮更為重要的支撐和帶動作用。

          二、2021年度我國文化產業“十二大”熱點現象盤點

          1. 元宇宙,互聯網及文化產業的下一個成長空間

          “元宇宙”來自于英文Metaverse,最早起源自美國小說家Neal Stephenson在1992年出版的科幻作品《雪崩》,總體是指一個可以映射現實世界、又獨立于現實世界的虛擬空間,現實中的人可以使用數字身份在“元宇宙”中娛樂、社交、學習和工作等。

          盡管行業尚未形成最終統一的形態描述,但隨著全球各大龍頭企業和行業KOL入局,“元宇宙”無疑是2021年最受市場關注的熱點。元宇宙將打破現實和虛擬世界的邊界,在游戲、社交、娛樂、教育、內容、消費等領域有著廣泛的應用前景,市場普遍認為其將帶來互聯網、文化等系列產業商業模式的升級和市場空間的巨大成長。

          彭博行業研究預計元宇宙市場規模將在2024年達到 8000億美元,普華永道預計元宇宙相關經濟市場規模有望從2020年的500萬美元增至2030年的15000億美元,2020-2030年間的CAGR高達253%。

          Roblox是一個誕生于美國的UGC游戲平臺,于2021年3月在紐交所上市,成為“元宇宙”概念第一股,上市后一直受到全球市場的高度關注。2021年10月29日,扎克伯格宣布Facebook 正式改名為 Meta,以展現公司對元宇宙的重視與投入程度,更掀起了全球范圍對元宇宙的進一步熱議。中國各大龍頭企業緊隨其后,紛紛入局。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          元宇宙的形式及所需要素;資料來源:中信證券《元宇宙的未來猜想和投資機遇》

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          元宇宙的市場規模預測;數據來源:民生證券《元宇宙核心六問六答,如何看待它就是下一代互聯網》

          2. NFT,文化產業新模式

          NFT( Non-Fungible Tokens 的縮寫)意為非同質化貨幣,是可錨定現實物品的數字憑證,由于其獨一無二、稀缺、不可分割或復制等特點,可用來代表虛擬收藏品、游戲內資產、虛擬資產、數字藝術品、房地產等各種資產,與區塊鏈同被視為元宇宙的兩大核心底層支撐。

          2021年,NFT進入爆發增長階段,目前最大的應用領域是數字藝術和NFT游戲市場。

          長期來看,各個行業領域都可能實現NFT形式的資產流通,尤其是在元宇宙概念中NFT將扮演重要角色,未來有望成為文化產業信用評級和資產評估難題的解決途徑。

          2021年3月,數字藝術家 Beeple 的藝術品《Everydays:The First 5000 Days》在英國拍賣平臺佳士得以6934萬美元賣出,成為當時價格最貴的NFT藝術品。2021年12月,被粉絲譽為“NFT界畢加索”的藝術家Pak的項目“Merge”(“吞并”)在NFT交易平臺Nifty Gateway向公眾公開發售,48小時后9180萬美元的成交價格超過杰夫·昆斯拍價9110萬美元的雕塑《兔子》,在“全球最貴在世藝術家”排行榜上排名第一。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          《EVERYDAYS: THE FIRST 5000 DAYS》(左圖為JPG集合,右圖為其中一幅)

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          “Merge”(“吞并”)

          3. 文化振興鄉村,煥發鄉村文旅新活力

          在國家鄉村振興戰略指導下,各地依托政府扶持、社會機構跟進和資源資本投入,積極推進文化振興鄉村,帶動了鄉村文化旅游市場供需兩旺、快速發展,而短視頻、電商直播等業態更是在全社會范圍內加速了鄉村文化的推廣傳播。

          在疫情常態化防控的大背景下,更多客群的關注度也轉向了人口密集度更低的鄉村消費場景,山水田園、傳統村落、非遺民俗、民宿美食、康養休閑等鄉村文旅體驗迎來更廣闊的市場發展空間。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          2021年2月25日國家鄉村振興局正式掛牌

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          表:2021年上半年抖音平臺“鄉村”內容數據

          圖:企業側對鄉村文旅市場前景看好情況

          數據來源:中國旅游研究院&巨量引擎城市研究院《文化賦能旅游,旅游振興鄉村》

          4. 數字文化,構建文化產業新生態

          習近平總書記在考察馬欄山視頻文創產業園的講話中指出:“文化和科技融合,既催生了新的文化業態、延伸了文化產業鏈,又集聚了大量創新人才,是朝陽產業,大有前途?!痹谛掳l展階段,文化與科技深度融合發展的數字文化顯示出更為重要的戰略意義。

          2021年,人工智能、云計算、大數據等數字技術加速發展,5G、數據中心等文化新基建不斷落地,文化產業與新一代信息技術深度融合,不斷催生智慧文旅體、文化裝備制造、網絡視聽內容、傳統文化數字化、IP策劃運營、虛擬文化產業多種新業態和新場景,持續深化文化與旅游等相關產業的跨界融合,不斷加速我國文化產業數字化的轉型升級進程。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          文化科技融合的代表性場景和相關技術融合水平分析

          資料來源:《 2021文化科技融合報告》——騰訊研究院,清華大學文化創意發展研究院

          5. 傳統文化“活化”,彰顯文化自信魅力

          習近平總書記指出:“讓收藏在博物館里的文物、陳列在廣闊大地上的遺產、書寫在古籍里的文字都活起來?!痹趯鹘y文化的創造性轉化和創新性發展理念的指導下,AR/VR、短視頻、直播電商等技術不斷助力傳統文化“活化”,館藏文物、古典書籍、非遺傳承等融入現代生活和消費,實現了傳統文化的“場景化”、“生活化”和“市場化”,不斷賦能傳統文化企業的生產模式和商業模式。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          傳統文化視頻評論熱詞

          圖片來源:字節跳動平臺責任研究中心《短視頻與傳統文化研究報告》

          2021年,“沉睡三千年,一醒驚天下”的三星堆遺址再驚天下??脊殴ぷ髡咴谌嵌堰z址新發現6座三星堆文化“祭祀坑”,并出土數百余件黃金面具等重要文物,“三星堆遺址考古新發現”連續霸占社交媒體的數條熱搜,而融合了變臉、茶文化、蜀繡等川蜀文化元素、極具世俗煙火市井氣息的三星堆“川蜀小堆”盲盒,以及“三星堆搖滾盲盒”也引發了全民的持續關注。

          “IP蛋炒飯”公眾號撰文稱:“這些4000年前的出土文物,不僅極其貼合當代人的審美,甚至比當代藝術玩得更拽、更酷,洋溢著現代主義的的精神、和夢境般的想象力,將人性的感覺放大到極致。三星堆有著現代藝術特有的‘想象力’和‘百變’魅力基因,使之成為了傳統文化中的潮流巨星?!?

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          三星堆最新出土金面具

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          三星堆搖滾盲盒

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          三星堆“川蜀小堆”盲盒

          圖源:“IP蛋炒飯”公眾號《2021-IP年度榜》

          6. 虛擬數字人,創造偶像文化新經濟

          虛擬偶像通過繪畫、音樂、動畫、CG等形式制作,在虛擬場景或現實場景進行演藝、工作等活動。

          2021年,隨著中國二次元用戶數量持續增加、數字技術不斷進步,初音未來、洛天依、一禪小和尚、美妝柳夜熙等虛擬偶像的受眾持續提升,在直播帶貨、虛擬演唱會、虛擬偶像選秀等場景中不斷應用,并從互聯網、傳媒等科技含量高的行業向信息技術密度低的地產等傳統行業推進,變現路徑向多元化發展,商業價值持續提升,市場規模持續擴大。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          2021年12月,萬科集團董事會主席郁亮在微信朋友圈發消息稱:“祝賀‘崔筱盼’獲得了2021年萬科總部優秀新人獎,她催辦的預付應收/逾期單據核銷率達到91.44%?!睋蟮?,職場女性崔筱盼,是一名在萬科集團財務部悄悄工作了十個月的虛擬人,能夠提供7X24小時的服務,替代大多數的人力。

          萬科總部優秀新人獎獲得者——“虛擬人”崔筱盼

          7. 直播電商,后疫情時代的常態消費模式

          疫情防控常態化背景下,直播電商進一步成為地方政府、各大機構和品牌吸引消費者不可或缺的核心手段,在更好地滿足消費者需求、推動經濟高質量發展等方面發揮了積極作用。

          據Fastdata極數的數據,僅2021上半年,中國直播電商交易額超萬億元,同比增長超兩倍。隨著行業競爭的加劇、政府管理的規范及用戶認知的成熟,直播電商步入下半場發展格局,將進入精細化、規范化的運營管理時代,迎來公平競爭的市場環境。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          直播電商用戶滲透率

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          直播電商競爭格局

          數據來源:Fastdata極數《2021年中國直播電商行業報告》

          2021年10月20日淘寶主播銷售榜顯示,當日“雙十一”預售第一天,李佳琦直播銷售額達到106.53億元,薇婭直播銷售額為82.52億元,彰顯了電商直播驅動經濟發展的超強動力。

          2021年12月20日,浙江省杭州市稅務局稽查局查明,薇婭在2019年至2020年期間,通過隱匿個人收入、虛構業務轉換收入性質虛假申報等方式偷逃稅款6.43億元,其他少繳稅款0.6億元,依法追繳稅款、加收滯納金并處罰款共計13.41億元。

          8. 游戲電競,助力游戲產業高速發展

          目前,我國成為全球范圍內擁有核心電競愛好者最多的區域,是全球極具電競商業價值的市場。在新興技術推動和國家政策支持下,世界級電競賽事在中國舉辦以及EDG奪冠,電競直播更加火爆,電競產業徹底出圈,帶動用戶規模迅速增長。

          未來,我國電競市場規模還將持續穩步上升,進一步帶動游戲等周邊產業發展。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          數據來源:《銀河證券:電競行業深度報告——產業發展正當時,電競奪冠承勢起》

          2021年《英雄聯盟》全球總決賽在冰島首都雷克雅未克落幕,來自中國LPL賽區的EDG戰隊與衛冕冠軍、韓國LCK賽區的DK戰隊打滿五局,最終以總比賽3-2戰勝對手,奪得隊史首個冠軍。“EDG奪冠”在國內外的社交平臺上引發巨大反響,熱浪席卷整個社交媒體,尤其引得以多所高校為代表的中國粉絲沸騰狂歡。

          9. 沉浸式娛樂,文化場景的創新熱點

          近年來,密室逃脫、劇本殺、鬼屋、以狼人殺為代表的桌游等線下沉浸式娛樂場景,因其更強的娛樂體驗和社交屬性、更高的客單價及更快的內容迭代等特點,在綜藝節目帶動下逐漸大眾化,帶動全產業鏈條快速發展。在全息投影、聲光電等技術加持下,店鋪數量和行業規模大幅增長,但行業整體尚處于分散階段。雖然2021年線下娛樂場所因疫情影響受到重挫,沉浸式娛樂依然代表著未來線下的重點發展方向。

          2016年3月,芒果TV推出大型實景明星推理綜藝秀《明星大偵探第一季》,主打“燒腦劇情”和“懸疑推理”的綜藝模式,即節目每期以某一特定故事為背景,玩家在案發現場搜證、集中推理,并向偵探玩家闡述不在場證明,最后完成指認兇手的過程。根據國盛證券統計數據,截至2021年《明星大偵探》已更新至第六季,累計播放量達 41.4 億。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          數據來源:艾媒咨詢《2021年中國劇本殺行業用戶研究及標桿企業案例分析報告》

          10. 亞文化“破圈”,Z世代引領新消費浪潮

          根據中信證券《基于B站熱度的Z世代消費指數構建》一文中的定義:“Z 世代”是指1995-2009 年出生于世紀之交的“網生一代”,人口規模約2.64億,占我國總人口比重約19%。

          Z世代的成長過程伴隨著我國經濟建設和城鎮化的突飛猛進,以及互聯網尤其是移動互聯網的高速發展,因此展現出全新的世代特征。

          隨著首批Z時代逐漸步入職場成為消費主體,文娛、服飾、美妝、食飲、社服、家電等多個行業都迎來“亞文化”帶來的全新發展機遇。盲盒潮玩、國產服飾、輕奢國貨、新興餐飲、硬核科技等不同賽道,憑借年輕消費群體的需求和偏好不斷“破圈”,成為文化產業的新消費潮流。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          偏好中國本土化國潮、國風元素 Z 世代占比

          數據來源:中信證券《基于B站熱度的Z世代消費指數構建》

          11. 快文娛當道,年輕一代的文化消費新主流

          區別于傳統的大型、重型文娛,“碎片化內容消費”、“時間靈活自由”的快文娛,以輕、快、省時觀看的各種短視頻、微漫畫、輕小說、輕游戲等內容為主。

          根據芒果TV數據調查報告,Z世代偏好信息量密集、劇情推進緊湊、內涵豐富等有品質的內容,有拖進度、提速看等消費特征,更愿意為興趣付費,在Z世代領軍的文娛消費環境下快文娛成為消費主流。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          數據來源:芒果TV《95后&00后視頻用戶行為研究》

          12. 私域流量,品牌營銷新陣地

          私域流量是指沉淀在品牌或個人渠道、可隨時反復觸達、實現一對一精準運營的用戶流量。

          隨著互聯網滲透率登頂,流量紅利消退,公域流量獲客成本昂貴,各大平臺抽傭比率居高不下,商家逐步將經營重點從公域流量轉向為用戶全生命周期價值服務的私域流量已經成為必然趨勢,以微信、小程序、視頻號、企業號、社群、直播等為代表的私域流量的運營能力成為企業及品牌的新核心競爭力。

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          私域流量 VS 公域流量

          數據來源:光大證券《交還電商的舞臺和話筒給商家——私域流量行業深度系列報告》

          元宇宙、NFT、虛擬人…盤點2021文化產業十二大熱點現象

          2021年品牌私域營銷布局情況

          數據來源:億邦動力研究院《2021垂直類電商私域化洞察報告》

          2021年1月,微信在公開課Pro上發布數據稱:2020年度小程序電商GMV在2019年8000億人民幣的基數上,整體交易額繼續增長100%,人均交易金額提升了67%。

          2021年4月騰訊營銷洞察(TMI)和波士頓咨詢(BCG)發布的《2020社交零售白皮書》中指出:在所有消費者中,有79%過去一年曾在私域消費;其中72%消費者在私域中購買客單價超過100元;購買后,70%消費者表示愿意在私域進行復購;80%消費者愿意在私域進行分享;其中48%消費者至少每月購買1次。以上多項增長數據意味著私域流量帶來的市場規模還將繼續擴大。

          文章來源:人人都是產品經理   作者:新榜

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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

          一縱一橫,搭建完整數據分析體系

          資深UI設計者

          如今隨著互聯網不斷發展,各產品的數據體量都變得很大,數據分析體系就發揮了巨大的作用;搭建一個完整有效的數據分析體系,可以提高你的工作效率以及準確度。本文將整個體系概括為:一縱一橫。推薦對搭建數據分析體系感興趣的用戶閱讀。

          新年伊始,很多公司都在制定年度計劃,有同學會問:數據分析的計劃該怎么定呢?

          今天給大家一個最全面的數據分析體系,涵蓋了公司級全部場景。大家可以對著參照,看自己的發力點在哪里。

          整個體系可以概括為:一縱一橫。話不多說,上干貨!

          一、一縱:從效果角度看工作

          問一個簡單而關鍵的問題:數據分析,到底有啥用?

          答:站在業務的角度,數據分析有6大用處

          1. 目標制定:確定量化目標,分解下發目標
          2. 趨勢預測:預測正常走勢,提供決策參考
          3. 過程監控:監控業務發展,發現過程問題
          4. 結果復盤:復盤績效表現,總結成果經驗
          5. 原因分析:分析問題原因,探索解決方法
          6. 方法測試:測試優化方法,選擇更優做法

          這六個場景,貫穿業務工作全過程,最能體現數據分析的價值。因此,當我們思考數據分析可以做什么的時候,可以先思考這六個場景,目前的工作滿足了多少需求?還有哪些是可以做的(如下圖)?

          一縱一橫,搭建完整數據分析體系

          注意:數據并非不可替代!這6步即使沒有數據,業務方也能做。

          比如,經典的場景是:

          1. 目標制定,是老板授意財務整出來的。
          2. 趨勢預測,是領導們拍腦袋拍出來的。
          3. 結果復盤,業務自己往自個臉上貼金。
          4. 方法測試,壓根就不存在(老夫說是,丫就是?。?

          最有可能,只有過程監控,與發現問題以后的原因分析,是甩給數據分析做的。

          但這樣的話,工作就太被動了。不清楚目標,不清楚業務基礎走勢,不清楚方法背后業務邏輯,光看一個數字是很難分析出原因的。

          因此相當多數據部門退化成只能監控個數據。甚至只能提個數。

          這種被動局面,是在年初定規劃的時候要盡力避免的。此時不爭,更待何時!

          此時可以:

          1. 向大老板開展游說,灌輸“全流程數據管理”的理念,增加工作場景。
          2. 結合行業內成功的數字化案例,向所有人安利數據價值,擴大工作。
          3. 觀察每個部門的工作風格,看哪些部門容易談,能找到合作機會。

          這樣做,就得認真研究企業內各部門分工情況,這就涉及到“一橫”概念。

          二、一橫:從部門角度看機會

          問一個簡單的問題:是否各個部門對數據重視程度一樣?

          答:當然不一樣!

          從部門職責上看,部門可以分為四大類:

          1. 管理型

          典型如:總裁辦、戰略發展部、財務部。

          這些部門直接與公司最高層溝通,很多重大的發展計劃,年度KPI目標,經營任務,都是這些部門參與制定的。這些部門很重視數據!

          因為所有的目標、任務、計劃都得量化。他們常見的問題是:知其然,不知其所以然,以財務部尤甚。算賬算得很精明,可對于業務細節不甚了解。

          此時,想要和這些部門交好,可以從提供基礎數據突破。

          在提供數據的同時,主動幫他們梳理關鍵業務流程,清晰常規的業務基線,補齊他們在業務理解上的短板。這樣能有更多機會合作。(如下圖)。

          一縱一橫,搭建完整數據分析體系

          2. 收入型

          典型如:銷售、投放、增長部門。

          這些部門負擔主要的收入任務,是業績、利潤的主要來源。但是,這些部門一般都不重視數據。能看到任務目標、完成率就差不多了。

          他們更喜歡看案例拆解,看操作指南,看具體做法??傊?,手里用得上的才是好東西。

          此時,想要和這些部門交好,可以從工具入手。

          不要整復雜的報表,而是根據看表人關心的內容,分層級提供數據。越是基層的,給看的數據越少,最好只留關鍵KPI。

          功能上,和CRM等工具打通,在提供數據的同時,直接提供可操作功能,這樣才受一線歡迎(如下圖)。

          一縱一橫,搭建完整數據分析體系

          3. 成本型

          典型如采購、研發、設計。

          這些部門基本都在消耗成本,很難直接見成效,萬一做不好了引發用戶討厭、產品積壓、庫存不足,還會影響銷量……而且,這些部門又受到銷售、營銷營銷,很難獨善其身。

          這時候要區別對待:

          對于采購、生產、供應這種容易產生硬損失的部門,重點做好數據滾動預測與數據監控。

          對于來自上游供給、下游需求、大促活動等影響因素及時收集,結合供給進度與庫存情況,預報可能存在的積壓/缺貨問題(如下圖)。

          一縱一橫,搭建完整數據分析體系

          對于研發、設計、產品這種容易產生軟損失的部門,重點最好測試平臺和測試服務。用常規監測發現問題,用好的測試來檢驗改善效果(如下圖)。

          一縱一橫,搭建完整數據分析體系

          4. 混合型

          典型如營銷、運營部門。這些部門很喜歡看數據,且其工作效果,是疊加在銷售基礎上產生的,很難觀察。因此做分析的時候特別糾結。好在,他們的工作多是項目制的,可以逐個攻破。

          常見的項目,包括:

          1. 大促活動
          2. 用戶洞察
          3. 品牌傳播
          4. 社群運營

          這些在之前的文章已經有很多分享,這里就不贅述了。想洞察得深刻,想分析得到位,重點是培養業務部門的好習慣,打好數據基礎。

          比如:

          1. 用戶標簽、商品標簽、內容標簽、渠道標簽等標簽庫的完善與維護。
          2. 活動標簽與活動分類信息管理,活動考核標準記錄,事前參照組設計。
          3. 社群運營、新媒體運營、短視頻帶貨、直播帶貨基礎數據收集

          基礎工作做好了,事后大量數據可以分析。

          基礎工作沒做好,事后分析個屁……

          一縱一橫,搭建完整數據分析體系

          整體安排:分階段,做出標桿項目。

          注意:上述的工作,在業務部門那里是有先后順序的。

          1. 一般1、2、3月,做年度規劃的比較多
          2. 上半年招新人、組團隊、小規模試點多
          3. 重大促銷、節日活動集中在下半年

          清晰了業務部門行動以后,數據部門的整體安排就很清晰了:

          1. 年初,以預測、目標制定、搭建體系等基礎工作為主。
          2. 上半年,優先強化基礎能力,對基礎數據、測試平臺、標簽庫等工具,能強化盡量強化。
          3. 下半年,以重大項目為主,做好項目支持,做好監控與復盤,做好用戶洞察。

          輸出的目標,以每個月都能有一個項目上線/更新為目標。這樣每個季度的季報容易寫,來年年度總結也就不糾結了(如下圖)。

          一縱一橫,搭建完整數據分析體系

          以上,就是數據部門規劃的整體思路。當然每個企業具體情況不同。同學們可以量體裁衣,根據自己面對具體情況做調整。

          當然,可能有同學會說:“規劃這種高大上的事輪不到我,我就是一個小兵,日常都在跑數,咋辦?!”

          碰到這種情況,等待別人施舍肯定不是好辦法。普通的日常工作,也能延伸出很多有價值的項目,這是數據分析工作的獨特優勢。

          文章來源:人人都是產品經理   作者:接地氣的陳老師

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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

          一文看懂元宇宙的投資邏輯和哲學思考

          資深UI設計者

          元宇宙的熱度持續不斷,許多品牌和企業加入了元宇宙的行列當中。但到底什么是元宇宙,元宇宙涉及哪些內容和模塊?為何品牌和企業如此重視元宇宙?本文圍繞元宇宙進行了深度解析。推薦對此感興趣的伙伴閱讀。


          盡管距離Facebook改名為Meta已經過去了幾個月,有關元宇宙(Metaverse)的討論依然熱度不減。2022年1月18日,微軟宣布以687億美元的現金交易收購視頻游戲巨頭動視暴雪。

          微軟CEO Nadella表示游戲在元宇宙發展中“扮演了重要角色”,動視暴雪CEO Kotick更是在內部信中向員工表示,游戲“元宇宙化”是公司接受微軟收購的主因。在當下,似乎沒有任何一個概念比元宇宙更宏大、更抽象、更模糊、更適合炒作。我們隱約感覺到元宇宙似乎代表著數字未來和互聯網的下一種形態,但是元宇宙的演進路徑和終局的形態為何,相信很多讀者仍然沒有讓自己信服的答案。

          在參考了大量Metaverse相關資料后,本次Scale Partners 勢乘資本將分享我們對Metaverse概念的認識框架和相關思考。我們力求去偽存真、刪繁就簡,幫助讀者認識元宇宙這一概念最關鍵的要素,提升對各類元宇宙主題或概念討論的辨識力。

          一、元宇宙的內涵

          給元宇宙下一個邊界清晰的定義和描述移動互聯網是什么一樣困難。雖然如此,我們還是需要先要明確元宇宙大概是什么。著名哲學家趙汀陽從Metaverse這個詞本身入手進行的分析很有啟發:英文中Verse可以理解為“版本”,而Meta有兩個含義。

          一是“在某種事物之外的另一片領域”;

          二是“在某種事物的背后更為根本性的東西”。由于元宇宙的設想最終都需要真實世界的能量去支撐,元宇宙應該不是更根本性的宇宙,更可能是在真實世界之外的另一片世界,即元宇宙更像是一個“超世界”。

          我們這里采納了MetaZ創始人、MIT Technology Review中文版前首席顧問陳序對元宇宙的描述,給出我們對元宇宙的理解:元宇宙不是與現實物理世界割裂或者并行的虛擬世界,而是人以數字身份參與和生活的數字世界。這里重點為讀者解釋三個要點:

          1. “數字身份”VS“數字賬號”。數字賬號只是數字身份的一部分,只記錄了我們我們每個人的一部分信息。每個數字賬號本身是要依附于擁有真實身份的人。在元宇宙中,每個人可以有多個數字身份;
          2. “參與”指的是“自由參與”。元宇宙不屬于任何一個國家或者企業,沒有任何提前寫好的劇情,沒有什么已經被制定好的角色,也沒有像游戲通關那樣的一個終點或者主線索。元宇宙中每一個人都有權利參與規則的制定,創造自己的世界;
          3. “生活”不同于“觀看”。元宇宙中的交互和體驗形態不同于我們使用電腦或智能手機,用扎克伯格的話說,元宇宙是一個“我們參與的、可以沉浸式置身其中的互聯網”,是一個所有感官體驗都被數字化的世界。

          如果接受以上的討論,那么相信各位讀者可以輕松地得出這樣的判斷:VR/AR、各種游戲、3D虛擬世界中的UGC平臺(比如Roblox)、英偉達的Omniverse平臺等等都不是元宇宙,就像是智能手機、移動App、抖音等視頻UGC平臺、應用開發工具等不是移動互聯網一樣。

          二、廣義和狹義的元宇宙

          當前很多關于元宇宙的討論之所以顯得“差異大于共識”,除了對元宇宙的內涵理解不一致外這個原因外,跟作者未明確討論的元宇宙是“狹義”還是“廣義”版本也有關系。因此,我們有必要了解一下“兩個版本”的元宇宙。

          1. 狹義元宇宙

          把線下的物理世界完全映射到數字世界里面,線上線下融為一體。人們在現實世界中是誰,在元宇宙里就是誰??梢钥闯?,狹義的元宇宙本質是一個比現在映射更充分、更完備的虛擬世界,可以理解為數字孿生推向極致的一種情況。

          2. 廣義元宇宙

          廣義的元宇宙不滿足于只將現實世界充分映射到數字世界,甚至不強制要求數字世界需要體現現實世界中的全部或者部分要素。因此,理論上廣義元宇宙可以有無數個。

          廣義元宇宙如果推向極致,某種程度上就是《黑客帝國》中生活在母體(Matrix)中的人類見到的情景(此處我們無意討論腦機接口的相關內容)。

          有關廣義元宇宙的一個不可回避的疑惑是:如果真的有多個元宇宙,那么同一個人如何在元宇宙之間互聯互通呢?要知道,企業構建自己勢力范圍的問題即便在當下行政強力干預的情況下都沒被很好解決,在元宇宙中,誰有能力、有意愿、有資質來解決這個潛在的問題呢?

          三、元宇宙存在的價值

          如果我們仔細思考就會發現,超過九成對元宇宙價值的討論本質都是在分析VR/AR行業的價值。那么元宇宙這樣一個宏大的敘事概念,其本身的價值是什么?此處給出我們的閱讀和思考成果:給人們創造自己想要的世界、構建或者更好地維護關系的機會,體會作為人的存在感。應該說,元宇宙讓人們對人生的設想有了落地的可能,具體體現為:

          • 在元宇宙中人們自己去建立規則、定義價值,實現自己的想法,以此來更好地認同自己,獲得存在感。
          • 人的本性就是通過互動定位自己。元宇宙可能能幫我們跟他人建立起更多的關系,有可能會帶來更多積極的體驗。
          • 為增速放緩的互聯網發展進程注入新的活力,同時應對AI和機器人可能對人類構成的威脅:
          • 目前在視覺(文字、圖片、視頻、直播)和聽覺(音頻)領域,互聯網發展機遇在不同的社會階層之間較好地實現了扁平化的延伸。在未來,元宇宙將從視覺、聽覺、觸覺、嗅覺和味覺五個感覺維度實現人的感官數字化,打破當前流量紅利見頂的背景下大公司內卷化競爭的局面。
          • 未來AI和機器人的大規模應用很可能會造成一系列問題(比如大量人口失業),而元宇宙里可能會產生新的雇傭模式、就業模式,甚至誕生全新的職業,讓人創造出全新的價值,從而為現實世界的問題提供解決方案。

          四、元宇宙三要素和核心支持技術

          對一級市場的創業者和投資人來說,如何判斷項目跟元宇宙到底有沒有關系呢?結合第一部分中對元宇宙的內涵的探討,我們認為如下三個要素至關重要:

          1. 提供沉浸式、真假難辨的體驗的硬件設備:元宇宙最直觀的體現形式就是所有感官體驗數字化的一個虛擬世界。因此,能夠為用戶提供真實且舒適體驗的硬件設備重要性不言而喻。
          2. 身份系統:元宇宙中的身份系統與現實世界的身份之間需要有適當的隔離。為了讓每個人的數字身份獨立、長期存在,元宇宙中沒有誰有“超級權限”可以管理或者刪除數字身份。
          3. 價值系統:包括運行規則和經濟系統。元宇宙中的運行規則不由中心化機構提前預設好,元宇宙中的經濟系統則可能代表著全新的社會關系和生產關系。

          顯然,從實踐和落地的角度看,區塊鏈毫無疑問是元宇宙的核心支持技術:一方面,身份系統需要借助區塊鏈去中心化的特點來維持其獨立性;另一方面,基于區塊鏈的NFT(Non-Fungible Token)能夠實現讓數字世界的物品(游戲、藝術品、收藏品、數字音樂等等)具有不可分割、不可復制的特性(從而解決物品唯一性的問題),并追溯這個物品或者事物信息的所有權,便于人們交換和交易數字物品。

          補充:區塊鏈上的數字加密貨幣分為原生幣(native coin)和代幣(token)兩大類,前者代表是比特幣、以太幣等,擁有自己的主鏈,使用鏈上的交易來維護賬本數據;代幣則是依附于現有的區塊鏈,使用智能合約來進行賬本的記錄。代幣又分成同質化代幣和非同質化代幣兩種,前者可以互相替代、接近無限拆分,而后者不可分割和替代,獨一無二。

          五、元宇宙的六大投資版圖

          元宇宙可能是繼智能手機之后的第二個巨大的整合式創新機會。從目前來看,實現元宇宙的難度可能和1980年代建設整個互聯網世界的難度在一個量級上。我們匯總整理了元宇宙的六大投資版圖,方便創業者和投資人更好地識別和把握機會。

          1. 硬件與操作系統

          元宇宙的沉浸式特性要求設備能夠提供三維的信息呈現和交互方案,而智能手機、平板電腦等電子設備通過一塊屏幕把人和信息世界隔離開,使得我們與外部環境只能間接交互。

          因此,元宇宙概念下的硬件機會集中于能夠帶來優秀的沉浸體驗和仿真效果的VR/AR/MR設備上。在未來,一體式的XR設備上可能會適配更多配件,從而更好地給予用戶視覺、聽覺、觸覺、味覺和嗅覺五種感官刺激。操作系統是用戶與硬件之間的接口,控制和管理整個硬件和軟件資源。

          從歷史經驗來看,XR設備的操作系統競爭烈度會遠高于XR硬件本身的競爭烈度。在操作系統之爭中,時間是不可忽視的影響因素,同時誰能夠更好地平衡開發者的創造性和消費者的體驗,誰就更有機會勝出。

          2. 后端基建

          (1)通信網絡

          要保證巨量用戶在能夠實時、共享、持久地在虛擬環境中交互,需要保證大量數據能夠順暢地發送、接受,而4G網絡顯然無法處理如此大規模的數據負載。5G網絡讓元宇宙中高清圖像、視頻、海量數據等信息的順暢傳輸成為可能。同時,沉浸體驗和應用場景的特性對通信網絡的延遲也提出了很高的要求,而5G網絡的低延遲特性能夠滿足這一要求。

          (2)算力/云計算與邊緣計算

          由于元宇宙中信息以三維形態呈現,同時大量用戶會靈活化、個性化地參與其中,實現元宇宙會帶來歷史上對持續、穩定算力的最大規模需求。

          解決這個恐怖的算力問題很有可能需要依靠量子計算領域的重大突破。另外,受限于網絡帶寬、計算吞吐量等因素,以及出于保護數據安全的考慮,目前來看將云計算和邊緣計算結合起來是必然選擇:云計算負責全局性、非實時、長周期的大數據處理與分析,能夠在長周期維護、業務決策支撐等領域發揮優勢;邊緣計算更適用于局部、實時、短周期數據的處理與分析,能更好地支持本地業務的實時智能化決策與執行。

          說明:邊緣計算是指在靠近數據源頭的網絡邊緣側,融合網絡、計算、存儲、應用核心能力的分布式開放平臺。它可以作為連接物理和數字世界的橋梁連接智能資產、智能網關、智能系統等。

          3. 底層架構

          (1) 區塊鏈

          正如我們在第四部分中介紹過的,區塊鏈為元宇宙的身份系統和價值系統提供支持。盡管區塊鏈技術已經在一些場景中被應用了多年,但我們必須認識到,目前區塊鏈技術因為對數據存儲要求高、可擴展性差等原因,很難支持大范圍的應用(比如零售級別的支付)。這個行業有大量的創新和Libra式“中心化的分布式處理架構和區塊鏈技術線相結合的分層混合技術路線”這樣的實踐值得我們關注。

          (2) 數字孿生

          我們曾在第二部分中提到,元宇宙的構建可能需要將現實世界的全部或部分映射到數字世界中。在這個過程中,數字孿生是必不可少的技術。數字孿生指的是物理實體在數字世界的孿生,強調的是數字世界與物理世界的一體性,最早被應用于工業制造領域。目前,通過設備掃描環境形成數據點云,識別和提取物品模型的技術已經逐漸成熟,城市級別的超大規模三維重建也進入應用階段。

          (3) 引擎與開發平臺 

          為了讓每一個人都有可能參與到數字世界的構建過程中,從而建設一個開放的元宇宙,我們需要有面向普通用戶的低門檻內容創作工具(如引擎、開發設計工具平臺等)。在這方面,海外相關廠商已經領先一步:例如,Unity把自己重新定位為“交互式內容創作引擎”,將引擎應用拓展到動畫、影視、建筑、制造等其他行業。

           4. 人工智能

          在未來,為了降低構建元宇宙的時間和人力成本,相比PGC、PUGC或UGC等方式,由AI生成的可供人類消費的內容或服務會越來越多;另一方面,依靠現有的方式處理所有元宇宙情境下的數據已經不現實,我們需要依靠具備自主學習和決策功能的AI來輔助,從而降低支持和維護元宇宙運行的成本。

           5. 內容與場景

          預計元宇宙時代的內容消費端大體會經歷如下的發展階段:

          (1)娛樂和社交內容先行,搶奪用戶注意力:游戲相比其他內容領域綜合準備度最高,是元宇宙內容的起點。而XR設備將元宇宙在社交方面的優勢體現得淋漓盡致,吸引大量用戶使用;

          (2)生產、生活的多個領域被滲透:人們會逐步擺脫對元宇宙“高階游戲形態”或“高階社交形態”的印象,例如形成閉環的虛擬消費體系、與物理世界打通的虛擬化服務等會逐漸興起;

          (3)出現新的內容和應用:元宇宙內可能也會出現房屋、家居、汽車等物品的生產商,游戲、藝術品展覽等傳統活動可能會有新的內容和呈現形式……我們甚至可以暢想建立在數字資產上的金融體系會如何運行。

          6. 協同方

          元宇宙很可能會催生出很多新市場和新業態,孕育出新的偉大企業。這個過程中會有部分的技術方案、服務方憑借自身稟賦而充分受益,或者在新的競爭格局確定前與其他企業形成新的生態合作體系。

          六、元宇宙投資演進邏輯

          在上一部分中,我們分析了元宇宙概念下的六大投資版圖??紤]到各個板塊并不會呈現齊頭并進式的發展局面,我們需要對這些領域之間的演進邏輯有一個大體的判斷,從而幫助創業者和投資人把握住恰當的時間節點入局:

          1. 硬件與內容先行

          XR硬件在未來幾年內的增長勢頭已經較為清晰,且與硬件配套的內容已經與硬件形成相互促進的正循環(我們后續將發布VR/AR行業研究報告,進一步探討這個要點)。

          未來新內容/場景的制作、運行、交互都需要依賴底層架構的大力升級(游戲引擎/工具集成平臺等),底層架構在這一時期也會進入發展的快車道。

          2. 隨著底層架構的升級、內容與場景的不斷豐富,后端基建與人工智能

          將在數據處理、內容合成等領域發揮巨大的功效。我們將看到AI將替代或輔助人類完成建設性的工作,成為元宇宙里的核心生產力。

          3. 相較于其他板塊,內容與場景

          板塊下的變數最大。新內容、新場景、新業態可能會重塑內容產業的規模與競爭格局。同時在這個過程中,會有大量繁榮整個生態的技術協同方、服務協同方一起發展壯大起來

          七、中美元宇宙發展方向預判

          從某種程度上說,關注元宇宙就是在關注中國在世界科技領域的未來。目前,中美引領全球元宇宙發展,日、韓、歐洲緊隨其后。短期來看,各國在移動互聯網時代積累的稟賦將影響各國在元宇宙領域的發力方向。這里我們簡單討論一下短期內中美元宇宙發展的大體方向:

          (1)美國:在硬件與操作系統、后端基建、底層架構三個板塊內優勢明顯,同時在人工智能領域也具有較強的競爭力。從應用層面來看,美國企業已經在面向C端消費者的娛樂場景上取得了一定成績,在工業設計等給B端賦能的場景上也走在世界的前列。

          (2)中國:龐大的人口基數、巨大的地域差異以及獨特的社會歷史階段,都是讓我們相信中國在內容與場景創新方面的想象力巨大的理由。我們期待中國的創業者能像在移動互聯網時代改造社交、出行、支付等領域一樣,在實現元宇宙設想的過程中,創造世界級的內容與創景創新,并誕生新的協同生態中長期看,存在很多變數,談論終局為時過早。當前,中國在底層架構板塊也有一定的積累,正在逐步縮小與美國的差距。

          加之中國在基礎設施建設方面的投入意愿和力度巨大,我們樂觀地相信,未來中國在人工智能與后端基建領域存在彎道超車的機會。期待未來中國在元宇宙發展的歷史階段中逐步超越美國,引領世界。

          八、重要玩家和實踐

          結合我們在第四部分中對“元宇宙的三大要素”的討論,我們認為應當重點關注具備“區塊鏈技術應用”、“數字內容創作”和“消費硬件實力”的公司。這里我們將選取并介紹幾家國內外值得關注的公司,并闡述我們的理由:

          1. Facebook(Meta)

          目前,Facebook是全世界唯一一家在“區塊鏈技術應用”、“數字內容創作”和“消費硬件實力”三方面都做出成績的公司:? 通過Oculus產品線提供VR硬件,解決沉浸式體驗的問題;? 曾推出數字錢包Novi等應用,作為區塊鏈技術儲備;? 積累了運營區塊鏈交易的經驗,并有開發NFT產品的計劃;

          2. NVIDIA 英偉達

          如果我們把元宇宙比作一個全新的、有無限可能的“淘金浪潮”,那么除了某些公司作為”“幸運的淘金者”是贏家外,為元宇宙淘金者提供工具的企業也是贏家。英偉達給元宇宙的開發者提供生產力工具,比如通過顯卡和AI技術,簡化開發者進行3D建模和圖像渲染的難度。

          這里建議大家重點關注英偉達的Omniverse平臺:這是一款可以下載到搭載了英偉達顯卡的設備的軟件。Omniverse軟件平臺在英偉達顯卡的計算、渲染逼真圖像的能力基礎上,添加了很多英偉達自研和第三方的軟件工具包,幫助人們更好地去設計元宇宙內的東西,或者用于一些場景下的數字孿生,如模擬工業制造、自動駕駛、虛擬建筑等。

          3. 騰訊

          騰訊對Epic Games、Spotify、Snap等公司的投資以及自身在社交領域掌握的資源,都可以看做是騰訊對元宇宙的關鍵布局。在2020年騰訊還提出要在未來5年,拿出700億美元加強自身在云、AI、區塊鏈、5G、量子計算等領域的能力。不過我們也看到騰訊在消費硬件領域有明顯短板,騰訊對國外公司的投資很可能面臨較大的政策不確定性。

          當然,我們也可以按照第五部分中提供的投資版圖判斷大公司在元宇宙概念里的布局情況。這里我們列舉了一些公司和對其分析后的結果,供大家參考。

          九、圍繞元宇宙的爭論和擔憂

          在本部分中,我們將先列舉一些圍繞元宇宙設想產生的爭論。不論是元宇宙的支持者還是反對者,我們認為都有必要思考這些問題,因為這些討論對元宇宙建設過程中形成價值共識至關重要。

          1. 元宇宙會不會讓人類文明停滯不前?

          人們很容易擔憂,元宇宙會讓大量人群沉浸于虛擬內容不能自拔。如果越來越少的人花費時間和精力去關注現實世界,現實世界中的問題被解決的速度,或者人類文明進一步的探索進度都會受到影響。

          另一派則認為,發展元宇宙和探索外太空這類推動人類向前的活動并不是非此即彼的關系,因為元宇宙可以幫助我們更好地認識問題(比如借助VR設備激發孩子們對天文知識的探索熱情、學習知識),同時也可以為生活中受到物理條件限制的實踐提供解決方案(比如借助數字孿生技術模擬各種設想,最終得到可靠方案后再應用到現實的城市建設中)。

          2. 元宇宙會不會讓人在現實世界中徹底躺平?

          如果每個人通過VR設備都能輕松沉浸在一個虛假的美好生活場景中,那么我們很容易生發這樣的憂慮:元宇宙可能會讓人失去改變真實生活的動力。不過針對這個說法,反對一方認為元宇宙并不會導向這樣的結果,因為元宇宙中人們同樣必須付出代價(時間、創意等)才能夠交換想要的東西。

          反對者進一步指出,人們可以通過參與創造新的經濟形式來把能力變現,并可能將虛擬世界中創造的價值帶回現實世界,從而為現實世界中的“失敗者”提供了改變命運的機會。 除了以上兩個主要爭論外,還有兩個擔憂是目前元宇宙的支持者沒有很好地給出回應的。我們在這里也將簡單介紹,以促進相關討論:

          (1)元宇宙會不會給現實世界帶來巨大的能源負擔,甚至影響人類在地球的生存?

          元宇宙想要運行,需要我們生活的實體世界穩定、持續地為之提供包括電能在內的一切能源。那么問題來了:如果元宇宙不能證明從實體世界搶占的資源創造的價值超過這些資源的機會成本,那么誰能保證元宇宙還將穩定運行或進一步發展,不被人“拔掉插頭”呢?

          另外,即使元宇宙創造了巨大的價值,我們勢必也要進行成本收益分析,判斷元宇宙對地球資源和人類環境施加的壓力(例如碳排放)是否能被抵消。

          (2)元宇宙中如何進行機制設計,或者構建價值共識?

          如前所述,元宇宙不屬于任何一個國家或者企業,沒有任何提前寫好的劇情,沒有什么已經被制定好的角色,也沒有像游戲通關那樣的一個終點或者主線索。簡單來說,元宇宙是在用戶共創的過程中發展、壯大起來的。

          問題是,這種對公平和創造力給予最大限度支持的元宇宙如果保證具備基本的秩序?我們如何相信和保證元宇宙不走向霍布斯所論述的“一切人對一切人的戰爭”局面?

          目前有關元宇宙的討論中,對元宇宙可能放大網絡時代的匿名性,從而帶來更多道德倫理問題的風險討論得并不多,對實體世界中的權力機構在元宇宙中將以何種形式存在、履行職責的討論更是非常有限,這不由得讓人懷疑元宇宙是否只是一個承載了美好想象的概念,其設想必然部分或全部落空?

          補充新聞:在“Horizon Worlds”測試期間,一名女性測試者報告她在虛擬世界里遭到了性騷擾。這名測試者稱,有一個陌生人試圖在廣場上“摸”自己的虛擬角色。她寫道,“這種(不適的)感覺比在互聯網上被騷擾更為強烈”。

          可參考MIT Technology Review報道:https://www.technologyreview.com/2021/12/16/1042516/the-metaverse-has-a-groping-problem/

          十、一些觀點和想法

          在本部分中,我們將分享一些對元宇宙概念本身、元宇宙相關討論的看法和觀點,供各位讀者參考。我們無意為這些觀點背書,但我們認為這些觀點極具啟發性,希望能夠激發讀者對元宇宙更深層次的思考:

          1. 如果我們梳理了時間線就會發現,關于元宇宙的解讀和討論基本都集中出現在Facebook宣布更名為Meta之后。我們需要對Facebook改名為Meta這件事的商業邏輯有所判斷,這有助于提升我們對各類關于元宇宙的討論的鑒別力。

          2. 考慮到Facebook為元宇宙投入真金白銀(計劃投資超過100億美元),全世界恐怕沒有其他公司對元宇宙這個概念有超過Facebook的影響力。從某種程度上說,Facebook掌握了對元宇宙這個概念解釋的權利。在短期的3-5年內,創業者如果要以元宇宙為奮斗方向,緊盯Facebook相關的動作是很有意義的。

          3. 元宇宙在今天似乎成為了“一個筐”,關于人類未來的任何設想、設施、計劃、工具等等都可以往里面裝。但是我們必須清晰地認識到,科技的發展有它客觀的路徑和速度。與其談論元宇宙本身,不如追根溯源,聚焦支持這個故事底層的技術演進和行業發展。

          4. 趙汀陽認為,元宇宙是人類第一次把一個可能世界變成真實世界的努力方向。元宇宙與文學不同的地方在于,文學作品雖然是在描述可能世界,但它思考的其實都是真實世界的問題。而元宇宙會以全新形式爭奪每個人有剛性約束的資源——時間(或者壽命),很可能對真實世界產生“虹吸效應”,是一個從結果上說“非此即彼”的事:元宇宙越有吸引力,人們就會逐漸搬遷到元宇宙當中,體會現實世界中無法做到或者無法改變的事。

          5. 有著“主體唯一性”的人很難承載起不同的身份設定以及與每種設定緊密關聯的一切(社交關系、行為方式、掌握的資源等等)。如果我們在元宇宙中有多個難以統一起來甚至是矛盾的身份(比如既是男人又是女人),那么按趙汀陽的說法,“最終結果可能不是我們擁有多重身份,而是哪個身份都不是我們”。從保持自我的角度來說,多個元宇宙的設想最終對每個人來說就是切割、放大每個人身份的不同側面,讓我們在一定范圍內去“瀟灑走一回”。

          附錄:元宇宙公司生態圖譜

          2021年,Newzoom.com發布了“元宇宙生態圖”。我們將圖譜附在此處,供各位讀者參考:


          文章來源:人人都是產品經理   作者:光錐智能

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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


          3D to H5工作流應用手冊:理論篇

          資深UI設計者

          前言

          設計師需求中 3D 視覺平移到互動 H5 中的項目越來越多,three.js 和 PBR 工作流的結合卻一直沒有被系統化地整理。

          和各位前端神仙一起做項目,也一起磕磕碰碰出了愛與痛的領悟。小小總結,希望 3D 去往 H5 的道路天塹變通途。

          本手冊主要分為兩大部分:

          Part 1 理論篇:主要讓設計師了解計算機到底是如何理解和實時渲染我們設計的 3D 項目,以及 three.js 材質和預期材質的對應關系。

          Part 2 實踐篇:基于 three.js 的實現性,提供場景、材質貼圖的制作思路、以及 gltf 工作流,并動態討論項目常常遇到的還原問題。

          本文主要面向剛接觸 3D 圖形學的設計師,僅截取了最常用的理論知識和大家一起學習;部分涉及技術美術或計算機圖形學的描述可能不甚嚴謹,希望大家多多交流討論哈。

          其實無論 H5 開發用到的是哪種 webGL,設計相關的材質制作基本還是基于 PBR 思路進行的,所以這邊建議各位親可以先去閱讀一下 Substance 官方寶冊《The PBR Guide》。

          Part 1 理論篇

          設計師在還原 3D 類型的互動 H5 項目的時候一定想過這個宇宙終極問題:為什么 H5/Web 實現的 3D 效果和 C4D 里渲染出來的差異那么大?

          其實這是我們對實時渲染引擎(UE、Unity、three.js 等)和離線渲染工具(Redshift、Octane、Vray 等)的差異存在誤解:一是離線渲染工具是基于真實光照環境來計算每顆像素的著色,實時渲染如果要實現這種效果需要耗費更多硬件基礎和算力去模擬光照(沒個好顯卡都開不動光追)。

          雖然 UE5 的實時渲染技術和硬件兼容性已經讓大家大吃一驚,但在實際項目,尤其是需要兼容低端設備的 H5 來說,渲染能力還是相對有限的。二是對于游戲或 H5 互動網站實際應用來說,流暢的互動體驗優先級往往高于畫面精細度,所以犧牲視覺保性能也是常見情況。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 1-Octane 離線渲染效果 vs three.js 實時渲染效果:材質細節、全局光照及投影、以及抗鋸齒表現差距明顯

          當實時渲染效果與設計預期差距過大時,設計師能多了解一些基礎的計算機圖形學,也許就能更好地和開發同學商討性價比更高的視覺實現和資源優化方案(以及更多 Battle 的籌碼)。

          1. 著色器與著色算法差異(硬核預警)

          首先我們要知道計算機之所以能在 2D 屏幕上畫出 3D 的圖像,是因為有著色器(Shader)在繪制,它將我們三維空間里的模型與光照信息進行轉換,并光柵化為二維圖像。在計算機圖形學中,著色器是用于對圖像的材質(光照、亮度、顏色)進行處理的程式。

          常用的著色器分為四種:像素/片元著色器(Pixel/Fragment Shader)、頂點著色器(Vertex Shader)、幾何著色器(Geometry Shader)、細分曲面著色器(Tessellation Shader)。

          像素/片元著色器與頂點著色器(Vertex Shader)在 webGL 處理過程中都有使用,頂點著色器先將模型中每個頂點的位置、紋理坐標、顏色等信息進行轉換裝配,再由片元著色器對 3D 信息光柵化并轉換成 2D 屏幕信息。(關于著色器差異,感興趣的同學可以直接跳到附錄查看。)

          著色器是怎么把頂點中所帶有光照、紋理等信息轉換并重建在二維圖像的像素中呢?GPU 中是透過不同的著色算法來實現的。

          一種是獲取每個三角形的插值(Interpolate)來實現,這種方法稱作 Per Vertex Lighting,但是當三角型很大的時候,插值往往不夠精準。此時還可以引用另一種方法 Per Pixel Lighting,計算每個像素的光照信息,獲得更好的渲染效果,但是往往也帶來更大的計算量。

          一般常見計算機圖形著色算法有三類:Flat Shading、Gouraud Shading、Phong Shading。這些算法雖然看起來和我們設計師沒啥關系,但事實上在后面了解 three.js 材質時,就會發現他們在呈現時的差異。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 2-Flat、Gouraud、Blinn-Phong 著色法比較 [ F1, ©?Stefano Scheggi ]

          平直著色法 Flat Shading

          這種著色法認為模型中所有面都是平的,同一個多邊形上的任意點的法線方向都相同。著色時,會優先選擇多邊形的第一個頂點或三角形的幾何中心計算顏色。這種著色法實踐上的效果很像低面模型,也比較適合使用在高速渲染的場景。值得注意的是,這種著色法難以做出平滑高光效果。

          高洛德平滑著色法 Gouraud Shading

          這是一種平滑的著色方法,在著色時會先計算三角形每個頂點的光照特性,利用雙線插值去補齊三角形區域內其他像素的顏色。這個著色法比起平直著色法增加了插值的細節,而且也比 Phong 著色法渲染單個像素的光照特性的性能要高。

          但是在渲染高光時,可能會因為無法獲取精確的光照值而出現一些不自然的過渡(或 T 型連接容易被錯誤繪制),此時可以考慮對模型進行細分或使用漫反射材質。

          Phong 平滑著色法 Phong Shading

          與 Gouraud Shading 不同的是,它會對頂點的法線進行插值,并透過每個像素的法向量計算光照特性。這種做法能繪制出精致、精準的曲面,但是計算量較大。Blinn-Phong 是 Phong 的進階版,著色性能更好,且高光彌散更自然。

          2. 基本光照模型 Illumination Model

          簡單了解計算機如何繪制 3D 圖形后,再來看看它要如何具體理解我們所設計的 3D 場景。

          3D 轉換成 2D,也就是 3D 柵格化的過程中,每一個像素的顏色是需要基于它所在的環境計算出來,而基于被渲染物體表面某個點的光強度計算模型就被稱為光照明模型(Illumination Model)或光照模型(Light Model),透過計算光照模型所得到表面位置對應像素顏色的過程被稱為表面繪制(Surface Render)。

          *請注意這里說的光照模型并不是指設計師理解的 3D 立體模型,而是指模型對象表面光照效果的數學計算模型。

          影響光照模型的因素有兩大方面,一是本身給渲染物體材質設置的各種光學特性(顏色反射系數、表面紋理、透明度等),二是場景中光源光及環境光(場景中各個被照明對象的反射光)。

          傳統光照模型都是對漫反射和鏡面反射的理想化模擬,如果要還原基于真實物理世界的效果,光照模型需要遵循能量守恒定律:一個物體能反射的光必然少于它接受的光。在實踐層面則表現為,一個漫反射更強且更粗糙的物體會反射更暗且范圍更大的高光,反之亦反。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 3-基于 PBR 的光照模型需要遵循能量守恒定律 [ F2, ©?Joe Wilson ]

          光照模型與著色組合在不同的渲染需求下也會有不同的應用:

          • 真實感渲染(Photorealistic Rendering):目的是基于真實物理世界對 3D 場景進行仿真還原。
          • 非真實感渲染(Unphotorealistic Rendering):也被成為風格化渲染(Stylistic Rendering),會更抽象化地對模型進行重繪。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 4-真實感渲染及非真實感渲染對比 [ F3, ©?Autodesk ]

          真實感渲染 Photorealistic Rendering

          考慮到真實感渲染對硬件的依賴,目前 webGL 中使用的一般以簡單的局部光照模型為主(只計算光源對物體的光照效果,不計算物體間的相互影響,我們看到的“假反射”通常透過貼圖來進行模擬),根據反射形態,經典的光照模型有下列幾種:

          • Lambert 漫反射模型:

          這種模型的粗糙表面(如塑料、石材等)會將反射光從各個方向反射出去,而這種光反射也稱為漫反射。理想的漫反射體我們通常稱作郎伯反射體(Lambertian Reflectors),也就是我們熟悉的橡膠材質。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 5-漫反射模型與其他光照模型對比 [ F4, ©?ViroCore ]

          • Phong 鏡面反射模型:

          這是一種以實驗及觀察為合成基礎的非物理模型。它的表面反射同時結合了粗糙表面漫反射和光滑表面鏡面反射,但 Phong 模型在高光處的表現有過渡瑕疵。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 6-Phong 鏡面反射模型視覺構成 [ F5 ]

          • Blinn–Phong 模型:

          是在 OpenGL 和 Direct3D 里默認的著色模型,一種調優后的非物理的 Phong 模型,頂點間的像素插值使用 Gouraud 著色算法,比 Phong 著色算法性能更好,而且高光效果也更平滑。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 7-Phong 及 Blinn-Phong 鏡面反射模型對比 [ F6 ]

          • Cook-Torrance/GGX 光照模型:

          如果你用過 C4D 的默認渲染器,那么一定在材質的反射通道設置中見過它倆。

          這是相對高級的光照模型,不同于 Phong 和 Blinn-Phong 模型僅僅對漫反射及鏡面反射進行理想化模擬,這兩個光照模型基于不同物理材質加入了微表面(Microfacet)的概念,并考慮到表面粗糙度對反射的影響,對鏡面反射進行了調優,使得高光的長尾彌散更加自然,也是目前 PBR 渲染管線(Unity、UE)中較常用的光照模型。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 8-Phong、Blinn-Phong 與 GGX 鏡面反射模型對比 [ F7, ©?ridgestd ]

          • 次表面散射模型 Subsurface scattering/SSS:

          終于有一個設計師們常見的概念了。次表面散射是指光穿透不透明物體時(皮膚、液體、毛玻璃等)的散射現象?,F實生活中,大部分物體都是半透明的,光會先穿透物體表面,繼而在物體內被吸收、多次反射、然后在不同的點穿出物體。以皮膚為例,只有大概 6%的反射是直接反射,而 94%的反射都是次表面散射。

          BSSRDF(雙向次表面反射分布函數)是用于描述入射光在介質內部的光照模型,目前也被應用在最新的虛擬角色皮膚實時渲染中;但由于 SSS 材質的計算需要依賴深度/厚度數據,所以 webGL 對這種高級光照效果的還原程度還是相對有限的。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 9-Unity 中模擬次表面散射光照模型效果 [ F8, ©?Alan Zucconi ]

          非真實感渲染 Unphotorealistic Rendering

          也就是我們常說的 3 渲 2,非寫實渲染風格也是從人們對 3D 場景套以 2D 繪畫或自然媒體材質需求而演化過來的。因此非寫實渲染技術實際上是不同光照模型+不同著色處理共同作用的風格化輸出,目前也被大量應用在動畫及游戲中,像《英雄聯盟:雙城之戰》《蜘蛛俠:平行宇宙》都是頂級三渲二大作。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 10-在不同通道中混合應用真實感渲染及非真實感渲染效果 [ F9, ©?Polygon Runway]

          • Cel Shading/Toon Shading:

          卡通著色,一種最常見的以 3D 技術模擬扁平風格的著色形式,通常以極簡的顏色、漸變及明確的外框線等漫畫元素作為風格特征。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 11-Blender 中不同類型的 Toon Shader 效果 [ F10, ©?Blendernpr]

          日本創意編程師 Misaki Nakano 制作了一個非常有趣的 Toon Shading H5 互動頁面,大家可以體驗一下不同著色形態下非常模型的視覺表現。點擊體驗: https://mnmxmx.github.io/toon-shading/dst/index.html

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 12-Misaki Nakano 的 Toon Shader 互動網站 [ F11, ©?Misaki Nakano]

          • Customized Shading:

          目前越來越多渲染器可支持設計師及工程師根據項目需求對著色進行定制化處理,以產出更具風格化和藝術化的著色效果。例如工業界插畫常用的冷暖著色(Gooch Shading),以及更具繪畫質感的素描著色(Hatching)及油畫水墨畫等自然媒體著色,都已經深入到了我們日常的創作之中。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 13-在 Unity 中,基于真實感渲染的貼圖效果與 NPR 水墨風格化著色效果對比 [ F11, ©?鄧佳迪]

          3. Three.js 材質著色對比

          說完真實感與非真實感渲染差異后,我們再來看看 Three.js 中的材質。

          和許多渲染引擎一樣,除了原生材質外,webGL 的材質和著色都是可以根據需求進行定制的,但這往往會也帶來較高的開發成本及兼容性風險??紤]到 H5 項目的實際應用場景,下表羅列了 Three.js 原生材質的對比,包含了材質特性優勢、貼圖差異及適用場景,大家可以基于項目需求快速選擇并混合使用:

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 15 – three.js 材質對比表

          4. 色彩描述與管理 Color Space

          雖然著色、光照模型以及材質渲染對 3D 表現有著最為直觀的影響,但 3D 工作流仍有一個隱秘而關鍵的環節——色彩管理。

          真實世界中按照物理定律,如果光的強度增加一倍,那么亮度也會增加一倍,這是線性的關系。理想狀態下,像素在顯示屏上的亮度也應為線性關系,才能符合人眼對真實世界的觀察效果(如圖 b:橫坐標為像素的物理亮度,縱坐標為像素顯示時的實際亮度)。

          但是顯示器的成像由于電壓的影響,導致輸出亮度與電壓的關系是一個亮度等于電壓的 1.7-2.3 次冪的非線性關系,這就導致了當電壓線性變化時,亮度的變化在暗處轉換時變慢,如果顯示器不經過矯正,暗部成色也會整體偏暗(如圖 c)。目前大多數顯示器的 Gamma 值約為 2.2,所以也可以理解 Gamma2.2 是所有顯示器自帶的一個遺傳病。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 15-紅色上曲線=Gamma0.45=sRGB Space;綠色下曲線=Gamma2.2=顯示器真實成像缺陷;藍色斜線=Gamma1.0=Linear Space 真實物理世界線性關系

          為了矯正顯示器的非線性問題(從圖 c 校正回圖 b),我們需要對它進行一個 2.2 次冪的逆運算(如圖 a),在數學上,這是一個約 0.45 的冪運算(Gamma0.45)。經過 0.45 冪運算,再由顯示器經過 2.2 次冪輸出,最后的顏色就和實際物理空間的一致了,這套校正的操作就是伽馬校正(Gamma Correction)。

          而我們常見的 sRGB 就是 Gamma0.45 所在的色彩空間,是 1996 由微軟與惠普共同開發的標準色彩空間。當照片素材一開始儲存成 sRGB 空間,相當于自帶一個 Gamma0.45 的遺傳病抗體,當它被顯示器顯示時,就自動中和了顯示器 Gamma2.2 的缺陷,從而顯示出與物理世界相符的亮度。

          另一個校正原因是因為人眼在接受光線時的敏感度也不是線性的,人對于暗部的感知更敏感,對高亮區域感知較弱,而且人眼感知光強度與光的物理強度也剛好是對數關系。為了在暗部呈現更多人眼可感知的細節,Gamma0.45 的色彩空間中(如圖 a),像素的實際亮度也會高于它的物理亮度。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 16-人眼感知光強度與發射光真實物理強度對比

          上面那一大段確實有點繞,但也就說回來為什么建議渲染時使用線性空間(Linear Space)了。因為在計算機圖形中,著色器的運算基本上都是基于物理世界的光照模型來保證渲染真實性的,如果模型的紋理輸入值是非線性的(sRGB),那么運算的前提就不統一,輸出的結果自然就不那么真實了。

          而在大多數工作流及渲染軟件中,大部分貼圖資源都是默認輸出 sRGB 的(設計師作圖環境一般也在 sRGB,所見即所得),而法線貼圖、光線貼圖等紋理(純數值類紋理,只用于計算)又是 Linear 的,這個部分就需要我們根據渲染引擎本身的特性,來判斷是否需要對不同的貼圖進行不同的“去 Gamma 化”處理了(WebGL、Unity、Octane 等)。

          將所有貼圖進行去 Gamma 化,統一為 Linear 空間后,再在渲染輸出時由引擎統一進行 Gamma 校正,這個時候在顯示屏里顯示的就是接近真實世界的效果了。

          更多色彩空間的實際效果比較,大家可以看下 Unity 的文檔:《Linear/Gamma 渲染比較》:https://docs.unity3d.com/Manual/LinearRendering-LinearOrGammaWorkflow.html

          回到 H5 所用的 Three.js,它的著色器計算也是默認在 Linear 空間,如果最終渲染時不轉化為 sRGB,在設備顯示時可能會造成色彩失真。在 three.js 中色彩管理的工作流會根據導入模型 Asset 的差異而有所不同,如果貼圖與模型是分別導入場景,則建議可嘗試以下流程:

          1. 輸入貼圖數據 sRGB to Linear: 含色彩的貼圖(基礎材質、環境、發光)設編碼為 sRGB(texture.encoding = sRGBEncoding),或將渲染設置 renderer.gammaInput 設為 True,可將原為 sRGB 的貼圖轉換為 Linear,而原純數值類貼圖(法線、凹凸等)仍舊保持 Linear;這一操作可保證貼圖輸入數據的正確性與統一性。

          2. 刷新材質:當材質編碼類型被修改后,需要設置 Material.needsUpdate 為 True,以重新編譯材質。

          3. 輸出渲染 Linear to sRGB: 校正渲染輸出值的 Gamma:

          renderer.gammaOutput = true; renderer.gammaFactor = 2.2;以供顯示屏正確顯色。

          《Part1-理論篇》就先告一段落啦,如果你偶發失眠,建議可以反復咀嚼延伸閱讀的內容。

          《Part2-實踐篇》會繼續完善 three.js 場景、材質貼圖的制作思路、以及 gltf 工作流,并動態討論項目常常遇到的還原問題。

          2022,咱們需求再見。

          附錄

          1. 著色器差異

          像素著色器 Pixel Shader

          也稱為片元/片段著色器(Fragment Shader), 為二維著色器。它記錄了每一個像素的顏色、深度、透明度信息。最簡單的像素著色器可用于記錄顏色,像素著色器通常使用相同的色階來表示光照屬性,以實現凹凸、陰影、高光、透明度等貼圖。同時,他們也可以用來修改每個像素的深度(Z-buffering)。

          但是在 3D 圖像中,像素著色器可能無法實現一些復雜的效果,因為它只能控制獨立的像素而并不含有場景中模型的頂點信息。不過,像素著色器擁有屏幕的坐標信息,可以依據屏幕或鄰近像素的的材質進行采樣并增強,例如,Cel Shader 的邊緣強化或一些后期的模糊效果。

          頂點著色器 Vextex Shader

          是最常見的 3D 著色器,他記錄了模型每個頂點的位置、紋理坐標、顏色等信息。它將每個頂點的 3D 位置信息轉換成 2D 屏幕坐標。頂點著色器可以處理位置、顏色、紋理的坐標,但是無法增加新的頂點。

          幾何著色器 Geometry Shader

          是最近新興的著色器,在 Direct3D 10 和 Open GL3.2 中被引用。這種著色器可以在圖元外生成新的頂點,從而轉換成新的圖元(例如點、線、三角等),而優勢也是在于可以直接在著色中增加模型細節,減低 CPU 負擔。集合著色器的常用場景包括點精靈(Point Sprite)生成(粒子動畫),細分曲面,體積陰影等。

          細分曲面著色器 Tessellation Shader

          在 OpenGL4.0 和 Direct3D 11 中出現,它可以在圖元內鑲嵌更多三角體。為傳統模型新增了兩個著色步驟(一是細分控制著色,又稱為 Hull Shader,二是細分評估著色,又稱為 Domain Shader),兩者結合可以讓簡單的模型快速獲得細分曲面。(例如,含細分曲面效果的模型加上置換貼圖就可以獲得極其逼真細膩的模型)

          2. 一些術語的簡單理解

          GL: Graphics Library, 圖形函數庫。

          webGL:Web Graphics Library,Html 5 可接入的 3D 繪圖協議/函數庫,可以為 H5 Canvas 提供 3D 渲染的各類 API。

          Z-Buffering:深度緩沖,3D 圖像在渲物體的時候,每一個生成的像素的深度會存儲在緩沖區中。如果另一個物體也在同一個像素中產生渲染結果,那么 GPU 會比較兩個物體的深度,優先渲染距離更近的物體,這個過程叫做 Z-Culling。當兩個物體靠很近的時候(16-bit),可能會出現 Z-Fighting,也就是交疊閃爍的現象,使用 24 或 32bit 的 Buffer 可以有效緩解。

          Rendering Pipeline:渲染管線/渲染流水線/像素流水線,為 GPU 的處理工作流,是 GPU 負責給圖形配上顏色的專門通道。管線越多,畫面越流暢精美。

          硬核干貨!3D to H5工作流應用手冊:理論篇

          圖 17-渲染管道細節工作流 [ F12 ]

          Rasterization:光柵化/點陣化/柵格化,就是將管線處理完的圖元轉換成一系列屏幕可視的像素,過程包括:圖元拼裝(Primitive assembly)-三角形遍歷(Triangle Traversal)- Pixel Processing-Merging。

          文章來源:優設 作者:ISUX


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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


          時間顯示的設計細節

          資深UI設計者

          背景

          “時間”作為人機交互界面中經常出現的元素,本質上都是為了去傳遞時間維度的信息。但是我們平時在使用一些互聯網產品時會發現,關于“時間”的顯示狀態或形式在不同場景、不同頁面里往往是不太一樣的,這是出于怎樣的考慮呢?今天我們就來聊一聊,如何在產品設計中把握“時間”顯示的訣竅,讓其在頁面中發揮最大的作用。

          “時間”元素的分類

          按照“時間”元素在頁面中的出現場景和所起到的作用,可以大致歸為以下幾類:

          A. 事件的關鍵構成要素

          時間作為描述整個事件的重要組成部分,缺失后會對原本所要傳達的內容產生嚴重的影響,進而影響用戶的使用預期和結果,比方說用戶可能不能以一個較低的價格完成商品購買,或錯過了產品發布會的時間。

          從3個方面,幫你掌握時間顯示的設計細節

          B. 行為的時間標記

          指用戶本人作為行為主體或行為的接收對象,在某一動作發生后為其所打上的時間標記,比方說“我”購買商品下單的時間或收到一封郵件的時間。

          從3個方面,幫你掌握時間顯示的設計細節

          C. 內容的附屬信息

          用戶在使用產品進行內容消費時,時間作為該條內容的附屬信息,起到補充說明的作用,比方說一條短視頻或新聞的發布時間。

          從3個方面,幫你掌握時間顯示的設計細節

          在上面的案例中,我們會發現“時間”在對應場景里所發揮的作用不同,用戶在使用產品時往往對時間存在不一樣的關注程度。因此我們在做頁面設計時,要根據具體場景和用戶訴求判斷“時間”元素的重要性和優先級,通常情況下:時間作為事件的關鍵構成要素>行為的時間標記>內容的附屬信息,之后再思考用什么樣的設計形式去展示來達到我們的目標。

          “時間”的呈現方式和運用技巧

          在討論“時間”元素的設計之前,我們先共識一些有關時間的理解和概念。時間可以劃分為“時間點”和“時間段”兩個維度,類似我們高中物理時學過的“時刻”和”時間間隔“的概念。

          拿開會舉例子:“下午 4:30 會議開始”、“下午 6:00 會議結束”描述的是事件開始、結束的時間點,而“整個會議持續 1.5 小時”、“會議時間為下午 4:30-6:00”描述的是事件過程的時間段;但是,我們在會議開始時也可以這樣講“會議將在 1.5 小時后結束”。

          通過上面的例子我們可以發下,同樣是描述一件事情,運用不同的時間點、時間段的方式去表達,意思一樣但卻傳遞出不一樣的情感,并且兩者存在如下的“換算”關系:

          1)時間段加上定語會變成時間點(但同樣是時間點,“下午 6:00”是絕對時間,而“1.5 小時后”是相對時間,剛好對應到我們設計時兩種時間戳類型);

          2)兩個時間點之間則表示時間段。

          所以,我們在平時表達或設計時,要先想清楚用“時間”是想側重表達某一事件、動作發生的即刻時間節點?還是想描述其所持續的時間過程?之后我們再針對不同語境去選取合適的文案和呈現方式。

          從3個方面,幫你掌握時間顯示的設計細節

          時間的呈現方式離不開:時間戳類型、時間顯示格式、時間顆粒度。其中,時間顆粒度指的是描述時間的最小單位,往往顆粒度越細,給用戶傳達的確定感越強(如轉賬時間是 12 日 15:15:20),對用戶的激勵作用越明顯(如距搶購結束僅剩 00 時 01 分 23.6 秒)。

          1. 絕對時間戳

          絕對時間可理解為事物發生時的確切時間,由具體日期(年、月、日)和時間(時、分、秒)組成。使用絕對時間戳的優勢是信息傳達精準,顯得正式,給人確定感和安全感,同時排布規整,便于形成認知習慣;但缺點是內容顯示過長不利于閱讀,并且占用空間較大。

          從3個方面,幫你掌握時間顯示的設計細節

          在時間顯示格式的選擇上,為了避免混淆,推薦使用文字格式或“-”分隔符來分隔日期,而“/”分隔符在不同國家有不同的展示順序習慣,容易造成誤解,盡量少用。

          從3個方面,幫你掌握時間顯示的設計細節

          時間顆粒度的選擇依情況而定,一般場景總結如下:

          從3個方面,幫你掌握時間顯示的設計細節

          2. 相對時間戳

          相對時間在產品設計領域通常是指內容生產、到達、或狀態發生改變時,距當前時間點的時間差值,多用于 push 通知、信息流產品,側重強調內容的時效性;而“倒計時”也算相對時間的一種,側重營造時間的緊迫感。使用相對時間戳的優勢是用戶辨識、理解成本低,不用通過計算來判斷時間過去或還剩下多久;缺點是不夠精確、正式,并很難衡量兩個時間點的臨近性。

          從3個方面,幫你掌握時間顯示的設計細節

          在使用相對時間時,要注意格式友好。時間單位可隨著時間的推移自動改變;數字不要過多,盡量取整;并且可設置其與絕對時間轉換的臨界點。

          從3個方面,幫你掌握時間顯示的設計細節

          總結

          在設計界面中的“時間”元素時,要遵循場景貼合、便于閱讀理解的總體原則;之后根據場景和目標,再選取合適的“時間”呈現方式(包括時間戳類型、時間顯示格式、時間顆粒度)。

          當時間作為“A.事件的關鍵構成要素”時

          一般情況下使用絕對時間,并且要看是為了強調某一關鍵時間節點,還是側重表達整個持續過程。此外,選用關聯場景的文案或者運用倒計時(相對時間)的形式,可一定程度上促進用戶更加集中注意力,提升對信息的關注度,并達到特殊的激勵作用和轉化效果。

          當時間作為“B.行為的時間標記”時

          該場景通常是為了追求確定感,通過提供精準的時間和日期便于用戶定位到過去或將來的某個時間點(段)去查找、回顧相應內容,因此大多數采用絕對時間,時間顆粒度依具體情況而定。

          當時間作為“C.內容的附屬信息”時

          如果所設計的產品供給內容的更新速度快,用戶活躍度高,并且此時內容的時間信息準確性不那么重要反而更側重于內容的時效性,那么通常會使用相對時間。部分信息流產品(比如新聞資訊類、社區類)會在列表頁使用相對時間,在詳情頁使用絕對時間,時間顆粒度也是依情況而定;并且會隨著時間推移,在某一時間節點前把相對時間轉換為絕對時間。

          文章來源:優設  作者:VMIC UED


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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


          如何提升表單的易用性及數據量化

          資深UI設計者

          表單在B端產品中是重要的組成部分,設計表單是比較考驗設計師綜合能力和設計細節的。一定程度上,表單設計的好壞也決定了產品的成敗。


          在實際項目中隨著B端產品的復雜化,出現冗余的視覺干擾信息,降低信息傳達的效率,使得用戶認知成本高,操作難度大。那么對于表單如何提升表單的易用性又該如何數據量化易用性呢?本文從4大方面闡述全面提升表單的易用性并驗證。


          一、表單的構成及應用場景


          表單由表單標簽、表單域、提示信息、操作按鈕組成。


          二、為什么要提升表單的易用性


          在我們設計B端產品的過程中,總會遇到用戶信息填寫邏輯混亂、資料收集不全的狀況,導致用戶在瀏覽和編輯時的操作體驗大打折扣。主要反映在以下幾個方面:


          1、用戶瀏覽信息順序混亂,信息層邏輯不清

          2、不同信息內容風格及交互不統一,用戶難以建立統一心智

          3、產研協作與資產沉淀之間有斷層,無法有效沉淀與跟蹤管理

          4、整體頁面操作時間長,用戶跳脫率高

          5、用戶客訴數據高



          三、如何提升表單易用性


          提升表單易用性的4大原則:易閱讀 、易操作 、安全感 、所見即所得


          1、易閱讀


          a、采用扁平化設計,化繁為簡,去除冗余的視覺干擾,使得頁面更加簡潔清晰。

          如:當必填特別多時,就不用都標出來了,只需要單獨標出非必填項即可,最大化得信息降噪。


          b、盡量采用單列布局,視覺動線流暢,不容易遺漏信息;按Enter換行,可以最大程度得提升表單的輸入效率。此處的用戶心智與操作效率比屏幕利用率更為重要。


          c、面對多行或復雜表單可以采用邏輯分組+合適的折疊度,提高頁面有效信息的透傳,增加用戶填寫表單的效率,讓用戶快速填寫,快速離開。


          2、易操作


          a、為用戶提供合適的默認項,可以減少用戶操作步驟,提高填寫效率。


          b、在表單中填寫上部分信息即可自動獲取下面信息,無需用戶再次填寫,也大大增加了操作效率。


          c、根據搜索、聯想,自動現實匹配信息,大大減少用戶記憶和認知的負擔。


          d、對于一些標準證件、文本信息的錄入,可以通過OCR識別文件內容。當用戶上傳圖片后,運用圖像識別技術提取關鍵信息并自動錄入。

          如果圖片不清晰或存在水印,此時也應提供修正渠道,可逐一校對并修改。


          3、安全感


          a、操作前給予正確提示,避免用戶重復試錯,缺乏安全感。


          b、操作中給予實時反饋,為用戶封閉不正確的道路。


          c、操作后的提醒和糾錯,告訴用戶哪里錯了,而非簡單粗暴的錯誤警告。


          4、所見即所得


          邊設置,邊預覽,適合對移動端、小程序、H5的配置。


          四、如何量化體驗度量衡


          通過用戶點擊數據,輔助設計洞見。從4個方面量化體驗度量衡:任務完成率、任務完成時長、必填項目數、易用度評分


          1、任務完成率

          通過埋點獲取數據使用公式進行計算或讓技術搭建看板直接看。新版上線后,用戶會有一定的學習適應周期,最好選取一個月以后的數據,比較具有參考意義。


          2、任務完成時長

          數據分析發現,任務完成時長數據呈現偽正態分布狀態,取眾數最具代表意義。


          3、必填項目數量

          結合業務場景,減少不必要的必填項,只設置必要的信息填寫,能自動獲取則自動獲取,減少操作步驟,增加操作效率。


          4、易用度評分

          通過在產品后臺投放調研問卷,獲取真實的用戶,使用登門檻效應讓其進行評分。最后可把被篩選的對象圈到訪談對象池,有機會可以成為產品成長用戶。


          五、總結


          以上就是對于提升表單易用性及驗證的思考,總結如下:


          對于用戶來說

          提升表單易用性可以提高信息內容理解和操作效率,更便于管理賬戶

          對于產品來說

          提升表單易用性可以提升獲取用戶和企業信息內容的效率,優化企業框架結構,提升信息質量

          對于設計來說

          提升表單易用性可以提升信息獲取效率,節約設計和開發成本


          文章來源:站酷   作者:牛肉咖喱garry 

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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

          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合