<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>

          首頁

          體驗設計構建品牌價值-打造影響用戶心智的價值連接

          seo達人


          01.前言

          總有一些人會讓你感覺格外親近,總有一些事會在不經意間打動你,慢慢的深入人心,是什么讓你感覺親近、愉悅、甚至興奮?今天這篇文章主要從產品設計的視角分享一下深入人心的產品設計方法。

          a

          02.事勢之流 相激使然

          “世事的變化趨勢或態勢是各種因素、力量相互碰撞、激發的結果”。同樣想要讓你的產品深入人心,本質是我們的產品要給用戶提供獨特的價值,而價值的產生可以理解為一個形象在用戶心智中的建立,這里的形象類似于品牌VI,但絕不止于視覺層面,其實可以由多個維度構成。通過不同的維度影響用戶的使用體驗,最終形成產品的品牌價值。

          我們可以把品牌價值理解為“人物個性”,美國心理協會(APA)將個性定義為“在各種場合、隨時間變化,能夠影響多種特征行為模式的個體的獨特心理特質?!?/span>

          產品的個性會影響用戶的感受、思考、處理以及最終的結果例如,當用戶挑選并投遞一個職位時,她希望聽你成熟的建議來引導她。將品牌與幾種典型的人物個性關聯起來,就能創造關聯性更強的故事,更容易使用戶投入。換言之:人與人更容易親近。如果你的品牌感覺像“人”,用戶就會更親近。

          d

          03.找到“人物個性” 明確品牌價值

          定義“人物個性”,就是去思考如何面對用戶,如何以最好的姿態向用戶展示自己,首先要建立有效的價值體系。這里我們通過招聘業務的一個項目逐步講解一下。

          我們知道下沉市場的招聘環境十分惡劣,存在各種虛假信息的問題。結合這個背景我們對藍領用戶的求職現狀進行了一系列詳細的調研,收集了用戶不同層級的需求(如下圖)。 

          圖片

          我們可以發現用戶最基礎的需求只是要求職位信息的內容真實,加分需求則是對職位品質提出了期望,在保障職位信息真實的前提下,需要提供更高質量的職位。結合需求的提及率和需求等級,我們輸出了產品的價值體系(如下圖)。 

          圖片

          如圖所示,產品的價值體系分為三個層級,分別是產品價值、用戶價值和品牌價值。

          強調產品價值我們結合用戶的基礎需求,根據需求內容定義“真實”內容,例如:真實的薪資、真實的工作環境、真實的工作內容等,第二步則是通過產品底層邏輯或用戶的評價反饋系統來創建這些“真實”。

          提升用戶價值用戶價值=產品價值-使用成本,例如:用戶要購買蘋果,A商店的蘋果質量較高,但距離較遠。B商店的蘋果質量一般,但距離很近。則用戶價值=蘋果質量-商店距離。通過傳遞“真實”的方法降低用戶選擇職位的成本,從而提升用戶價值。

          形成品牌價值品牌價值的形成則是通過多個體驗維度的同時影響,以及用戶不斷的使用產品感受用戶價值,長期積累形成的。

          f

          04.發掘用戶感知 拆解用戶認知

          基于前面建立的產品價值體系,我們來試著思考以下幾個問題:

          1.我們的品牌要說什么,怎么說?

          2.在價值形成的不同階段,我們的品牌分別對用戶說什么?

          3.用戶希望得到什么,用戶卻只能感受到什么?

          4.用戶此刻正需要什么,用戶此刻最不擅長什么?

          創造價值不是目的,只有將價值有效的傳遞給用戶,用戶通過感受價值,從而更好的理解和使用產品。我們通過感知+認知的方式重新構建用戶體驗。

           

          結合用戶對直接/間接競品的場景舉例我們可以發現,用戶對價值感知可以分為四個維度: 

          圖片

          產品體驗“產品”可以理解為我們售賣給用戶的商品,例如:京東的電器、招聘業務中的職位或者企業。

          功能體驗“功能”類似于服務,例如:7天無理由、簡歷優化。

          文案體驗:“文案”指的是頁面中信息字段的表達方式,是否足夠詳細、精準、及時等。

          界面體驗“界面”其實就是頁面的UI風格視覺語言。

          同時我們發現用戶認知的“真實”與以下幾個詞有很高的相關性 。

          圖片

          接著我們根據價值體系的目標,通過以上四個維度拆解具體的優化內容(如下圖) 。

          圖片

           

          05.體驗戰略建立有價值的連接

          清楚了價值目標,以及用戶的認知和感知方式,我們開始將價值與用戶做連接,也就是前面提到的價值傳遞(傳遞“真實”)。根據下圖中的公式舉兩個例子。

          圖片

           

          打造產品體驗: 

          圖片

          左圖是舊版的首頁,右圖是優化后的頁面,我們可以直觀的感受到頁面兩個產品的調性或者說頁面的氣質截然不同。我們來分析一下兩者的區別,優化后的首頁,在主視覺的位置,打造了“每日嚴選”。通過這個模塊快速建立用戶對產品的初步認知。這個模塊的目的是為求職意圖強烈但職位選擇不明確的用戶提供高質量的職位。這類用戶在整體用戶中的占比最高,同時這類用戶的痛點十分明確,他們既希望選擇一個高質量的職位,但自身缺乏對職位品質的判斷能力。

           

          打造服務體驗:

          為求職者提供了“安心投”服務,在用戶投遞前、投遞中、投遞后三個節點分別展示求職相關的保障,降低用戶求職顧慮和心理擔憂,提高投遞率,服務包括:

          A.求職保險求職過程中被騙造成的經濟損失平臺會予以適當賠付

          B.隱私保護保護用戶的相關信息,并進行加密處理

          C.免打擾保護保障用戶的私人空間不被打擾

          圖片

          在職位描述(左圖)的模塊后面我們加入了“安心投”,用戶了解工作內容后的第一時間告知他投遞后我們會有哪些保障服務,從而減少他在投遞時的心理擔憂。

          其次是在企業規模(右圖)的模塊中加入了“用戶評價”,露出更多真實性相關的信息輔助用戶對職位/企業的品質進行判斷。

          同樣在后續的微聊頁面我們也加入了“安全投”的提示,并且在用戶投遞后會再次與他確認我們為他提供了哪些安全保障服務,進一步延伸用戶后續的操作流程。

          圖片

          06.總結

          圖片

          其實品牌形象建立的過程就是我們與用戶交朋友的過程,在這個過程中我們的個性(價值)被用戶逐漸發掘和欣賞,促使我們的關系越走越近。項目初期我們可以通過一些引導、開屏、二樓等方式對品牌進行宣傳和曝光,同時我們不斷提升自身的產品品質,提高產品價值。中期我們需要進一步優化用戶在多個維度的體驗感受,提升用戶價值(用戶價值=產品價值-使用成本),降低用戶使用成本,進而提高用戶使用頻次,以建立長期有效的價值連接。在這個過程中我們斷優化體驗,與用戶共同成長,形成牢不可破的信任價值體系,即成功搭建了一款深入人心的產品。


           

          原文地址: 58UXD(公眾號)

          作者:環鐵藝術家

          轉載請注明:學UI網》體驗設計構建品牌價值-打造影響用戶心智的價值連接

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

          截屏2021-05-13 上午11.41.03.png

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

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



          這些細節創新,大廠設計師都不一定全知道!

          seo達人



          圖片

          雖然粗看沒多大問題,但確實是一個很常規的設計,沒有亮點。

          試想,我們是否可以在布局、圖標圖形、色彩質感等做一些細微的突破,這些地方稍微做些改變都可以使得界面變得更好。

          圖片

          再比如上面這個作品,也是同樣的問題,缺乏一絲靈魂。之前看很多設計師作品集里面包裝的作品,就是這樣設計的。

          雖然現在UI趨于模式化設計,但是我們在確保體驗最優的同時時,還是可以做一些創新設計。比如布局、圖標、色彩、質感、雜志化等方向發力,下面我們來看看如何做一些差異化設計。

           

          差異化圓角層疊布局

          俗話說,當然不知道如何去做創新時,可以去找一些好的概念設計,從里面挖掘一些新的設計想法,用在自己項目中。

          圖片

          例如上圖,我們將卡片圓角化與底部地圖相呼應,整個設計看上去就有了細微縱深感。如果上下滑動時,再配上視差動態效果,那么細節也會更豐富。

          圖片

          上圖的設計也是同樣的思路,圓角圖片作為背景,大圓角卡片在上層疊加布局,增加細節豐富度。

          再來看一些優秀案例

          圖片
          圓角化布局設計在功能詳情頁的應用。
          圖片

          半圓角化布局設計的應用案例,只有一個邊用圓角來布局設計,另外一邊直角布局。

          通過上面一些案例,可以提取一些布局方案用在項目上,如下圖所示。

          圖片
          下面這個案例通過圓角卡片來布局,貫穿所有。

          圖片

          看到這,大家面對改版或者0~1的探索,布局上應該有新思路了,而且很多布局都是不斷嘗試與打磨出來的,下面我們繼續看下圖標如何做差異化設計。

           

          打破常規的圖標

          圖標可以說在設計中非常重要,承載著品牌性格傳遞,表達產品的氣質,但也是我們最容易忽略的地方。

          圖片

          如果纖細的圖標看膩了,是不是可以嘗試下這種粗線性圖標

          圖片

          再或者就是將圖標logo化,設計更有趣味性一些。這些圖標應用場景可以是功能頁面,比如像智能家居、智能鏡等場景中。

          圖片
          “點”來貫穿整個圖標設計,下圖,韓國NAVER的圖標設計,通過點與線的集合來打造記憶點。
          圖片

          Naver

          圖片
          圖標與品牌色集合,這種雖然現在應用較多,但是可以從不同角度來切入。比如上圖中使用填充品牌色與斷線集合,形成一種不一樣的設計思路。
          圖片
          最后一種思路圖標進行品牌化設計,整套圖標延續品牌DNA特征
          上圖app設計,里面圖標就是將品牌DNA符號延續到整套系統里面,包括底部bar的功能圖標和表情符號等。

           

          彌散光感漸變背景

          很多情況下會遇到需要做詳情頁或者個人頁面,這時候就會涉及到頭像與背景的關系設計。目前設計較多的方式就是高清大圖、品牌圖形、漸變色等。那么還可以用下面這種思路。

          圖片
          使用彌散光感漸變作為背景,相對于單一的漸變色,會多了一絲細節在里面。
          好了,今天分享就到這,早期我們在做創新探索時候,不要懼怕太過于概念,如果一直被這個限制,就難以打破思維的墻,做出來的設計幾乎很平庸。我們還是敢于挑戰自己,善用逆向思維。

           

          原文地址:功夫UX (公眾號)
          作者: 功夫UX
          轉載請注明:學UI網》這些細節創新,大廠設計師都不一定全知道!

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

          截屏2021-05-13 上午11.41.03.png

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

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


          競品分析:抖音VS快手

          資深UI設計者

          隨著用戶體量的變化和短視頻平臺的規范化,抖音的產品定位也相應的變成了“抖音,記錄美好生活”。在往后用戶量不會再有大規模變化的增長,而外部競爭例如快手等依然不斷增長的情況下,抖音是如何發展穩固自己的短視頻“一哥”地位呢?

          一、短視頻行業發展現狀

          短視頻行業在2016年之后呈井噴式增長,移動端時代加速了短視頻行業的發展,近年短視頻平臺不斷在商業模式上進行探索,一方面成為創新性新媒體營銷平臺,另一方面也結合直播帶貨迎來新的增長點,短視頻營銷的市場模式逐漸受到認可,也成為短視頻媒體平臺的主要收入來源。

          數據顯示,2020年中國短視頻市場規模已達到1408.3億元。

          抖音、快手是目前短視頻行業頭部平臺,但抖音在社交和移動端支付等業務發展加持下,規模優勢逐漸拋開快手。關于短視頻用戶最常使用的產品調查結果顯示,抖音以70.9%的占比排名第一,快手占比52.3%。

          面對競爭,快手積極尋求資本化,但其營收快速增長的同時伴隨著虧損持續擴大,高收入由高成本帶來,商業轉化能力并沒有較大提升,長期來看發展模式存在風險。

          抖音及快手在短視頻領域頭部優勢明顯,快手發展起步早,用戶基礎深厚,且積極發展電商和游戲直播等業務,成為頭部典型代表;抖音雖然發展時間較短,但追趕勢頭明顯,入駐KOL數量多,帶貨推廣情況良好,也成為用戶最多的短視頻平臺。

          數據顯示,受訪用戶最常使用短視頻平臺排名中,抖音以45.2%的占比排名第一,快手和嗶哩嗶哩分別占比17.9%及13.0%,排名第二及第三。

          其他字節系短視頻產品如西瓜視頻、抖音火山版等占比也達到4.3%和1.6%。抖音憑借其內容分發機制優勢成功俘獲用戶的青睞,成為用戶最常使用的短視頻應用;同時,快手用戶黏度較低,逐漸被抖音拉開差距,并且受到其他平臺追趕。

          1. 政治因素

          2014年8月,中央安排部署新措施,宣布大力實施創新驅動發展戰略, 積極推動傳統媒體數字化、網絡化、智能化發展。2016年,為貫徹中央部署,各種創新型短視頻app的上線了,短視頻形式受到越來越多媒體和創作者的關注。這對于短視頻app市場無疑提供了一個巨大的市場開發空間。

          2. 經濟環境

          短視頻的快速傳播使其市場規模也實現了高速擴容,各大短視頻在創造巨大流量的同時,其市場規模也在飛速增長。根據中國網絡視聽節目服務協會數據,2018年我國短視頻行業市場規模達到467.1億元,較2017年的55.3億元增長744.7%。

          數據顯示,2020年中國短視頻市場規模達到1408.3億元,繼續保持高增長態勢,2021年預計接近2000億元。近年短視頻平臺不斷在商業模式上進行探索,一方面成為創新性新媒體營銷平臺,另一方面也結合直播帶貨迎來新的增長點,市場仍將進一步發展。

          3. 文化環境

          截至2018年12月底,我國短視頻用戶規模達6.48億,同比增長58.05%,高出長視頻用戶0.36億,網民使用比例達78.2%;2019年6月,中國短視頻行業的用戶規模達8.57億人。

          同時,短視頻用戶使用時長占總上網時長的11.4%,超過綜合視頻(8.3%),成為僅次于即時通訊的第二大應用類型。

          2020年,短視頻月總使用時長同比上漲1.7倍,全面超越在線視頻,成為僅次于即時通訊的第二大行業。在移動互聯網總使用時長增量中,短視頻占了33.1%,即時通訊占了18.6%,綜合資訊占了9.7%。2020年已超7億人,預計2021年增至8.09億人。

          4. 科技支撐

          • 智能手機普及和網絡環境的優化,提高了短視頻用戶的流暢體驗,成為短視頻用戶規模增長的直接動力。
          • 基于人臉識別和AR等技術在短視頻上的應用,提高了短視頻用戶體驗的豐富性和趣味性,進而增加用戶使用時長,強化用戶粘性。
          • 大數據,圖像識別等技術推動內容數據和用戶數據更加精細化,進而試下內容和用戶的精準匹配,極愛去哪個用戶短視頻內容獲取的個性化體驗,增加用戶忠誠度。

          二、競品分析

          1. 基礎信息

          2. 產品迭代

          通過以上兩個產品歷史迭代情況可以看出來,雙方在功能上都越來越相同,這也是基于用戶體驗改進和市場變化而衍生出來的:

          抖音:可以明顯的看到抖音的更新重點放在了用戶體驗和更新社交屬性上,除了優化產品,修復問題,多次大量上架新增各種特效、道具、濾鏡和活動,提供了工具輔助內容制作,大大提高了其創造性、便利性、娛樂性和用戶生產內容的動力。

          另外,抖音的“朋友”板塊新增了產品的社交屬性,讓其定位多元化,不局限于單一的短視頻功能,也提高了用戶使用產品的可能性?;诨ヂ摼W+的大數據時代,抖音也不斷更新算法,根據用戶日常體驗,推出了智能搜索和發現優化。

          快手:由于產品定位不同,所以快手并沒有跟抖音一樣更新豐富的濾鏡、道具等功能,產品更新日志絕大多數都是“問題修復以及性能提升”和“優化用戶體驗”兩條。

          在8.0.0的版本是快手產品更新最為關鍵的一次,新增“多入口內容”、“沉浸式上下滑體驗”、“瀑布流”,此次更新之后快手用戶的日均使用app時間提高了30%。而在之后的更新中,上下滑體驗也被應用于發現頁和同城頁,旨在留住用戶,獲取用戶使用時間,開發新用戶。

          3. 產品用戶

          1)用戶地域分布

          抖音:

          source:百度指數

          快手:

          source:百度指數

          數據顯示,兩個產品的用戶地域主要都是分布在華東、華南地區,呈現由東到西、由南到北、由沿海到內陸擴散的局勢。

          這很大一部分程度上是因為沿海地區的經濟發展迅速、生活節奏快、工作壓力大導致其居民易產生焦慮、焦躁、空虛等現象,表達輕松、搞笑、美好形象的短視頻的出現可以讓他們有短暫的放松時間和對自己的精神壓力的部分釋放,這極大地促使他們對短視頻App有了更高頻率的使用。

          雖然兩款產品的用戶地域分布大相徑庭,但是還是有一定的區別:快手相對于抖音其用戶比例中北方用戶占很大一部分,比如山東、河北等地。

          而抖音則更偏向南方用戶,這主要是因為用戶性格跟產品定位的契合度的關系。北方人性格豪爽,重情重義,更多的偏愛生活化的東西,喜歡真情實感接地氣的表達真善美;南方人追求精致、美好的生活的狀態。差異化決定了兩款產品有不同的適用人群。

          2)年齡和性別分布

          抖音:

          source:百度指數

          快手:

          source:百度指數

          數據顯示,兩款產品都具有明顯的年輕化特點,用戶人群年齡段主要分布在20~39歲之間,這一部分群體主要是90后、00后,新社會下成長起來的具有新思想的自由個體,接受新事物的能力強,富有創造性,他們可以快速獲取并進行信息更替和傳播。

          就成長層面來看,這部分人群也處在人生拼搏的階段,壓力相對較大,更容易產生焦慮的心理狀態,短視頻可以暫時性在一定程度上減輕他們的焦慮感,也可以豐富他們的生活,滿足他們足不出戶在家里就可以了解熱點資訊的需求。而該部分人群也逐漸走向社會經濟舞臺中央,客觀上也有利于抖音帶貨等商業模式的開展。

          3)用戶興趣

          抖音:

          source:百度指數

          快手:

          source:百度指數

          可以看出來兩款產品用戶在興趣愛好上基本一致,影視音樂、軟件應用、資訊類的視頻播放量較高,其他各分類項目的占比也比較穩定,影視音樂一直處于領先地位。

          其中醫療健康的占比增速最大,這跟近幾年的新冠疫情有直接的關系,也由于生活水平的提高和理念的進步,人們更加關心自己的身心健康。

          總的來說,兩款產品的用戶差距在逐漸縮小。

          抖音:最初的目標用戶是潮流酷炫的年輕群體,平臺最初的內容運營是往偏時尚方向布局,吸引高校年輕人進行創作,最早贊助的綜藝是“中國有嘻哈”這類以“潮為特征的節目。年輕的一二線地區的時尚人群是抖音的種子用戶。之后隨著用戶數的增長,平臺內容逐漸豐富,用戶群體(覆蓋區域、年齡分布)等分布更加均勻。

          快手:快手最初沒有刻意進行內容引導,但是其普惠的流量分發方式對當時缺乏針對性的社交、娛樂產品的下沉市場用戶有極大吸引力,因此快手的種子用戶是由下沉市場(尤其是北方地區)的用戶構成。但是由于快手之后在垂直領域的突破,目前快手的用戶結構也比之前更為均衡。

          4. 產品主要功能對比

          左:抖音 右:快手

          在快手8.0.0版本之后,首頁視頻也采用了沉浸式上下滑的模式,這一點也是借鑒了抖音的首頁,可以更快速直接的提供給用戶短視頻體驗,也更容易留住用戶。

          點贊方式都采取了雙擊點贊或圖標點贊。

          抖音的主頁面除了推薦列表,還有“朋友”和“附近”,而快手卻把“附近”這一模塊放在了底部的標題欄里面。

          抖音左上角有專屬直播通道;快手放置了個人中心的入口,直播入口則放到了新建頁面里。

          抖音評論展開視頻播放界面維持原狀,一部分視頻會被評論遮擋;而快手打開評論后,播放界面則會整體縮小至評論上方,雖然不會擋住視頻,但是由于太小可能會導致觀看效果不理想。

          抖音在播放界面左滑會直接進入作者主頁查看詳細信息,而快手則會拉出作者其他的作品列表,如果要進入作者主頁需要點擊頭像才能進入。

          關注圖標在彈出頁面也會顯示,但是抖音的更醒目。

          抖音搜索界面有榜單排名可以直接查看熱點,方便接觸時尚資訊;而快手則放置了各項的分類條目,比較生活化。

          抖音搜索欄有掃一掃功能,思維邏輯適合市面上很多app,用戶容易適應。

          抖音在最新版本里“附近”欄目里新增了“學習”欄目,兩者可以切換;附近同城也新增了數據檢測和類似“朋友圈”的功能;快手在同城新增了“校友”這一玩法,社交屬性大大增加。

          抖音在“消息”界面歸類了粉絲新增、互動消息、系統消息和私信四種基本通知,“可能認識的人“被歸類到了”粉絲‘中;快手直接在“消息”界面推薦了可能認識的人。

          抖音群聊歸類在“消息”;快手把群聊放在了個人主頁。

          抖音的輔助拍攝工具庫(濾鏡、特效等)相比于快手來說大很多,玩法也多樣。

          總的來說,在瀏覽方式上,快手已經借鑒了抖音的“沉浸式”上下滑動的模式,但仍然保留了一些自己的東西,但是就作者體驗來看,產品形象為簡潔、方便的快手,反而越來越有一些畫蛇添足的味道:

          • 在體驗過程中,左滑的新作品小界面和評論播放界面縮小都由于尺寸太小而造成觀看效果不佳
          • 直播入口不能直接進入而需要多次點擊不太方便
          • 消息界面太過冗雜

          三、盈利情況

          消費者提出需求,生產者根據需求研發產品、完善產品、更新產品,而產品必須要在滿足消費者需求的同時給創作者帶來利潤,才能形成一個完整的閉環。其中產品質量決定了它所能帶來的利潤,而利潤又反過來直接決定了產品的走向。

          下載量對比:

          source:七麥數據

          數據顯示,在去年11月到今年10月的時間里,抖音的下載量雖然處于波動狀態但是一直領先于快手的下載量,平均保持在180000左右,而快手一直保持在100000左右起伏不大。

          收入量對比:

          source:七麥數據

          可以很明顯的看到,抖音的收入幾乎是快手的3~4倍,而短視頻平臺的收入主要來自于廣告收入、直播打賞收入和電商分成收入三個方面,而在其中,廣告和直播打賞的收入占總體收入的89%,盈利模式和收入結構不同:抖音重倉廣告VS快手重倉直播,這也反應了其商業變現成熟,但是多元化程度不夠的弊端。

          1. 廣告變現

          抖音廣告收入占比80%:抖音中心化的分發機制,導致特別容易打造爆款,特別容易聚集流量打造名聲,因此廣告占有很大的優勢,而廣告的盈利模式有很大的利潤率,所以抖音的80%的收入都來自廣告。

          抖音收入來源分配比重

          2. 直播打賞

          快手直播收入占比60%:快手倡導粉絲經濟和社區文化,使得KOL與粉絲之間的粘性很大,因此做直播的利潤空間就顯得非常大,雖然沒有廣告收入的利潤多,但是收益平穩,也是快手的主要盈利方式。

          快手收入來源分配比重

          3. 電商分成

          短視頻電商行業主要有三種運營模式:

          1. 電商平臺向短視頻平臺薦物,商品短視頻欄目等內容生產者開始發力。
          2. 電商平臺和短視頻平臺合作,為電商平臺引流。
          3. 綜合垂直類短視頻平臺,實現內容分發和購買一體化。

          1)產品電商發展歷程

          抖音:

          快手:

          可以看出抖音相比于快手更先于鋪墊電商業務,而且在之后的產品上線、功能完善更替、迭代升級和營銷上面更頻繁也更為完善,這也是抖音充分發揮了大數據、大流量的作用。

          在2020年10月抖音實現了電商業務的徹底閉環,也奠定了抖音在電商業務上超過快手的基礎。

          2)服務定位

          3)具體分析

          生產群體:

          快手:頭號主播、精通電商的主播達人、公會和線下個體賣家等。

          快手的這些電商達人大多有一個共同的特點:粉絲數量在幾十到百萬不等,有一部分具有一定的帶貨經驗,甚至很多人本身就是淘寶中小店家入駐快手。比起頭部網紅,她們在直播展示、銷售技巧、促進成交等方面有著顯著的專業性。

          抖音:以網紅達人為主.線下商家為輔。

          目前在抖音上賣貨的主要仍是以網紅達人為主。據相關數據顯示,抖音達人、網紅主播帶貨的方式以拍攝短視頻為主,在視頻中放上同款衣服的鏈接,實現邊看邊買,但是這也對視頻的內容質量有很高的要求。

          商品類型:

          快手:商品類型多樣,涵蓋日用品、化妝品、衣服、食品等。

          快手主播、用戶甚至商家賣的商品五花八門,其上架商品的屬性實在跟快手的產品定位及其用戶屬性不謀而合。

          抖音:注重“調性”,商品最多的類型為衣服,而且是潮流穿搭。

          抖音仍是很講究“調性”。相關報告顯示,抖音目前賣得最多的商品是衣服。而且是潮流穿搭,配上長得好看的帥哥美女的視頻帶貨,用戶很容易被種草安利然后拔草,同時通過補貼和發放優惠券的形式,刺激用戶下單。

          大局來看兩款產品的銷售模式是基于其市場定位的:快手用戶購買商品,可能更多地是出于對主播的愛和信任,也就是信任電商;而抖音用戶購買商品,往往是由于視頻的內容足夠優質,也就是興趣電商。

          四、總結與建議

          總的來看,抖音重分析,內容分發去中心化。抖音在生產內容簽約了一批網紅、達人,通過MCN機構,持續穩定的輸出高質量內容,PGC覆蓋范圍廣,但是如何保證普通用戶不丟失掉自主生產內容的積極性,打造PGC+UGC完美結合的體系。

          快手內容分發去中心化,重視普通用戶的UGC生產力,輕運營。快手得益于三五線城市的下沉用戶,而這部分用戶在生活中缺少表達的機會,但是具有表達欲望,所以造就了快手的內容生產主力軍。

          由于當前的網絡用戶主力軍仍是90后、00后,年輕張揚、個性活潑的調性符合抖音的產品定位,再加之其運營的力度、體系的成熟和產業鏈的完整,所以抖音在大數據、大流量基盤的加持下,牢牢站穩了短視頻“一哥”的位置。

          建議

          1. 注重內容屬性,不論是抖音還是快手不論是視頻內容本身的質量還是商品的質量,雖然在大IP的加持下行業異?;鸨菑拈L遠來看,只有產品本身具有高質量屬性,才能獲得用戶認可;
          2. 未來在電商業務方面必定還會有新的發展,抖音已經有了更為完整的產業鏈閉環,快手應該加快建設完整體系;
          3. 短視頻行業競爭強烈,在不斷的迭代出現了很多增值服務,但是應該化繁為簡,從用戶的實用性和便捷性考慮,這樣產品跟用戶之間才能保持持續穩定的聯系;
          4. 抖音應該促進普通用戶的生產創造性,支持UGC內容的生產,避免同質化內容嚴重。

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

          文章來源:人人都是產品經理  作者:Ryan_
          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

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

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




          騰訊公益小紅花火爆全網,背后的設計思維是什么?

          ui設計分享達人

          今年是騰訊發起99公益日的第七個年頭。騰訊公益不僅在配捐機制、產品體系、企業聯動、公益基礎建設上全面升級,還連接數億網友、近萬家慈善組織和愛心企業,為全民公益交出一張漂亮的成績單:

          數據顯示,小紅花互動人次超1.25億,送小紅花、答公益題目等行為公益實現破圈傳播,億萬愛心網友共同領取了超9000萬朵助力小紅花,共計有超過6870萬人次在99公益日期間捐出35.69億元,加上騰訊公益慈善基金會的6億元資金支持,共募得善款41.69億元。

          99 公益日為何能實現破圈傳播,作為騰訊公益日和 99 公益日的品牌符號,小紅花的設計背后又傳達了怎樣的思考?今天就來聊聊小紅花那些事。



          2015年9月9日,騰訊公益聯合國內數百家公益組織、知名企業共同發起了中國第一個互聯網公益日。

          為了讓用戶了解互聯網公益的核心特色與參與方式,讓更多的人參與到互聯網公益中,第一屆 99 公益日的活動主題定調為“一起愛”,在logo的設計中也借用了“無限”符號表示“愛無止境”的含義。


          在前三年的 99 公益日中,募款額度得到了廣度上的增長,在用戶已經了解到互聯網公益低門檻、多形式、透明度、可記錄的特點之后,如何留住用戶,對互聯網公益形成日常習慣和持久投入,就成為了設計亟需解決的問題。

          “小紅花”是騰訊公益平臺在2018年給出的答案。因為小紅花作為國人的集體回憶,關聯著你我兒時從老師那里收獲到的鼓勵。每一朵小紅花背后,是我們完成的一件“好事”。

          延續小紅花的記憶線索進行延展,在公益中,小紅花是對用戶的捐贈給予的最大肯定,是受助者正在發生的改變。在傳播上,小紅花是記錄用戶每一次公益行為的符號,通過「戴小紅花,一塊做好事」而得到成就感的有效激勵。

          于是,2018年99公益日的主視覺上,無數的愛心化為花瓣,匯聚成一朵小紅花,這是小紅花在騰訊公益平臺的初次綻放。



          為了讓品牌有延續性,加深用戶對小紅花和99公益日的認知,小紅花作為核心品牌元素開始貫穿在每一年99公益日的主視覺中,并通過不同的畫面故事表達每一年的主題。

          比如,2018年的主題是積小善,成大愛,于是在設計中,讓很多愛心小花匯聚在一起,讓小的愛心變成大愛;2019年的主題是一塊做好事,通過每個人的善意匯聚成小紅花……



          在2019年,“小紅花”正式成為騰訊公益與99公益日的品牌符號。



          從2020年開始,小紅花開始發力于傳播,聯動外部品牌 IP 如QQ、微信、Bilibili、狐妖小紅娘等開啟推廣,在各種不同的場景,詮釋“一塊做好事”的內涵。

          這一年,小紅花之歌火了,同名神曲MV播放量超1億次;在線下,小紅花也開到喜茶等連鎖品牌的店里。

          而2021年,屬于用戶獨特的小紅花愛心賬戶上線了,用戶在騰訊公益平臺做好事打卡,向好友發起集小紅花的自發傳播,從而爭取更大的配捐額,在增強用戶捐款積極性的同時,撬動更多用戶了解并參與到活動中來。


          小紅花愛心賬戶


          用戶還可將積累的小紅花兌換周邊禮品。在推廣上則從創作入手,發起共繪小紅花的活動。



          可以說,小紅花串聯起了用戶從感知、到行動、到反饋的全流程,保證了用戶參與互聯網公益的動機和動力。

          在預熱推廣階段,騰訊公益推出一支小紅花為主角的宣傳片,試圖為小紅花是什么,做出來自官方的定義。

          不管是線上線下征集用戶繪制的小紅花,“每個人的小紅花”畫展,還是在感恩日隨證書送出的小紅花畫作,都讓用戶全方位地感受到騰訊公益小紅花的“玩法”,也為小紅花元素賦予了豐富的內涵。

          征集到的部分小紅花作品


          寄出公益榮譽證書


          愛心用戶的開箱視頻


          99公益日期間,小紅花與騰訊新聞、微保、騰訊視頻、騰訊會議等多產品的玩法聯動,讓小紅花開遍“地球村”。


          多款產品聯動一塊做好事


          而在線下,小紅花也伴隨系列廣告,落地在線上下,IP聯盟、異業合作、核心城市燈光投影秀等,讓小紅花無處不在。


          部分城市地標燈光投影秀


          最后,小紅花這一品牌形象的成功,不僅在公益設計這一領域上有借鑒的意義,在品牌IP的設計上同樣有值得學習的地方。

          文章來源:站酷  作者:零弟小武
          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

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

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

          為什么越簡單的設計越說不出理由

          ui設計分享達人

          常見場景


          設計師日常工作中,經常遇見的那些顯而易見的設計邏輯,卻難以給出設計理由的情況到底指的是什么呢?


          以我自己近期的工作為例,不妨為大家舉個簡單的例子:


          下圖是一個補貼規則的設置流程,在用戶未設置補貼規則之前,明確告知用戶還未設置補貼規則,當用戶設置了補貼規則后,可以對補貼規則進行修改。



          我認為這是一個非常簡單且合理的頁面路徑跳轉,并且在很多現有的產品中都有類似這樣的邏輯存在。然而在與上下游同學對接的過程中,卻遇到了不同的意見:有人認為沒有必要區分用戶是否設置了規則,用戶未設置規則可以直接展示系統默認的補貼條件和補貼范圍,如果用戶認為不合理,自行修改便是。

          不知道大家看到這里是什么感覺,我在聽到「方案二」時的反應是:能夠理解卻并不認同,說不出來哪里不對,就是覺得這事它不應該這樣。


          以上,就是在我工作中發生的一次非常具體的案例。


          直覺真的不如推理靠譜嗎?


          那么為什么我會產生“感覺哪里不對,卻又說不出為什么”的強烈感受呢?


          最直接的原因是,這樣的設計方案(方案一)是用直覺做出來的,缺少了對方案本身的思考。


          直覺,指的是那些沒有經過分析推理的觀點,因此常常給人一種不靠譜的感覺。


          可是有時候我們依賴「直覺」做事真的就完全不靠譜嗎?帶著這樣的疑惑,我去查閱了一些相關的資料來輔助我更好理解這種直覺性思考,恰好找到了一個真實的實驗案例:


          1997年,Bechara, Antoine et在一個賭博游戲實驗中發現:「直覺」比「意識」更能指引正常人做出有利的的選擇。

          該實驗先后邀請了10名正常人和6名前額葉損傷的決策缺陷患者,以探究人們做出正確選擇是在對相關知識進行推理之前還是之后。在游戲開始前,工作人員給予每位參與者2000美金、發放4副牌,要求參與者在游戲過程中翻出100張卡片,并盡可能的多贏錢,但他們不會告知參與者每副牌中的卡片價值:從A、B兩副牌中翻出正常的卡片能賺100美金,C、D兩副牌中的正??ㄆ?0美金,同時每副牌中也隱藏著罰款,A、B兩副牌中的罰款比C、D兩副牌的罰款重,參與者很可能會輸光所有的錢。

          實驗結果顯示:正常人在意識到哪副牌贏面更大之前就開始選擇有利的卡牌,而決策缺陷患者即使知道了正確的策略,卻仍然繼續選擇對自己不利的卡牌。


          根據上述實驗,我們起碼能發現直覺未見得不可靠,也就是說,憑借直覺出的設計方案,并不意味著不是一個正確的方案


          可是在日常溝通協作的過程中,「直覺設計」一旦遇到不同的意見,就會缺少理論支撐。決策者無法判斷設計師的直覺是否可靠,從而覺得方案本身也不可靠。


          遇到這種看似「死胡同」的情況,我們應該怎么去思考呢?


          很簡單,直覺在前,策略性推理在后。


          喬納森?海特(Jonathan Haidt),著名社會心理學家,在《正義之心》中有提到:


          判斷和論證是兩個相互分離的過程,直覺與推理的關系就像大象與騎象人,騎象人(推理)騎在大象(直覺)上,騎象人不斷發展以服務于大象。


          拿上述的方案來說,當我面對這類的質疑時,我也會有愣住,但我知道我不能驚慌,而是該讓騎象人(推理)表演了。


          其實仔細分析一下上述案例就會發現,方案一和方案二最本質的區別在于:


          是否需要區分用戶(商家)自行設置過「補貼規則 」?


          百度百科對規則的定義是:


          規則,一般指由群眾共同制定、公認或由代表人統一制定并通過的,由群體里的所有成員一起遵守的條例和章程。


          規則本身是屬于利益相關者之間的約定。按照這個邏輯,「補貼規則」可以理解為用戶(商家)與消費者形成的基本約定。


          用戶(商家)未設置規則,如果系統直接展示默認的補貼條件和補貼范圍,就會給用戶(商家)一種平臺借以商家的名義與消費者形成了約定的印象,這與現實不符,甚至可能給用戶(商家)的業務帶來不必要的紛爭。因此,區分用戶是否設置過補貼規則是非常有必要的。


          為什么要為自己的設計辯護?


          在上述場景中,雖然我的直覺先于理性給我發送了信號,但設計師如果光依靠直覺卻給不出任何說明,同樣會帶來一系列麻煩。


          湯姆·格里弗(Tom Greever)在一篇文章提到,偉大的設計往往取決于你怎么說。


          描述設計不是一件容易的事情,但每個設計師都不得不向很多沒有設計經驗的人講述自己的設計,并且要讓他們信服自己是對的,這群人很可能是方案的決策者。決策者通常會選擇那個聽上去最合理的方案,所以方案的表述對于最終方案的確立至關重要。


          普通設計師和頂級設計師之間的差距不僅僅是他們解決問題的能力,還在于他們能否用一種讓人心服口服、并促使人們同意的方式來闡述他們是怎么解決問題的。理論上,最好的設計應該勝出,然而事實并非如此,設計評審很容易變成設計批判會,每個人都在告訴設計師要怎么設計。


          最終,那些能夠說服別人“我是對的”的人會勝出。設計師如果沒有辦法說服別人為什么他們要這么做,就不得不按照他們不同意的方式去修改設計,原因僅僅是因為他們沒有辦法簡要的為自己的設計辯護


          聽起來似乎這些決策有失公允,甚至成了設計師的辯護大會,那么對于一些有著出色能力卻不善言辭的設計師而言,就真的沒有任何方法了嗎?


          如何突破直覺,能言善辯?


          設計師要想守衛自己的設計,就要警惕那些單憑設計直覺做出來的方案。


          設計直覺的形成與個人經歷、閱讀經歷相關。遇到相似的問題,設計師如果有這方面的經驗固然是好的,直接復用之前的做法可以大大提升設計效率。但我們完成設計后,最好想想哪些地方存在路徑依賴,以確保自己的方案能經得住質疑。


          一個最實用的可以判斷自己的設計方案,是不是由直覺得來的,就是多向自己提問


          同樣,我們來用實際的案例做個說明:


          想想下圖中「智能上傳」「更多操作」按鈕放在表格的左下方行不行?


          很明顯不行,但重點是支持這么做不行的理由是什么?


          如果你的理由是:


          “別的頁面是將按鈕放在了列表左上角的”

          “放在左下角不好看呀”

          “沒見過有產品這么放啊”

          “......”


          那這個方案就是直覺設計的產物了。


          想要突破直覺設計,設計師需要盡可能在每個設計點上多思考幾步,比如:


          為什么別的頁面會將按鈕放在左上角?


          根據2006年NNGroup 在眼動實驗中的發現,人們在網絡中的閱讀成F型,即用戶進入頁面中的第一眼,通常會落在頁面的左上角,也就是說左上方的區域是頁面的黃金區?!钢悄苌蟼鳌埂父嗖僮鳌箤儆陧撁娴暮诵牟僮鳎敲捶旁诹斜碜笊戏绞欠浅:侠淼?。


          此外,我們可以看到頁面的翻頁器是可以篩選列表展示的條數,假設用戶設置的條數,超出了屏幕顯示范圍,也就意味用戶進入到頁面會看不到操作選項,所以按鈕放在表格的左下方也是不合理的。


          為什么別的頁面按鈕放在左上角這個頁面也要這么做?


          因為我們需要保障產品的一致性,產品的核心操作方式保持一致,可以有效地降低用戶的學習成本,避免不必要的思考。


          總結


          在設計協作的過程中,設計師不可避免地會接收到來自四面八方的聲音,而我自己也曾在設計溝通中陷入過類似困境,因此我越發明白只有清晰地表述出自己的設計思考,才可能贏得每個人的支持。


          • 憑借直覺出的設計方案,并不意味著不是一個正確的方案。

          • 直覺在前,策略性推理在后。

          • 頂尖的設計師,也是頂尖的交流者。

          • 要想守衛自己的設計,就要警惕那些單憑設計直覺做出來的方案。

          • 多向自己提問,以確保自己的方案能經得住質疑。


          以上是關于這篇文章的關鍵思考總結,回到設計師個體而言,我認為我們需要對直覺設計保持警惕,因為看似簡單的設計背后往往蘊含著復雜的設計原理,而一個好的設計師除了擁有過硬的設計能力,強大的設計思考力和表達能力以外,我相信同樣在跨學科的研究和學習上會遠強于普通設計師,否則根本無法支撐起背后的設計思考。

          文章來源:站酷  作者:范思蜀
          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

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

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


          全面總結圖表設計的思路和方法

          資深UI設計者

          數據成為了日常工作的一大重要角色,越來越多的公司以數據驅動產品進行迭代。但令人困惑的是可視化圖表無處不矮,但卻給大家帶來了誤導。作者分享了一些簡單的思路與方法,以此來改善這些問題,希望對你有所幫助。


          越來越多的公司以數據驅動產品進行迭代,從中我們能看出數據的重要性。

          日常工作中,無論是匯報還是設計,都離不開圖表的使用。但令人困惑的可視化圖表無處不在,往往給人帶來誤導性,通過遵循下面這些簡單的思路和方法可以有效改善這些問題。

          一、選擇正確的圖表類型

          選擇錯誤的圖表類型,或默認使用最常見的類型,可能會混淆用戶對數據產生誤解。

          一組數據可以有多種表示方式,具體類型取決于用戶希望看到的內容。

          二、根據正負值確定方向

          當數據中出現正負值時,要先確定基線的位置,再確定數據位置,將正值分布在基線上側(X軸)或右側(Y軸),負值分布在下側(X軸)或左側(Y軸)。

          避免在基線的同一側同時添加正值和負值,造成用戶對圖表信息理解錯誤。

          三、始終從零開始繪制條形圖

          單看左側的條形圖,能發現B的值比D的值要多3倍以上,但在右側從零開始的條形圖中,實際差異要小得多。從零開始可確保用戶獲得更準確的數據展示。

          四、折線圖使用自適應Y軸

          對折線圖來說,如果始終將Y軸的比例限制為從零開始,一旦數據波動幅度很小,那整個折線圖會看起來很平坦,效果不明顯。

          折線圖主要用來表現趨勢,根據給定時間的數據調整比例,并保持折線區域能占到Y軸范圍的三分之二。

          五、使用折線圖時考慮時間間隔

          折線圖是由一條條小線段連接組成,這些線段展示了在短時間內數據是如何變化的。當時間間隔很大或數據更新不頻繁時,就要慎重考慮是否使用折線圖。

          例如想表示年收入,左側的兩個折線圖樣式都不太合適,每個月的收入是固定的數字,而折線圖展現的數據更像是收入的變化,相反右側的條形圖更適合來展示每月具體的收入。

          六、不要使用平滑的折線

          平滑的折線圖可能看著很舒服,但它們歪曲了背后的實際數據,而且過粗的線條掩蓋了真正的節點。

          七、謹慎使用雙軸折線圖

          當兩組數據出現X軸代表的信息相同但Y軸不同時,為節省空間我們可能會考慮用雙軸圖。

          但大部分雙軸圖難以閱讀,只是感覺圖表上有很多數據,但遠遠沒有單個圖表展示的清晰。

          八、限制餅圖的切片數量

          餅圖是最受歡迎但經常被誤用的圖表之一。在使用餅圖時,首先要注意切片的數量最好保持在5-7片。

          如果還有很多占比很小的切片,可以將這些全部歸到“其他”切片中。

          九、直接在圖表上標注

          如果沒有正確的標注,無論圖表設計的多好看都沒有意義。

          直接在圖表上標注數據或信息對使用者來說更直觀,更節省時間和精力。

          十、不要在切片上標注

          將數值放在切片上雖然很直觀,但可能會導致很多問題,例如左側餅圖數值的可讀性問題、切片太薄無法添加數值等,對比來看,右側餅圖添加標注的方式更合適。

          十一、餅圖切片的排序

          餅圖切片的排序是一個很容易忽略的問題,將餅圖切片只是一個開始,通過合理的排序保證用戶清晰觀看圖表才是關鍵。

          常見的排序方法是將面積最大的切片放在12點鐘位置,然后按順時針降序放置第二大的切片,以此類推。

          十二、避免隨機性

          同樣的建議適用于其他類型的圖表。盡量不要默認按字母順序排序,將最大值放在頂部(水平條形圖)或左側(對于垂直條形圖),以確保最重要的值占據最突出的空間,減少視線運動和閱讀圖表所需的時間。

          十三、避免極端的環形圖

          環形圖,又稱為甜甜圈圖,是餅圖的一種變體,本質是餅圖將中間區域挖空,用在多樣品間的多種數據的比較中。

          雖然環形圖騰出中間區域來顯示額外的信息,但犧牲清晰度走極端會讓圖表變得毫無用處。

          十四、讓數據自己說話

          不必要的設計樣式不僅會分散注意力,還可能導致用戶對數據誤解并產生錯誤印象,圖表在設計上應避免:

          • 3D元素、陰影、漸變;
          • 斑馬紋、過多的網格線;
          • 裝飾性過強的斜體、粗體或襯線字體。

          十五、選擇與數據性質匹配的調色板

          顏色是保持數據可視化有效的組成部分,在設計時考慮3種調色板類型:

          • 分類色板(左)適合顯示分類數據,當你想區別不連續且內在沒有順序關系的數據時可以使用這種類型;
          • 連續色板(中)適用于需要按特定順序放置的變量中,使用色調/亮度或兩者組合創建色板。
          • 離散色板(右)是兩個連續色板的組合,中間有一個中心值(通常為零)。不同的調色板會傳達正值和負值。

          十六、無障礙設計

          根據眼科研究中心的數據,大約每12個人中就有1個色盲,圖表只有在廣泛受眾可以訪問的情況下才是成功的:

          • 在調色板中使用不同的飽和度、亮度;
          • 黑白打印可視化圖表,檢查對比度和可讀性。

          十七、注重易讀性

          確保圖表排版在傳達信息并幫助用戶專注于數據,而不是分散注意力:

          • 選擇字跡清晰的字體,避免使用襯線和裝飾性很強的字體;
          • 避免使用斜體、粗體和全部大寫;
          • 確保文本與背景形成高對比度;
          • 不要旋轉文本。

          十八、使用水平條形圖代替旋轉標注

          這個簡單的技巧可以確保用戶能夠更有效地瀏覽圖表,而不會使他們感到緊張。

          十九、建立圖表庫

          如果你的任務是將交互式圖表添加到Web和移動項目中,那么首要考慮問題是將使用什么樣的圖表?

          基于定義的庫(Highcharts)進行設計將確保易于實現,并為我們提供大量的交互想法。

          二十、超越靜態報告

          通過更改參數、可視化類型、時間線幫助用戶進行探索,得出最大價值化的結論。例如IOS Health結合使用了各種數據表示來發揮優勢。



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

          文章來源:人人都是產品經理  作者:Clippp
          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

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

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



          2021 必備的超贊神器,用上它,效率都要提升三倍??!

          seo達人


          圖片
          上圖就是這個神器制作出來的一些效果,之前看Dribble上面有很多類似的設計,現在終于知道它們大部分來源于這個神器。
          下面我也找了一些案例,大家一起來看看。
          圖片
          圖片
          圖片
          這樣看,效果還是真的不錯,它支持顏色修改、樣式修改,目前一共有11種幾何樣式。
          圖片
          好了,現在下面正式介紹這個傳說中的神器,我相信大家一定會喜歡上的。
          圖片
          上圖就是這個神器的基本外貌,一共11種基礎類型,當點擊其中一個進去后,可以進行編輯。
          這里我點擊上圖中的第二個模式(MIXTAPE)進去。
          圖片
          如果大家英文不好,可以將整個頁面翻譯成中文,Google自帶的翻譯。
          進入這個頁面,大家可以根據自己喜歡的風格調整樣式,同時還可以修改顏色。
          圖片

          比如我可以選擇8X12列和行的幾何布局。

          圖片
          對顏色、列和行、開啟陰影調整,得到如上效果。
          圖片

          最終可以導出一張高清大圖(3240X4860),尺寸是完全夠用的。

          圖片

          隨便調整下又是一張不錯的幾何背景,還可以作為作品集封面。好了,關鍵時刻來了,神器的網址已經打包好,大家可以拿去使用。

          領取方式如下:添加小編微信,備注:神器699,小編會將下載地址發給你(小編不是機器人,回復會慢一些,大家稍等)。

           

          原文地址:功夫UX (公眾號)
          作者: 功夫UX
          轉載請注明:學UI網》2021 必備的超贊神器,用上它,效率都要提升三倍??!

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

          截屏2021-05-13 上午11.41.03.png

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

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


          配色不協調?來看看“鄰近色”搭配

          seo達人


          01 鄰近色的定義

          顧名思義鄰近色是色相環中色相相鄰的顏色,相對單色對比,鄰近色對比增加了色相對比,因此視覺效果更豐富。

          圖片

          鄰近色在色相上比較接近,色彩的冷暖屬性,還有情感特性上都比較類似,所以鄰近色搭配能很好的保持畫面的協調與統一,是設計中使用頻率最高的配色方案之一。

           

           

          圖片

          黃色與橙色相配具有很和諧的過渡感,由于橙色和黃色都非常明亮鮮艷,很容易營造出輕松快樂的氛圍,充滿活力,讓人興奮愉悅。

          圖片

          圖片

          圖片

           

           

          圖片

          橙色和紅色是充滿活力和激情的顏色,經常使用在促銷等表現出熱鬧、愉快氛圍的設計中。

          圖片

          圖片

           

           

          圖片

          紅色和紫色搭配是高彩度、但明度相當低的色彩搭配,在使用上注意不宜讓畫面過度暗沉。最好適度地提高色彩的明度和搭配高明度的色彩來增加畫面上的層次感。具有浪漫、華麗、高貴感。

          圖片

          圖片

          圖片

           

           

          圖片

          藍色和紫色明度很接近,對比比較柔和。神秘夢幻的紫色搭配上和科技感十足的藍色,顯得十分前衛時尚。是蒸汽波、波普藝術、賽博朋克等前衛時尚風格常用的配色。

          圖片

          圖片

          圖片

           

           

          圖片

          藍色明度低,綠色明度高,所以藍綠配色即協調統一又有很強的對比。讓人聯想到藍天綠水之美,感到平靜,放松,給人清爽舒適感。

          圖片

          圖片

          圖片

           

           

          圖片

          黃綠色是調和性相當高的色彩組合,黃色搭配清新的綠色,是自然界中很常見的色彩組合,具有自然的呼喚感,新鮮而又清澈,顯得朝氣有活力。

          圖片

          圖片

          圖片

          圖片

           

          02 鄰近色配色的方法

          接下來使用在線配色工具:Adobe Color來進行配色示范色。(網址:color.adobe.com

          在調色規則中選擇“類比”。使用橙色為基礎顏色,會自動生成四個關聯顏色,篩選適合的顏色配置到畫面中,就能很快完成配色方案:

          圖片

          和單色系相比,鄰近色在色相方面會稍微豐富一些,但仍然存在色調過于單一、對比不夠的問題。一般會拉開顏色之間的明度或純度,形成明暗對比,襯托出主體。

          圖片

          鄰近色還可以結合不同明度和純度來使用,讓畫面呈現出層次變化,展現出不同的氣質和視覺效果。

          圖片

          圖片

          圖片

           

          03 總結

          鄰近色在色相上比較接近,色彩的冷暖屬性,還有情感特性上都比較類似,所以鄰近色搭配能很好的保持畫面的協調與統一,是設計中使用頻率最高的配色方案之一。

          鄰近色存在色調過于單一、對比不夠的問題。一般會拉開顏色之間的明度或純度,形成明暗對比,襯托出主體。

           

          原文地址:藝海拾貝Design(公眾號)

          作者:鄧海貝

          轉載請注明:學UI網》配色不協調?來看看“鄰近色”搭配

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

          截屏2021-05-13 上午11.41.03.png

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

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



          學會“鄰近色”配色,搞定配色難題(實操篇)

          seo達人



          圖片

           

          鄰近色配色實操-案例1

          在PS中新建文件,背景選擇紅色,英文放大鋪滿背景,顏色選擇紅色的鄰近色橙色。

          圖片

          畫出白色圓角矩形,給矩形添加圖層樣式“描邊”和“投影”。描邊的填充類型選擇“漸變”,顏色選擇白色和淺橙色的漸變,模擬玻璃邊緣的厚度。

          圖片

          圖片

          接下來制作毛玻璃效果。復制背景和文字圖層,合并為一個圖層。分別給此圖層添加三個濾鏡“模糊-高斯模糊”、“濾鏡庫-扭曲-玻璃”、雜色-添加雜色“,效果如下圖:

          圖片

          把圖層移動到矩形圖層上方,按快捷鍵“ctrl+alt+g”建立剪切蒙版,使毛玻璃效果只在矩形范圍顯示。

          圖片

          最后加上文案排版,設計完成。

          此案例使用了紅色和橙色的鄰近色配色,橙色和紅色是充滿活力和激情的顏色,能呈現出熱鬧、愉快的氛圍。

          圖片

           

          鄰近色配色實操-案例2

          方案二,在PS中新建文件,在背景上用綠色和黃色的柔和畫筆隨機畫出顏色。

          圖片

          使用“模糊-高斯模糊”讓背景顏色更好的融合在一起,再執行“雜色-添加雜色”給背景增添質感。

          圖片

          圖片

          圖片

          最后加入文案,顏色采用綠色和黃色,明亮的黃色搭配清新的綠色,新鮮而又清澈,顯得朝氣有活力。

          圖片

           

          鄰近色配色實操-案例3

          方案三,在AI中輸入英文,字體選擇一款設計感較強的“Current”做為主體。使用藍綠色搭配,藍色明度低,綠色明度高,所以藍綠配色即協調統一又有很強的對比。

          圖片

          把英文轉換為輪廓,給每個字母加上不同角度的漸變色,顏色沿用藍綠色。

          圖片

          最后加上文案,進行排版,設計完成:

          此案例使用了藍綠色的鄰近色配色,讓人聯想到藍天綠水之美,感到平靜,放松,給人清爽舒適感。

          圖片

          嘗試新的配色,使用藍色和紫色搭配。藍色和紫色明度很接近,對比比較柔和,具有神秘夢幻感。

          圖片

          紅色和紫色搭配顯得浪漫、華麗、高貴。

          圖片

           

          優秀作業展示

          以下是從本期投稿中選取的11份優秀作品:

          01 『聰_cong』

          圖片

           

          02 Anna

          圖片

           

          03 NIAN廿七

          圖片

           

          04 NoctilucaGladys

          圖片

           

          05 Trista~Z

          圖片

           

          06 蛋蛋DAN

          圖片

           

          07 金角設計

          圖片

           

          08 孔艷茹

          圖片

           

          09 龍娟

          圖片

           

          10 珞影隨行

          圖片

           

          11 咪奧mao

          圖片

           

          原文地址:藝海拾貝Design(公眾號)

          作者:鄧海貝

          轉載請注明:學UI網》學會“鄰近色”配色,搞定配色難題(實操篇)

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

          截屏2021-05-13 上午11.41.03.png

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

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



          資源分享|兩款B端設計走查神器

          seo達人

          Copiexl

          圖片

          這是一款 字節跳動 出品的高效走查插件,它的原理十分簡單,首先打開需要校驗的線上項目;接著上傳你的設計稿圖片;然后通過降低設計稿的透明度,達到項目快速走查的目的。開發哪里有問題,一眼便知。簡單教大家如何 安裝使用 這樣一款插件:

          圖片

           

          1.安裝方法:

          首先打開軟件的官方網站(https://copixel.bytedance.com/),點擊免費下載(這里只支持Chrome瀏覽器,如果你是Safari 、Firefox、Opera等瀏覽器,在官網往下滾動,同樣也是提供了下載入口)。

          點擊下載過后,就會跳轉到 Google 的應用商店當中,點擊安裝即可,與瀏覽器插件的安裝方式類似(這里需要科學網絡,如果你訪問不了 Google應用商店,可以直接在公眾號后臺回復“設計走查”,提供了另一種安裝方式)。

           

          2.使用教程

          01.選擇合適的頁面設計尺寸

          建議按照主流窗口尺寸的寬度設計,如:1366px、1440px、1920px;推薦最小設計尺寸使用1366px、1440px,最大設計尺寸1920px(寬)。目的是按照 1:1 導出設計圖,與開發頁面顯示效果一致。

          圖片

          02.該如何輸出設計稿?

          Copiexl 瀏覽器插件的原理是將你的設計稿 懸浮在前端還原的頁面當中進行對比,這樣就能快速知道自己的設計頁面有何問題。

          因此我們需要將設計稿進行一次性導出成 PNG 文件。這樣可以批量導入到插件當中,直接切換設計稿提高走查效率。

          03.如何使用

          打開前端實現好的頁面,使用你剛剛安裝好的瀏覽器插件“Copixel”,添加UI設計圖。

          通過調整設計圖位置、大小和透明度使其與開發頁面高度重合,配合 有截圖標注功能的軟件(比如:Xinp)進行找茬標記。使用 走查文檔 標記存在問題的地方并說明問題,這樣就能高效完成項目走查。

          然后將有問題的走查內容直接分享給開發即可。

           

          插件使用的視頻方法:

          轉載至Copiexl幫助文檔

           

          CSS Peeper

          這是一個 設計走查 / 樣式復制 / 資源下載 的效率神器,它能夠輕松查看網頁端當中所有元素的CSS屬性,并且不需要像Chrome瀏覽器那樣 “右鍵” – “檢查” 瀏覽器元素,然后在許許多多的代碼當中尋找你需要的CSS代碼。我們只需要點擊插件,選擇元素就能夠快速檢查樣式。

          圖片

           

          場景一、設計走查

          比如當前端工程師完成頁面過后,需要設計師進行一個頁面的走查,這個時候很多同學往往就會靠著自己的像素眼進行一一的比對,如果稍微有點經驗的B端設計師會打開瀏覽器自帶的檢查,進行元素的核對。
          然而瀏覽器自帶的檢查其實更多是面向程序員進行設計的,對于我們設計師而言,能夠看懂的卻只有一小部分內容,顯然檢查的效率并不會太高效。

          圖片

          這時候使用CSS Peeper,就可以輕松對網頁當中的CSS樣式進行檢查,我們不僅可以看到元素的常規屬性,比如顏色、背景、間距;還可以看到元素的盒子模型,可以看到元素的 Padding、Margin…

          通過這個插件,就能清晰的看見開發究竟是在哪一部分還原出現問題,并且能夠很“欠揍”的在他面前秀一下~

          圖片

           

          場景二、樣式復制

          對于設計師來說,就不用再去糾結競品究竟是如何設計?如何還原出來,因為任何網頁上的元素,你都可以通過這個插件,去查看他的還原思路,并且知道它的設計樣式以及屬性
          同時可以點擊顏色或者圖片,將該頁面用到的所有顏色或者圖片總結出來進行匯總,可以導出,方便在設計風格上進行分析。

          圖片

           

          場景三:資源下載

          使用CSS Peeper 能夠快速查看在該頁面當中,所用到哪些圖標、圖片。并且可以將這些資源快速下載到本地進行保存。這樣你就可以成為資源小能手。

          圖片

          這也就是我工作當中最常使用的插件,你最常使用什么插件?一起來分享聊聊??!

           

          原文鏈接:CE青年(公眾號)

          作者:CE青年

          轉載請注明:學UI網》資源分享|兩款B端設計走查神器

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

          截屏2021-05-13 上午11.41.03.png

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

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



          日歷

          鏈接

          個人資料

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

          存檔

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