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

          首頁

          【設計理論】UI設計體驗如何提升?

          ui設計分享達人

          前言

          SaaS 產品體驗要求越來越高,用戶體驗已經成為產品競爭力的重要組成部分,怎樣在多業務線的產品環境中做好體驗設計,本文從貼合業務線的設計規范、敏捷易用的前端組件庫、產品研發協作流程保障、UI體驗文化打造、UI設計質量品控5個方面闡述項目快速、規?;嵘喈a品線整體體驗過程中方法論和實踐經驗。



          關鍵詞: 

          用戶體驗設計;UI設計規范;多產品線;體驗文化;UI設計落地



          面對多產品體系,多產品線,需要積極尋找和探索適合我們客觀情況的最佳實踐,我們面臨的問題有:

          1.過往以功能堆砌為主、基本“能用”,缺乏平臺規范和一致性,體驗不足。

          2.產品線多、體量大。

          3.客戶對產品體驗要求越來越高。

          4.產品歷史包袱、修復改動困難。

          5.對用戶體驗認知不一,協同、溝通成本高。

          6.重復的開發成本。

          7.第三方組件與業務的匹配度不佳。



          解決以上幾大難題,我們啟動了UI 設計規范的搭建、UI組件庫的開發等,讓規范和組件庫成為各產品線堅實底座的一部分,使用戶體驗文化賦能前端和產品經理,協同 QA 力量一起推動產品體驗升級,以下整理分享的實踐方法適用于中小型UED團隊支撐復雜、多業務線的企業,本文嘗試從以下幾個方面總結和提煉實踐經驗,跟業界同行探討。

          貼合業務線的UI設計規范

          設計規范體系的搭建對于新的團隊,如何從復雜海量的業務場景中制定出一套適用于自己產品的UI設計規范,是第一道待翻越的高墻,完整的設計規范應該是包含視覺規范與交互規范,本文主要針對設計規范實踐過程進行闡述。

          貼合場景的設計規范: 

          雖然市面上已經有眾多成熟的設計規范體系可供使用,但是當前我們所處的產品階段、多業務 線以及復雜的業務場景等綜合因素,決定了需要重新搭建一套符合我們自己業務場景的設計規 范體系。



          UI規范效益最大化:

          一旦我們決定制作規范,就要把規范當成一個產品去做。去梳理一套高效合理、可復用的制作流 程,去分析產出什么樣的「規范產品」才能產生最大的價值。 依據規范效益模型,在規范的制定中盡可能的提高規范的通用性至90%,先解決統一性,再解決場景細分,打造高質量通用的模式庫以提高質量和效率,并力求讓更多人從這套設計體系中獲益, 從而讓規范體系發揮更大的價值。



          UI規范制定的策略: 

          明確用戶對設計規范的訴求,構建適合產品的UI設計規范,首先,需要明確規范體系的用戶群體經過設計團隊多輪調研,確定設計規范面向的目標用戶群、基于核心用戶的訴求,為后續規范內容框架的制定提供依據。



          確定UI設計價值觀: 

          產品歷史包袱重,系統結構復雜,在提升用戶體驗時,內容表達「清晰明確」是第一要務,例如尊重已經形成的用戶習慣,優化改造時,注意版本之間的銜接,讓用戶「清晰明確」,這也是為什么將「清晰明確」作為價值觀之首,另外提升效率是企業級產品用戶體驗的永恒主題,同時兼顧系統的簡潔與一致。



          梳理UI規范框架: 

          UI設計規范包括設計價值觀、全局規則、組件庫、模式庫、典型頁面、移動端規范和設計資源框架整理主要從以下3個方面進行:

          1.梳理現有組件,剔除不使用的部分 。? 

          2.同類競品的框架借鑒,查漏補缺。 ? 

          3.場景驗證,與業務場景深度結合經過充分論證和梳理,對規范框架做了重新定義,增補了業務缺少的內容。

          如上圖所示,例如對高頻的工具欄組件的補充,典型頁面的補充,增加模式庫以及全局規則,當前第一個版本的規范框架是基于業務場景優先級最高的內容進行制定,更多的規范內容的增加依托于不斷的迭代,逐漸完善規范框架。



          規范內容的制定及評審: 

          組件規范包含:變更記錄、組件定義、何時使用、組件的類型、組件的響應。



          規范內容制定的原則: ? 

          1.有明確場景可依。? 

          2.精簡不必要的分支 例如在定義表單規范時,對于表單標簽的對齊方式做了統一的約束,標簽右對齊,輸入框左對齊全局保持統一。



          邏輯正確、規則明確易懂: ? 

          例如常見的alert (警告提示)名稱調整為常駐提示,語義更貼合場景,便于理解。



          規則的可拓展性,多場景的兼容性: ? 

          產品架構是PC端到移動端的自動適配,因此在組件設計的時候需同時考慮PC端與移動端的對應關系以及兩端場景的兼容性。



          協作及敏捷迭代: ? 

          規范發布后,伴隨著實際項目的檢驗,業務場景的擴充變化,如何高效的對設計規范進行迭代,決定了設計系統能否持續的走得更遠,規范內容定期評審,必須通過業務、技術、設計評審,確保規范是可用的、可落地并且易于使用的規范后期不同的規范模塊專屬人負責,同時有backup,可以幫助走查復盤雙重保障規范的質量。



          敏捷易用的前端組件庫: ? 

          復雜的業務場景和多產品線特點,快速打造一套敏捷易用、高質量并符合實際業務場景的前端組件庫,是提高產品研發效率、改善UI質量、提升用戶體驗的關鍵。

          敏捷易用的前端組件庫

          復雜的業務場景和多產品線特點,快速打造一套敏捷易用、高質量并符合實際業務場景的前端組件庫,是提高產品研發效率、改善UI質量、提升用戶體驗的關鍵。 

          前端組件庫建立目標: ? 

          1.提高開發效率,對高頻使用、通用組件進行代碼化封裝,避免重復開發工作。 ? 

          2.提高開發質量,通過各類業務場景和業務線的錘煉,沉淀組件代碼最佳實踐。 ? 

          3.提高產品體驗,組件封裝代碼化,減少在多角色協同中因為理解偏差、信息傳遞問題等導致的不確定性和結果不可控性,不同業務線、不行項目、共用一套基礎代碼,保證體驗的一致性,組件的組織形式: 結合實際業務場景和原子設計理論,將組件劃分為不同顆粒度:基礎組件、業務組件、典型頁面 組件,以適用于不同研發場景使用。



          1.基礎組件,基礎組件為組件庫最小顆粒度,構成系統界面的基本構件。 ? 

          2.業務組件,在基礎組件的基礎上,結合具有共性業務特征的業務場景,梳理出具有業務特征的 業務組件。 ? 3.典型頁面組件,梳理具有業務特點的典型頁面,相比基礎組件和業務組件,典型頁面更加具體, 為用戶提供具有代表性的內容和框架,并準確描述用戶最終看到的內容。如列表和左樹右表典型 頁面組件,作為最為常見的頁面結構,各業務場景可復用頁面組件,保證了頁面組件內各基礎組 件的一致性,最大程度的實現不同產品線產品中頁面體驗的一致性。



          推進前端組件庫落地執行: ? 

          前期設計規范落地到組件庫過程中,面臨諸多問題和阻礙,比如開發落地質量不高、內容遺漏、 各方理解不一致、驗收及修復問題不到位等問題。處理這些問題對UI團隊資源造成很大消耗, 通過總結復盤前期組件庫落地時的經驗和教訓,梳理落地執行流程,在新的協作流程下,新一 批的組件開發不論在協作效率和開發質量上都有質的提升。

          分層推進: ? 

          組件庫開發是一個持續迭代的過程,考慮到組件庫開發資源極為有限且無專職負責人員,在跟組 件庫開發團隊協同過程中,我們通過分步開發來解決組件庫更新優化的問題并通過不斷優化協作流程來助力組件庫高效落地。 

          前端組件庫分步開發原則: ? 

          1.優先級原則,優先開發適用于業務線普適場景的組件。 ? 

          2.緊急性原則,對于急需的業務線所需組件優先開發。 ? 

          3.快速可實現原則,開發實現成本高的組件暫緩處理。



          自查走查驗收: ? 

          組件UI責任人梳理出下屬組件需開發落地的細節點,整理為文檔,待開發人員完成組件開發后,自行參照UI提供的自查文檔,查漏補缺,保障進入UI驗收環節的前端組件不會出現較多的缺陷,降低后期走查和溝通修改的工作量,同時監督開發人員提高組件落地還原度和質量。



          組件庫的持續迭代: ? 

          UI團隊通過一套標準的流程來把控組件庫迭代的質量,在日常工作中經常會收到產品經理或項目 方提出新的組件需求或對現有組件的優化。UI部門作為推動組件庫搭建的核心環節,需要以全局 和更深入的視角加以判斷把關,保證前端組件庫內容的普適性和高質量,避免組件庫內容冗余, 降低研發維護成本。



          產品研發協作流程保障: ? 

          好的過程是好的結果的有力保障,一個業務需求從產生到開發落地需要經過多角色協同、一系 列環節。必須依靠規范的研發協作流程,確保各角色清楚自己職責以及如何跟上下游銜接,同 時我們也希望協作流程能夠確保設計資源可以向重點業務模塊傾斜,以及發揮各個角色可以發 揮的作用去共同提升產品體驗。

          UI角色需融入規范化的研發流程

          UED團隊建立之初,我們面臨的首要問題是:需求隨機,完全取決于各產品線和產品經理 個人,為了解決這個問題,我們制定了UI融入研發體系的流程以解決合理、有效利用UI資 源的問題。 

          企業級產品特點、多業務線、大量面向管理員用戶的具有相似頁面結構和交互模式的業務 模塊、產品經理跟交互團隊人員配比等因素都決定了并非所有需求都需要流轉到UI團隊進 行設計,在判斷哪些需求需要流轉至UI團隊設計時,我們給出了如下指導性方向: ? 

          1.用戶量角度,大量終端用戶使用的場景,例如訂票、報銷、采購頁面 。 ? 

          2.用戶重要程度角度,核心、重要用戶使用的場景 eg.公司領導、決策層。 ? 

          3.通用性角度,通用組件或框架,需要UI通盤考慮各個業務線場景需求進行設計。 其他需求則主要由產品經理進行設計,UX以評審方式輕度參與。



          協作流程迭代,UI驗收成為必要一環: 隨后我們又面臨新的問題:設計還原度差,被公司老板生動的形容為:看設計稿是“精裝修”, 開發落地后就成了“毛坯房”了。為盡可能確保設計還原質量,我們在研發流程中明確了所有涉 及前端頁面的功能需求都需要在研發協同工具中流轉到UI負責人驗收,在產品團隊TAPD中記 錄UI缺陷、標明嚴重程度,對于 “嚴重” 級別以上UI缺陷,禁止發版。



          UI工期評估合理化: 

          為了既能盡力配合各產品線迭代計劃又要爭取合理UI設計時間、保證產出質量,合理評估設計周期對UI人力管理尤其重要。對此,我們對設計需求分成了ABC三級進行評估。 對于A和B級需求,通常模塊較大,先有UI設計方案再去分期迭代開發,對于這兩類需求,在評估 模型中給出了大致工期概念,比如以月為單位,大于1個月或2個月。 

          對于C級需求,通常為產品經理先排進某個迭代再來提UI設計需求,設計范圍相對明確,我們則結合典型頁面數量因子和設計難度因子給出了UI工期大概評估公式,以天為單位。 ? 

          1.設計難度因子:根據業務線的復雜程度而定,范圍為(0.8~1.5)。 ? 

          2.典型頁面數量因子:評估需求范圍規模(N)。



          設計體驗文化打造

          UI設計團隊在協作過程中面臨諸多挑戰:產品線多、產品邏輯復雜、研發鏈路長、各級人員對產品認知及重視程度不一、好的體驗設計難落地、溝通成本高等問題,想要解決這些問題,若僅靠UI團隊自身力量是不夠的,需要動員公司各個環節和人員重視用戶體驗,共同促進產 品體驗提升。

          搭建體驗文化灌溉機制: 

          UI部門通過多維度的體驗知識內容矩陣、多渠道多場景全員覆蓋,普及和加深各級對產品體驗 價值的認識,提升產品體驗思考力和洞察力,幫助企業以新的視角思考業務、產品研發和用戶 體驗的關系,賦能產品經理及研發人員高質量的輸出,“以用戶為中心”和“打造產品極致體驗” 的價值觀根植與企業文化中,指導研發流程中各項工作最終影響到產品的戰略層、范圍層、結 構層、框架層和表現層這5個產品體驗維度,以實現企業產品的“極致產品體驗”目標。 通過搭建體驗文化灌溉機制,提升全員體驗意識,能為產品研發帶來長久的價值: ? 

          1.提高設計還原度 ? 

          2.減少培訓成本 ? 

          3.提升跨部門溝通效率 ? 

          4.提升UI團隊影響力 ? 

          5.提升客戶滿意度



          體驗文化落地實踐: 

          針對不同類型的體驗知識,我們采取不同的傳播渠道進行透,以期達到最好的效果,避免形式化, 將體驗文化滲透、學習落到實處,最終影響產品研發的各個環節。

          以下為UI團隊在企業體驗文化 推廣的主要渠道和方法: ? 

          極致體驗公眾號主要發布產品體驗的基礎原理,體驗價值、項目復盤、常見體驗問題等深度長文。讓公司各級人 員認識用戶體驗及價值,讓用戶體驗理念深入人心。 ? 

          體驗知識小卡片整理產品體驗小的知識點,閱讀學習成本低。利用員工碎片時間,對細小體驗知識點的學習,積 跬步,至千里。 ? 

          直播宣講針對重點且復雜的產品體驗內容,如交互規范宣講、重點問題復盤、產品經理及開發人員應知應 會的知識點,采用宣講直播的方式,更好的對內容進行詳細解說和疑難問題溝通。 ? 

          體驗調研分享UI部門成員對核心競品進行體驗調研,整理分析后對產品經理及相關人員進行分享,賦能產品經 理,為產品的體驗設計提供新的思路。



          UI設計質量品控

          UI團隊專業水平一定程度上決定了公司產品體驗的上限,持續提升UI自身專業輸出能力可以從源頭提升公司產品體驗。 

          設計自查: 

          企業級產品的大量體驗問題都是設計基礎問題。因此需要設計師不論在內審前,還是內審過程中都要牢記設計原則,查漏補缺,守住底線。我們在部門內部制定了一套適合企業產品的UI自查表來檢查設計方案,通過這些自查點來避免產品中出現基礎體驗問題,從UI設計師自己這里 把好第一道關。



          在日常工作中,UI自查表始終占據工區的醒目位置。在評審過程中,大家也會通過線上文檔的形 式來對設計原則的條目進行逐一檢查。



          做好UI內部評審: 

          設計團隊內評審(Design critique)是幾乎所有國內外設計團隊的普遍、經典做法,可以有效提 高設計產出水平、保證團隊對外輸出質量。方法是普適的,但具體執行時如何做才能有更好的效果卻各有各異。 在如何做好內部評審上,我們進行了如下嘗試。 從“全員參與” 到 “組成內部評審委員會” 團隊內評審時邀請全員參加,但發現只有少數同事發言,另外一些同事因資歷淺、不了解評審產品或者積極性不高給不出建議。同時隨著團隊成員數量從幾個增加到十幾個,評審會議的時間成 本大大增加。 

          選取團隊內相對資深和積極提出問題、建議的同事組成內部評審委員會,以月為周期輪流進行, 可以有效分散評審委員在團隊內部評審上的工作負荷,并明確一次UI內部評審除了內部評審委員 會還有哪些關聯同事需要參加。 關于邀請評審內容關聯同事,比如“消息中心” UI評審跟另外一位同事負責的“討論消息”有關聯,則需要邀請這位同事一起評審,以便發現關聯問題,整體考慮設計方案。 

          以上參與評審機制明確在團隊內部協作工具上,做到人人清楚。另外,對于評審建議,要做到有 記錄、有回應、有跟蹤,確保有效發揮了內部評審的價值。 



          UI設計師的能力模型:不言而喻,UI設計師自身能力的培養是UI品控的重要一環。因此對于設計師能力培養通道上,我 們引入了以下模型。



          我們將UI設計師能力歸納成了3x3能力矩陣。這可以設計師在工作中也可以有目的提升自身薄弱環節,同時也讓企業對UI設計師的要求更加清晰,除此之外,我們要求UI設計師也需要多了解業務和前端知識,往前多走一步,跟上下游角色更好的銜接,一方面,UI設計師需要理解業務,要能夠有半個產品經理的業務知識儲備, 如果能站在更高的行業視角對自己所服務的業務領域(向 業務產品經理再邁進一點)有一定的理解是更好的了,另外一方面,UI設計師跟自己的下游-前端 開發工程師也需要很好的銜接上,知道相關前端技術概念、基本頁面布局和交互實現邏輯、方法,能夠無縫地將界面和交互設計翻譯成前端可理解的語言。



          產品體驗提升關鍵取決于兩個重要因素:一是設計團隊的專業能力水平;二是結合企業實際情況,將“不斷提升產品體驗”融入到每個相關角色的具體工作中。在企業中,小規模UED團隊支撐復雜、多產品線產品體驗快速規?;嵘沃氐肋h,我們會持續在未來的實踐中積極探索切 實有效的方法。


          作者:CC小酷
          鏈接:https://www.zcool.com.cn/article/ZMTUyMDA3Ng==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

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

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

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

          【設計理論】UX交互設計中的文案規范

          ui設計分享達人

          文案的重要性:


          說到文案在交互設計中,我們需要通過對話的方式和用戶產生共鳴,精準、清晰的語言會更容易讓用戶理解,合適的語氣更容易讓用戶建立信任感,因此在界面設計時,文案運用也應當被重視,在使用和書寫文案時有以下幾點需要注意:

          1. 從用戶或角色的角度出發,角色換位思考一下,所謂的「同理心」理論;

          2. 表述一致;

          3. 重要的內容放在顯著的位置;

          4. 專業、精準、完整;

          5. 精簡、友好、正能量;

          在界面中,文案是我們與用戶或角色溝通的基礎,語言文字的表述也需要精心推敲,仔細設計;清晰、準確、簡潔的文案設計能夠讓界面擁有更好的可用性,同時讓用戶體驗更加友好;

          接下來就是要明確表述立足點,這個很重要,在表述內容時,關注點應該是用戶和他們能用你的產品做什么,而不是你和你的產品在為他們做什么,所以內容表述立足點很重要;(當用戶向后臺反饋問題、提出建議或申訴時,使用「我們」是合理的語境,例如「我們將會審核你的申訴」);


          舉個例子:






          精簡語句:



          省略無用詞匯,不重復用戶已知事實;在絕大多數交互場景下,都無需界面描述出全部細節,盡量提供簡短、易于快速獲取的內容;

          例如:







          使用用戶熟悉的語言:



          使用簡單、直接、易于理解的詞匯,讓內容和指示更容易被用戶接受和理解,間接、曖昧模糊的說法,生僻和過于“文雅”的用詞,會增加用戶的認知成本,所以應當盡量避免使用這類用戶無法識別的詞匯;

          例如:





          表述一致:



          描述同一個事物的詞匯要保持統一;上下文的語法、語種、語序要保持統一;操作的名稱和目標頁面標題的名稱保持統一;

          例如:








          重要的信息放在顯著位置:



          讓用戶第一眼看到最重要的內容,不用到段落中尋找;(如果考慮安全性問題時,隱私信息也可調整為「點擊后可見」的方式)

          例如:





          完整、直接得闡述信息:



          當我們希望用戶進一步操作時,要專注于用戶能得到什么,以及用戶的感受;在操作前引導告知用戶操作的目的或重要性,能促進用戶更愿意去執行;

          例如:




          報錯是 UI 中常見的功能,它同樣是用戶體驗中不可小視的組成部分,當用戶填寫的內容出錯的時候,你的報錯信息應當符合用戶的認知,用易于理解的方式表述出來;




          用詞精準完整:



          通用基本用語,要規范,不能出現錯別字,詞語表達完整;專業用語要精準,并且是所屬行業認可的通用語言;時間的表述必須要明確;

          例如:




          這邊列出一個語言模度的表單給小伙伴們參考:





          語氣運用規范:

          語言定義的是內容,而情緒和氣氛更多的是通過語氣來表達,并且同樣的內容面對不同的用戶我們可以使用不同的語氣來表達;例如,我們對應專業的運維人員和小白用戶應該有不同的表達方式;



          拉近彼此的距離:



          直接使用「你」、「我」來和用戶對話,與用戶建立親密感,避免使用「您」,讓用戶感覺太過疏遠;

          例如:





          不要在同一個句式中混用「你」和「我」,交互中指代混亂會讓用戶產生疑惑,增加用戶認知負擔;

          例如:




          友好、尊重用戶:



          多給用戶支持與鼓勵,不要命令和強迫用戶;如果你想留住你的用戶,當出錯的時候就不要責怪用戶,專注解決問題而不是指責;

          例如:





          表述不能過于極端:



          不要使用過于絕對的表述,這樣會讓用戶感覺不適;

          例如:




          大小寫和標點符號:



          英文名詞大小寫規范:產品名稱全稱,首字母大寫;產品名稱縮寫要全部大寫,例如:SEO、SAP等;整個單詞都大寫不利于閱讀和識別,應盡量避免這種用法;

          例如:




          正確使用專有名詞的大小寫規范

          例如:




          全英文的標題,標簽,菜單項等等都要遵循英文句式中首字母大寫的規范

          例如:




          統計數據使用阿拉伯數字:


          這是常見問題,用戶對于數字的感知速度更快,使用數字而非文字表述會更加有效;

          例如:




          省略不必要的標點:


          為了幫助用戶更加高效的掃視文本內容,可以省略不必要的斷句點;

          以下元素單獨出現時可以省略標點:

          A. 標簽

          B. 標題

          C. 輸入框下的提示

          D. 懸停文本中的提示

          E. 表格中的句子





          以下元素單獨出現時需要加上標點:

          A. 多句或多段的文案和列表內容

          B. 任何文字鏈前的句子





          感嘆號使用規則:


          感嘆號會讓文案顯得過于激動,容易讓氣氛變的緊張,功能類少用;但是向用戶表達問候或祝賀時,使用「!」是合理的的語境,例如:「歡迎回到社區!」

          例如:




          基本標點規范:


          正確使用標點符號會讓句子看起來更加清晰和具有可讀性;具體使用可以看一下 1995 年中國標準出版社出版的《標點符號用法》,以下展示設計中需要注意的部分;




          作者:CC小酷
          鏈接:https://www.zcool.com.cn/article/ZMTEzMDI0NA==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

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

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

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

          探索“B+C”,為B端體驗加Buff

          ui設計分享達人

          在如今用戶為王的時代,用戶體驗成為一種新的品牌競爭力。隨著技術進步和體驗意識的普及,習慣了C端產品流暢愉悅的體驗,用戶對B端產品體驗的期望也越來越高。

          B端C化的概念也由此產生,但B、C端有著本質區別,C端的設計思維無法完全復用到B端,那是否可以基于B端產品特征,融合C端體驗設計思維,即“B+C”來幫助提升B端產品體驗呢?本文聚焦在探索如何通過“B+C”的設計思維,提升B端產品體驗。

          一、B、C端產品定義與差異

          我們先簡單了解下B、C端產品各自的定義。B、C端其實是以使用對象的類型,來代指的產品類型,C指個人消費者 (Customer) ,B指組織 (Business) ,這個組織可以是個人、公司、政府或機構,因此B端模式也是多樣的,除了B2B,還有B2C、B2G等。
          C端產品幫助個人解決生活場景中的需求痛點,提供人們消費的物質、信息和情感。常見產品類型有工具類、內容類、社交類、游戲類等,如滴滴、知乎、微信、王者榮耀等。
          B端產品幫助組織實現其商業目的,提供商業的工具、方法和服務。常見的產品類型有:CRM 客戶關系管理、ERP 企業資源計劃、OA辦公等,如企業微信、金蝶、釘釘等。
          下面我將從產品設計的角度,分析B、C端的差異化。

          1、設計原則的差異

          C端產品主要通過流量轉化獲得收益,因此人的注意力和使用頻率是關鍵,所以設計原則為“UCD”(User Center Design)以用戶為中心的設計。
          B端產品主要是為了能高效解決行業業務問題而存在的,所以其設計原則是以效率為中心。

          2、功能流程的差異

          C端產品主打一個滿足用戶核心痛點的功能,通過這個核心功能明確產品的特性和定位,附加N個增值功能,提高用戶粘性,加之創新和趣味性,保持與競品之間的差異化。
          B端產品功能重全面,為的是能滿足組織的各種業務需求,組織的業務邏輯通常就是產品邏輯,功能流程也由業務場景轉化而來。

          3、交互邏輯的差異

          C端產品是單線程操作,完成一項任務后才能進行另一項。碎片化的使用場景和廣泛的用戶群體,使得C端產品必須信息簡潔、容易上手、操作路徑短,否則將會導致用戶流失影響收益。

          B端產品是多線程操作,支持多個任務并行。交互以優化業務流程,提升用戶操作效率為主,關注信息架構,清晰的信息架構能幫助用戶在呈網狀的功能和交織的流程中,定位到自己所在功能頁面,找到所需的有效信息。

          4、視覺表現的差異

          C端產品視覺設計風格多樣,如賽博朋克、孟菲斯、3D、酸性設計等,注重情感化表達和氛圍的渲染,加上短視頻和直播,讓用戶沉浸其中。
          B端產品視覺服務于功能和信息的傳遞,視覺元素較為簡潔,常用色彩對比的形式,建立內容邊界和視覺層次。

          二、如何用“B+C”思維提升B端產品體驗

          無論是在設計原則、功能流程、交互和視覺方面,B端產品與C端產品都有比較明顯的差異?;谝陨喜町悾Y合B端產品特征和C端體驗設計思維,我們可以從以下三個方面提升B端體驗:

          視覺—降低認知負荷

          B端產品講究屏效,看得多通常比看的美重要,信息密度高,則屏效高,卻也相應的會增加用戶的認知負荷,因此我們需要為用戶認知減負。
          交互—以用戶效率為中心

          從用戶的行為和感知出發,本著以用戶為中心的原則提升操作效率。

          情感—關注情緒感受

          關注體驗過程的“峰”與“終”,提升用戶整體的體驗感受。
          下面我將結合實際工作案例,講述如何用“B+C”的設計思維,提升B端產品體驗。

          【案例分享】

          Speedshop Omnichannel(下面簡稱為Omnichannel)是款針對國內及東南亞中小商家,統一管理多渠道商品、訂單、交易、會員的ERP系統。
          目前共支持Lazada、Shopee、Tokopedia、抖音等7個渠道,最多可管理100個線上店,集訂單管理、產品管理、會員管理、聊天、導入導出等功能為一體,服務超40,000商家。

          視覺 — 降低認知負荷

          對信息的識別和處理是認知負荷的主要來源,在視覺層,我們主要解決的是信息識別帶來的負荷,信息識別就是用戶看到內容并選擇的過程,B端產品有信息量大,選擇多的特點,降低認知負荷也將圍繞這兩點進行。

          1、優化信息展示

          / 符合用戶訴求

          B端產品根據用戶規模的大小,可以分為大B (一定規模的中大型企業) 和小B (小微企業、個人創業),兩者對信息的關注點和訴求不同。

          表格是B端產品最常用的信息展現形式,且能將信息有序、高效、直觀的傳達給用戶,避免信息堆砌帶來的認知負荷。

          比如同樣是訂單頁,大B用戶的訂單數據量龐大,且訂單通常是自動流轉的,無需手工操作,所以針對大B用戶,表格信息展示有兩個側重點,一是增加信息密度,二是幫助用戶能夠快速精準過濾信息。

          小B用戶的訂單數據量相對較小,且以手工處理為主,所以在展示訂單時,可以將關鍵信息整合,通過將信息進行分層、分組的展示形式,降低單頁面信息的復雜度,還可以通過各模塊之間字體大小、顏色、圖標、間距等手段將信息層次區分開。

          / 豐富信息展示維度

          還可以通過圖形化、可視化和視頻的形式,豐富信息的內容維度,化抽象為具象,讓信息能更高效的傳達。

          在Omnichannel中,用戶需要完成新手配置后才能使用產品,進入首頁看到的是任務型的引導,通過圖形輔助任務說明,豐富畫面的同時還能增加產品的親和力。

          B端產品由于業務的復雜性和技術的局限性,通常操作沒有那么靈活,需要遵守一定的使用規則,傳統的做法會通過文字說明的方式傳達給用戶,面對一長段的規則說明,讀幾遍還不一定能理解。

          比如在導入產品時,規則內容多且邏輯復雜,可以將內容可視化,使其易于傳達和理解。

          視頻比文字的畫面感更豐富,傳播的內容也更加具體,在幫助中心,圖文的基礎上增加視頻,幫助用戶更高效的獲取幫助信息。

          2、提供個性化配置

          B端產品通常包含多種用戶角色,每個角色的需求關注點不同,為了滿足各角色的需求,單頁面信息往往會出現超負荷的情況。
          我們可以借鑒C端的個性化,對于非業務性的功能,允許用戶根據自己的需求和工作習慣進行自定義。
          比如下圖,在列表頁,我們為用戶提供了自定義篩選條件和表格字段的設置。

          3、提供有效決策信息

          由于業務復雜,保障功能的全面,帶來的結果通常是操作和選項較多,如果沒有任何指引,B端產品的用戶通常無法做出合適的選擇。
          比如下圖的添加商品,根據不同的使用場景,產品為用戶提供了三種添加商品的方式:

          只有三個選擇,看似沒有任何操作難度,但用戶面對未知功能時,通常會根據自己過往的工作經驗,選擇熟悉的功能,這樣一來,可能會誤增了工作量,因此在設計上,要提供輔助介紹說明,幫助用戶決策。

          我們在此基礎上,為第一次使用該功能的用戶又做了優化,除了消息提示框,還通過標簽強化視覺重點,推薦最適合新用戶的選擇,添加商品的文案也改的更通俗易懂。

          交互 — 以用戶效率為中心

          1、  提升用戶行為效率

          無論B端還是C端產品,都有一個共同的體驗目標:提升操作效率,高效率意味著用戶通過更少的操作,更少的時間完成任務,實現降低成本的目標。在C端產品中,常見的提升效率的方式有:1、根據用戶行為的流程分析,推薦相應功能;2、聚合用戶行為,縮短操作路徑;3、轉移用戶操作成本,讓產品承擔更多的用戶引導、行為判斷和行為記憶,我們可以從以上幾點切入優化B端操作效率。

          引導用戶操作

          在C端產品中,經常會有根據用戶的操作行為,產品給出相應的推薦操作,如截屏后,在用微信發信息時,系統會提示是否要發送截圖,這種在操作過程中增加相關功能的曝光或引導,提高用戶操作效率的同時也不影響流程的順暢進行。
          下圖是商品管理頁,用戶首次進入時,可以根據用戶觸發的操作推薦相關的幫助引導。

          手動創建商品時,需要完善很多商品信息,可以為經常出錯的內容預設提示,先發的避免用戶出現錯誤。

          在收起/展開菜單欄時,提示快捷鍵功能。

          / 優化任務路徑

          B端產品中通常會有一個任務關聯一些子任務,如果用戶在子任務中遇到困難,往往會造成整個任務效率的降低甚至任務中斷。

          比如在手動創建商品的流程中,需要將商品信息推送到渠道線上店才算創建成功,所以在創建商品前,需要完成渠道線上店的創建。針對這種關鍵子任務,我們可以嘗試并行任務,在選擇線上店時,增加創建線上店的入口,將任務連貫起來。還可以通過操作的合并,比如保存和添加同步進行,提升整體的任務效率。

          2、弱化低效感知

          好的產品體驗,不止強調功能,還會在意體驗中的感受,設計也可以左右用戶感知產品效率的快與慢。

          / 等待時間可感知

          用戶對等待的耐受度是有限的,等待時間在2s內是相對愉悅的,在時間不可控或時間較長的情況下,我們應盡可能縮短用戶的感知時間。

          比如在下圖中,用戶完成新手配置后,產品有個加載的過程,通過加載動畫和加載步驟的分解,告知用戶系統在運行中,縮短感知時間的同時消除用戶的負面情緒。

          / 容錯性設計

          在產品使用過程中,經常會出現因用戶“犯錯”而導致的任務中斷或失敗,這里的“犯錯”,通常是因為用戶操作偏離產品的使用要求,但這并不是用戶的錯,人不是精密的儀器,好的體驗應該包含這部分“錯誤”。

          比如錄入數據時,應給予實時的提醒,讓用戶可以及時更正,而不是等到提交時才拋出錯誤提示,還有比如在數字輸入框中誤輸入其他字符時,自動幫用戶清除等。

          在涉及對用戶影響較大、重要且不可挽回的操作時,給出提示。

          情感 — 關注情緒感受

          在整段體驗感受中,情緒最強烈和結束時的感受影響著用戶對整個體驗好與壞的判斷,這個現象就是峰終定律,因此我們可以通過關注這些關鍵時刻,來確保用戶對整段體驗是感到愉悅的。


          1、減少負峰

          消極的情緒,不僅影響用戶對產品的體驗感受,最終還會落到降低效率上,因此在設計時,我們要考慮減少用戶的消極情緒。

          / 提供明確反饋

          用戶使用產品的過程就像是與產品進行“對話”,良好明確的反饋能幫助用戶理解和使用產品,在工作完成時,應告知用戶已完成,出錯時,告知用戶哪個環節錯了,如何改進或提供幫助,不要讓用戶去猜,而是主動為用戶提供解決方案,提供確定感。

          比如在創建商品的流程中,商品創建完成后要推送到渠道線上店,中間有一段較長時間的等待,在設計時,根據推送中、推送完成、推送失敗,分別提供了3種對應場景的提示,讓用戶知道當前任務進展,以及展示相關對應的操作,即使任務失敗,用戶也知該如何處理,增加用戶的控制感。

          / 任務中斷可回溯

          在B端產品中,經常會出現決策信息多,處理鏈路長,需反復多次進入任務流程的情況,當任務被迫中斷時,用戶情緒會受到影響,且用戶對未完成或中斷的任務往往比已完成的記憶更深刻,針對這類情況,我們需提供可回溯的設計,幫助用戶順利完成任務。

          比如在將商品推送到渠道線上店時,同步過程中,用戶可以離開當前頁面進行其他操作,系統會將推送結果展示在列表頁,用戶可以通過列表頁,重新推送或者編輯修改后再推送,直至完成任務。

          2、結束于正峰

          在完成任務后,可以觸發氛圍動效反饋成就,給用戶積極的結尾。

          寫在最后

          以上就是我基于B端產品特征,和C端產品的體驗思維,用“B+C”的設計思維嘗試探索優化B端產品體驗的一些方案嘗試?!癇+C”的設計思維,其本質是想找到業務與體驗的平衡,作為B端設計師,好的用戶體驗一定是與業務緊密結合的,與業務匹配的體驗優化才有其意義和價值。


          作者:Cila
          鏈接:https://www.zcool.com.cn/article/ZMTUyNDc0MA==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

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

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

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

          探索企業B端設計規范:如何打造無與倫比的用戶體驗

          ui設計分享達人

          今天和大家分享企業內部建設計系統的方法和實踐,也期待大家指正與交流~

          企業級B端產品具有行業壁壘高、業務復雜、服務角色多等特點,在大型迭代項目中,如何做好設計協同,把握設計一致性和還原度常常讓很多設計團隊感覺無從下手,找不到切入點。在長期的項目實踐中我們發現,做好設計規范能規范可以幫助個人、團隊以及整個企業提高效率和產出質量,保障用戶體驗統一。

          那么,我們該如何做好體驗標準化,保障基礎體驗一致性?下面將和大家分享我們公司在構建設計規范的實踐案例。

          一、為什么要做設計規范?

          以我們設計團隊為例,隨著業務不斷擴大,定制化需求不斷增加,大型迭代項目做不好設計和開發協同,導致出現“體驗一致性差”“設計效率低”“還原度不可控”等問題。如何有效解決這些問題呢?可以通過構建設計規范,以保證一致性,實現工作提效。


          從不同角度出發,構建設計規范都能發揮積極的作用。

          對企業來說:有利于實現產品經理、設計和研發的輸出一致。設計側主動建立產品設計規范,很大程度上是為了做好設計管控,實現原型、設計稿到線上頁面統一的設計語言,從根本上提升設計質量和還原度,提高用戶滿意度。

          對個人來說:當多個設計師共同協作同一項目時,由于設計理解不一致等原因,容易出現設計控件使用混亂等問題。若有詳細的設計規范作為引導,有利于實現產品各個模塊間的一致性。組件化的工具也能減少機械重復性的工作,讓設計師將更多精力投入到用戶研究和提升用戶體驗上。

          二、建立設計規范的時機?

          產品有不同發展階段,設計規范同樣也有,不同階段下的產品目標和規范需要覆蓋的內容都不盡相同。我們要既要避免做多,保證投入產出比最大化;同時也要構建一個合理的規范迭代思路。

          產品探索初期:

          該階段的產品核心目標是「驗證產品或商業模型」,業務需求都是小步快跑、頻繁迭代。產品處于從0到1的野蠻生長狀態,存在著“先滿足功能,再優化體驗”的情況,導致該階段的產品體驗往往不太過關。

          搭建目的:通過定義原則,梳理關鍵頁面和流程,搭建基本的規范框架。既讓團隊對產品有統一的設計價值觀和認知判斷;從頁面到流程,又能對應設計參照標準;同時業務可以在規定的框架下發展,不僅讓產品體驗的根基牢固,而且不會限制功能設計自由。

          搭建范圍:「全局說明」「頁面布局」「通用流程」

          產品穩定發展期:

          該階段的產品基本形態已穩定,也形成了初步的模型結構。后續迭代是在現有結構的基礎上,進行增加或優化功能。雖然探索期定義了產品原則、布局和流程,但探索期產品的自由生長,會導致不少設計細節不一致,從而影響了產品整體的體驗和效率。

          搭建目的:通過回溯整理過往設計,沉淀優化成完整的交互規范。再根據規范統一產品體驗,進一步優化流程和效率, 讓整個產品體驗達到相對穩定的狀態。

          搭建范圍:「全局說明」「頁面布局」「通用流程」「基礎組件」「業務組件」

          三、一個好的設計規范是什么樣的?

          好的設計規范有很多優秀的例子,例如Google、Apple、Microsoft這些引領全球設計風尚的公司,設計規范已經上升為設計語言,指導旗下所有產品的設計。國內做的優秀的案例,比如Ant Design,Element,arco.design等,像這類的產品已經實現了端到端的體驗一致,把交互、前端和視覺的事情一并解決了,是值得學習的典范。這些優秀的設計規范都包含以下幾個特點:靈活性,可擴展性,系統性和標準性。

          一般團隊內部構建的設計規范都源于某一產品或者業務,因為主要是團隊內部成員使用,追求的是投入產出比最大化。所以可在行業通用設計規范的基礎上,適度參考行業設計規范,能復用的直接參考,同時專注于業務本身,具有業務特性的再集合業務綜合考慮,使整個規范制定效率更高,科學性、指導性更強。


          四、如何制定設計規范?

          設計規范的執行和推動主要分為四大步驟:

          類型梳理:分析業務場景,整理和歸類組件,評估具體組件優先級和迭代計劃;

          全局說明:統一布局,色板,字體,常用樣式,規范設計語言;

          抽象設計:將設計共性抽象出來,構建組件通用方案;

          效果驗證:通過定性/定量數據追蹤效果,分析原因,迭代改進;


          第一步:類目梳理

          收集現有設計頁面,分析業務場景,再參考行業通用規范的定義,整理和歸類組件,可以先羅列完整,再根據產品實際業務需要進行增刪改。

          全局說明:明確影響整站各個模塊、各個頁面設計的原則和規范,指導我們后續各種規范的定義和設計。包括統一布局,色板,字體,樣式等設計規則。

          基礎組件:可參考行業通用規范中的基礎組件分類和組成,因為大部分基礎組件都具有一定的通用性,站在巨人的肩膀上更高效。這里我們根據實際情況,將基礎組件分為導航,通用,數據展示,數據錄入,反饋5個大模塊,每個模塊下再細分各小類,構成基礎組件的類目。

          業務組件:根據業務需求,可以定義屬于自己的業務組件,這也是區別于其他通用行業組件庫的一個核心部分。


          第二步:全局說明

          因為在大體量產品設計中,每個模塊都由不同的同學負責,這樣全局產品的把握就會降低,需要去補充全局規范說明去維持產品全局通用部分的一致性。包括布局,色彩規范,字體,樣式等;


          第三步:抽象設計

          抽象設計是設計規范中最核心,工作量最大,難度最高的一個環節。我們可以將它拆解成幾個部分,先做出基礎組件,再基于基礎組件和業務需求抽象設計業務組件,最后抽象成頁面模板。

          基礎組件

          組件庫的搭建,就一定要提到原子思維。道爾頓原子論認為,物質世界的最小單位是原子,原子是單一的,獨立的,不可被分割的,在化學變化中保持著穩定的狀態。這個原子理論同樣適用于設計系統中。

          其中,最小單位設計元素就是基礎組件。我們在做設計系統的時候希望當你改動任何一個原子,你有自信其他所有依賴于這個原子的部件全部自動更新。只有滿足了這一點,設計系統設想中的效率、解放生產力才會真正實現。例如,在sketch中,分享樣式和嵌套符號的使用。


          業務組件

          在構建完基礎組件后,可以根據業務需求,將使用頻率較高的組件進行評估,抽象成業務組件。

          一般業務組件可分成兩大類:

          一類是由多個基礎組件組成的帶有業務需求復合組件,如:復合標簽,快捷時間選擇器等;

          另一類是針對特定業務場景的業務組件:如地圖,站點等;


          頁面模版

          在完成基礎組件和業務組件的構建后,我們可以根據全局說明,利用組件搭建頁面模板。頁面模版不僅能有效的提升組件的使用效率,也能提供很好的組件使用示范效應,加強設計說明和組件之間的結合。



          第四步:效果驗證

          組件質量評估:從物理到行為層,包括樣式、組件、框架、組件交互 共4個維度。通過一致性評分衡量標準化覆蓋的好壞。

          系統應用層面的評價:

          系統是否幫助業務提效;

          當業務不能直接應用系統,能否靈活改動;

          系統是否幫助業務變得更有競爭力、更創新;

          五、迭代方案和機制提效

          迭代機制

          當我們完成設計規范的整體構建后,對于新需求,通過評估復用性、通用性和優先級,低級別的走定制設計完成交付。高級別的通過抽象設計、內審、沉淀到組件庫中。

          機制提效

          在完成設計規范的構建后,我們可以聯合產品經理和前端工程師,幫助每個環節的人員快速搭建產出物,推動上下游機制提效。

          例如,我們會基于設計規范,為產品經理提供符合設計規范的Axure元件庫,產品經理使用元件庫,可以快速搭建原型,產出prd,與設計師、開發的溝通也更加順暢。簡單的修改可以跳過設計師出圖這一步驟,直接和開發溝通,極大加快前期的節奏。甚至通過借助元件庫,產品經理可以搭建出高保真原型,用于直接和用戶確認或者給客戶進行demo的演示。

          基于設計規范,推動研發實現組件代碼化,通過設計標準化可以達到研發工業化。通過定義標準規范,提高流程、組件的復用率,開發側就可以制定相應組件,形成前端腳手架,方便后期迭代的組件化使用,有效地避免不必要的分歧點和重復造輪子,同時減少上線前設計走查、測試的工作量,保證落地效果,提升生產力。

          以上就是我們在構建自己的企業設計規范的流程,最后,給大家展示一下,我們目前的企業設計規范和部分應用情況。


          作者:北斗BDD
          鏈接:https://www.zcool.com.cn/article/ZMTUyNTQyOA==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

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

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

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

          高級設計師才會的設計思維,31個細節幫你深入了解

          ui設計分享達人

          1. 并不存在單一的設計過程

          設計過程被描述為多個階段,每個階段都包含不同的活動來完成該階段,它沒有統一的標準流程,每個公司和設計師都有自己的流程版本。

          盡管存在多個流程,但一般流程和階段類似于以下內容:

          了解問題:初步了解問題。觀察、采訪和傾聽用戶。

          定義問題:解釋和定義要解決的問題。

          構思:通過頭腦風暴產生盡可能多的想法。

          原型設計:構建原型并與其他人分享( 再次縮小解決方案空間,為實驗階段 )。

          測試:測試可能的解決方案、實施、改進或重新設計。

          2. 設計思維是傳統解法和創造性設計過程的結合

          傳統的問題解決采取有條不紊而又科學的形式。該過程從一個問題開始,定義要采取的步驟以及達到解決方案的工具或方法。

          設計思維是一種創造性的策略,可以產生創造性的未來結果和/或創造性的問題解決方式,它應該被認為是一種以解決方案為中心的思維策略。

          它通常被描述為一種創造性、主觀和感性的對許多大型組織的分析邏輯( 布朗,2008 年 ),或作為分析和創造性推理模式的組合( 鄧恩 & 馬丁,2006 年;利特卡,2015 年 )。

          3. 設計思維是問題解法的進階

          設計思維來源于常規問題解決方法,常規問題解法是設計思維的基礎。

          從解決問題到設計思維,Liedtka (2013)

          結果發現,設計思維實際上也是一個解決問題的過程,而不僅僅是一個創新過程( 利特卡,2013)

          一個例子是,豐田采用設計思維從頭開始分析其西海岸的一個客戶聯絡中心,在重新設計過程中,組建了一個由一線呼叫代表、軟件工程師、業務主管和變革代理組成的跨職能團隊,這一舉動最終改變了客戶和員工的服務中心體驗。

          4. 從起床到入睡,你都在解決問題

          我們每天都會遇到問題,但是當我們解決同樣的問題時,它們就成了例行公事( 似乎已經忘記它們是問題了 ),我們甚至都沒有意識到正在解決這些問題。例如,我的辦公室在 30 分鐘路程之外,該怎么到達那里?開車、坐火車或巴士到目的地;除非車子輪胎被刺破,否則你就需要弄清楚如何到達辦公室。

          5. “設計思維”術語的產生

          1990 年代,IDEO 的 David Kelley 和 Tim Brown 與 Roger Martin 共同創造了特定術語:“設計思維”,并將多年來醞釀的方法和想法封裝成一個統一的概念。

          6. 工程設計思維現在被稱為設計思維

          設計思維是以人為中心、開放式、基于問題的方法論。這種方法最初是為了改變工程教育中的教學方式,而工程師處理和解決問題的方式有其設計思維的基礎。

          7. 設計思維的歷史早已出現(2000 年)

          設計思維一詞可以追溯到 1987 年 Peter Rowe 的著作:“設計思維?!?他描述工程師和建筑師處理問題的方法有很大不同。

          90 年代初,認知科學家 Don Norman 加入 Apple 團隊,擔任他們的用戶體驗架構師,這使他成為第一個在職位中包含 UX 的人。他提出了“用戶體驗設計”這個術語,因為他想“涵蓋人們對系統體驗的所有方面,包括工業設計、圖形、界面、物理交互和手冊?!?從那時起,這些領域中的每一個都將用戶體驗,擴展到了自己的專業領域。

          8. “棘手的”設計思維

          設計思維在解決“棘手問題”時特別有用。

          棘手問題的特征

          “棘手問題”一詞是由設計理論家 Horst Rittel 在 1972 年創造的,用來描述本質上非常模糊 \ 特別棘手的問題。棘手問題,有很多未知因素,沒有確定的解決方案。問題或解決方案可能與另一個棘手的問題有關,因此這是一個需要設計思維的持續過程。貧困、饑餓和氣候變化是一些現代的棘手問題。

          9. 設計思維不僅限于數字化設計的應用

          設計主題的范圍是普遍的,因為 設計思維可以應用于人類經驗的任何領域。

          它可以用于:

          符號和視覺傳達:這包括平面設計的傳統工作,如排版和廣告、書籍和雜志制作、科學插圖、攝影、電影、電視和計算機顯示。

          材料:這包括對日常用品的形式和視覺外觀的傳統關注 —— 服裝、家用物品、工具、儀器、機械和車輛。

          人類活動和組織性服務:包括對物流的傳統管理關注,結合物質資源、工具和人類低效的序列和時間表,以達到特定的目標。

          復雜的系統或環境:生活、工作、娛樂和學習。這包括系統工程、建筑和城市規劃的傳統關注點,或復雜整體部分的功能分析及其隨后在層次結構中的集成。

          10. 設計思維不僅限于設計師的實踐

          設計思維起源于設計師的培訓和專業實踐,但這些原則可以被每個人實踐并擴展到每個活動領域。(布朗,2013 年)

          在企業中,設計過程可以為企業環境中的問題解決帶來創新思維。它還可以用于醫療保健,通過向護士、醫生和管理人員教授設計思維技術,我們可以激勵相關從業者貢獻新的想法。

          11. 了解問題是第一

          不管是什么設計,理解和研究問題是必不可少的,因為我們能夠從其出發,從而進行以用戶為中心的設計。

          設計思維的最早階段是搞懂你能帶來的情感價值。設計思維方法迫使你停留在提問與質疑階段,而不是準確定義出問題后進入下一階段。我們都有過快進入解決方案模式的傾向,所以設計思維方法迫使你真實地存在于這個不清楚、有時還非?;靵y的時刻,從而使你對要解決的問題產生更好的理解。(利特克,2013)

          12. 設計思維需要兩種不同的思維

          傳統的問題解決涉及提出一個解決方案,但設計思維首先使我們發散,試圖為問題生成各種可能的替代解決方案。然后讓我們進行收斂性思維,縮小多種可能性,找到單一的最佳解決方案。

          13. 設計思維是可以傳授和學習的,它不是一種人格特質

          根據利特卡和奧美 (2011) 的說法,設計思維的全部意義在于學習一種新的、系統的解決問題的方法。正如我們思考創造力一樣,即使是設計思維也可以通過實踐來教授和改進。

          14. 設計過程不是線性的

          設計過程從來都不是線性的,它由多次失敗和迭代組成(布朗,2018)。

          首先,設計師試圖將問題與過去的類似案例聯系起來。如果這種方法不能提供任何解決方案,下一步就是使用知識和創造力作為一種實驗思維形式來產生新的想法。使用決策矩陣對這些想法進行評估,從而會產生被進一步分析和測試的解決方案。如果成功,它將被實施。如果不成功,則需要重新表述問題,并重復該過程。這是一個迭代過程,即循環方法。

          這一持續不斷的重新再設計過程,源于和客戶親密接觸的洞察。

          15. 調研是設計思維非常重要的工具

          學習設計思維不僅僅意味著學習一套新的工具。它還意味著:學習收集和分析大量數據;學習挖掘對象可能的形態而不是自主認為他是什么;學習管理不確定感,以及與許多新的伙伴合作( 利特卡和奧美,2011)。你可以進行的研究類型分為三類:生成性研究、評估性研究和驗證性研究。

          16. “要么很快失敗,要么經常失敗”

          一種常見的表述 —— 實際上是設計思維的另一種視角 —— 即設計師應該預料到會“很快失敗或經常失敗”(布朗,2009)。

          當過程早期發生故障時,例如被拒絕的原型,實質上它可以為有效解決方案提供關鍵見解。這種觀點與傳統的先形成理論,再檢驗正誤的方式相矛盾。

          17. 公司正在將設計思維作為解決問題的核心方法

          Airbnb、Braun 和百事可樂等多元化公司都在 采用設計思維并將其作為核心戰略。例如,IBM 為全球旗下的 44 個設計工作室聘請了 1600 名設計師,并且正在培訓數以萬計的設計師員工建立深度創新能力 ( O'Keefe, 2017 )

          18. 以人為本的思維

          設計思維為我們解決問題添加了以人為本的元素。當我們試圖通過牢記人們的想法來解決問題,并使用基于直接觀察乃至訪談的研究時,我們便會捕捉到與消費者需求一致的意外見解和創新。

          19. 可觀的商業價值

          它有助于將成功的產品更快地推向市場,最終節省企業資金。
          IBM 的健康和人類服務組織的設計思維實踐,通過有效使用設計和設計思維幫助企業將缺陷數量減少了 50% 以上。這種更高效的工作流程導致計算出的 ROI 超過 300%。

          20. 對復雜問題的作用性

          由于復雜的問題從來不能被所有人完全理解,因此在嘗試設計解決方案時,處理歧義和多個并發的思路方向的能力是至關重要的素質。

          設計思維通過綜合和歸納思維,幫助實現質的飛躍。它允許通過解構來測試約束,并允許通過多樣性思維和批評思維,來擁抱和探索歧義。

          消費者通常不知道他們有什么問題需要解決,或者他們無法用語言表達出來。只有經過仔細觀察,設計者才能根據真實消費者行為中看到的東西來識別問題,而不是簡單地根據對消費者的想法來確定問題。這有助于定義模棱兩可的問題,并找到解決方案。

          21. 別名:跳脫框架的思維

          該方法鼓勵“跳出框架思考”(“瘋狂的想法”);它蔑視顯而易見的事物并采用更具實驗性的方法。
          在早期的流程階段鼓勵大膽的想法,以產生創造性的解決方案。使用它是為了讓設計師可以嘗試開發新的不受約束的思維方式,或對常見問題的創新解覺方法。

          22. 設計思想家的特征

          根據大多數設計學院的說法,具備特定特質的人能夠更好地發揮設計思維的作用。

          同理心:從多個角度想象世界 —— 同事、甲方客戶、實際使用者和消費者的角度。要成為更好的同理心,必須傾聽和觀察他人的行為,注意并獲得洞察力。

          綜合思維:重要的是不僅要有分析能力,而且要能夠提出新穎的解決方案,還要憑直覺。

          樂觀:除非你相信有解決方案,否則在遇到挑戰且解決方案遇到瓶頸時,你可能會放棄。

          實驗主義:重大創新并非來自漸進式調整。設計思想家以創造性的方式提出問題并探索限制因素,并朝著全新的方向發展。

          協作:產品、服務和體驗日益復雜,因此必須擁有一支具有不同背景的團隊,以幫助從多個角度看待問題。

          23. 有助于對抗某些偏見

          當我們想到一個問題的多種解決方案時,對我們解決問題會非常有幫助,因此“功能固定性”阻止了我們以新穎的方式使用舊工具解決新問題。想要擺脫功能固定,首先是要讓人們可以使用“改造后的衣架進入上鎖的汽車”。這也是盜賊第一次可以用信用卡撬開簡單的彈簧門鎖。

          24. 實用

          為了幫助設計師利用文科和技術理論,整合多個領域的知識以找到創新的解決方案,我們采用設計思維來獲得洞察力。該方法側重于可視化和操作,因而幫助我們更容易地了解實際解法,而不僅僅是理論模型。

          25. 執行

          第一批美國公司在 2000 年代初期開始實施設計思維,這一概念引起了德國投資者 Hasso Plattner 的興趣,他于 2006 年資助創建了兩所設計學校(d.schools),其中一所位于波茨坦大學(德國),另一所位于美國斯坦福大學。由于兩所學校都成功地為大型組織提供了高管設計思維培訓,因此該研究重點關注這些國家,以尋找早期實施者。

          26. 團隊思考

          設計思維通常涉及希望參與整個設計和開發過程的龐大利益相關者團隊。

          觀點、才能和經驗的多樣性被認為是注入新思維的部分重要來源。多樣性確保通過融合不同的觀點、技能和知識來產生創意(卡振思,2018 年;薩梅和德拉赫-扎哈維,2013 年)。設計思維的協作方法和工具可幫助團隊以積極的方式利用他們的差異。

          決策是平等的,因為每個成員的意見都被征求和使用(卡爾格倫等,2016)。

          27. 不需要花哨的技術原型

          當 IDEO 去 Apple 展示他們的鼠標時,它不是什么花哨的設備,而是一個用膠帶粘起來的原型。

          低保真原型制作起來既快速又便宜( 想想幾分鐘和幾分錢 ),但可以從用戶和同事那里得到有用的反饋,這符合快速驗證、廉價試錯的原則。為每個想法投入盡可能少的資源意味著前期投入的時間和金錢更少。此外,將多個原型帶到現場進行測試為用戶提供了比較的基礎參考,同時也有助于揭示某些需求。

          28. 過程強調心態和行動

          為了創新,設計思維意識到認知和行動對創新過程很重要。認知包括接受度、樂觀和創造性的信心( 凱莉 & 凱莉,2013;鄭,2018),而行動包括快速原型設計、旅程地圖和假設浮現( 假設浮現:assumption surfacing,這是一種評估技術,涉及寫出潛在的假設和反假設。)( 卡爾格倫等,2016;利特卡,2015)

          29. 在組織中實施設計思維的挑戰

          如果領導層不歡迎風險、模棱兩可和風格的改變,實施起來就會變得更加困難。它會被管理者“質疑”其具體指標

          沃爾特斯 ( 2011 ) 聲稱,由于設計思維的模糊性,它與組織文化相沖突。

          據受訪者稱,在日常業務中使用設計思維之所以不會是最優選項, 因為它是資源密集型的,增加了工作量。( 麗莎等,2016)

          在醫療保健等規避風險的行業和公司中,“經常和早點失敗”的方法被認為是非常困難的。

          30. 設計思維的問題

          許多設計師反對設計思維這一觀點,設計思維不僅關乎一個過程,而且關乎改變思維過程并提高人們可能提出的解決方案的創造力。

          “設計思維”的推廣已被大型全球公司用來增加業務。不過,在更廣泛的設計世界中,我甚至會說“設計思維”的過度宣傳導致了所提供設計質量的下降。—— Yasushi Kusume

          弗吉尼亞理工大學科學、技術和社會助理教授 Lee Vinsel 在《設計思維運動是荒謬的》中寫道,“歸根結底,設計思維與設計無關。這與文科無關。這與任何有意義的創新無關。如果這意味著重大的社會變革,那肯定不是關于“社會創新”。這是關于商業化的?!?

          31. 為什么需要共情

          觀察人們的行為以及他們如何與環境互動,可以為你提供有關人們想法和感受的線索。

          你可能認為你知道問題所在,但只有通過觀察才能了解消費者真正需要什么。

          宜家派設計師到人們家中,觀測他們的互動行為來了解他們的需求。這將使設計者能夠推斷這些經歷的無形含義,以發現洞察。這些洞察提供創新解決方案的構思方向。而事實上,最好的解決方案來自于對人類行為的最佳洞察。

          Good Kitchen 是一家為老年人和體弱者提供膳食的社會服務機構。起初的問題似乎是設計不當的膳食菜單。然后設計思維揭示了無數問題,所有問題都源于服務本身的性質。因此,經由對服務進行了徹底改革的之后,最終提高了客戶和員工的滿意度(利特卡,2014)


          作者:用盡晴天
          鏈接:https://www.zcool.com.cn/article/ZMTUyODUzNg==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

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

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

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

          UI/UE | 產品體驗日記 05(剪輯軟件專題)

          博博

          學習大廠如何做設計,站在巨人肩膀上思考 
          如何讓自己的產品在保證基本的可用性和易用性的同時,還能讓界面看起來柔和、更富有親和力?一個產品能留住用戶的雖然是內容本身的質量與吸引力,但一個小小的細節卻能夠阻止用戶的流失,成為內容轉化的最后一道防線,讓人眼前一亮,值得借鑒。 


          體驗目錄:
          01. 【剪映化繁為簡,突破性的C端深度編輯交互界面!

          02.【剪映】組合操作,簡化界面跳轉的“批量編輯”

          03.【必剪】軌道按鈕文案自適應滑動跟隨

          04.【剪映/IOS】首頁新增(試試看)教程專區板塊,快速入門軟件

          05.【剪映】“剪同款”功能,讓用戶快速出片

          06.【剪映】上滑升起列表,讓用戶查看選擇更加直觀

          07.【剪映】不同類型的模塊,分區展示

          08.【剪映】選中特效后,自動播放(特效預覽效果)

          09.【剪映】濾鏡功能“單行瀏覽”的原因以及必要性

          01.【剪映】化繁為簡,突破性的C端深度編輯交互界面!

          產品體驗:

          在此前,用戶想要對視頻進行剪輯操作,用戶大多都需要使用電腦的Ae、Pr等剪輯軟件,此類軟件體量大,操作門檻高,而且需要有電腦的存在,在人手一臺智能手機的今天,剪映等專業剪輯APP的出現,填補了用戶需要在手機上進行視頻剪輯的需求空白。

          剪映的UI交互界面,既保留了Ae、Pr等專業剪輯軟件的界面特點(畫面軌道,音頻軌道),也大大的降低了剪輯軟件的操作門檻。


          剪映的UI交互精明之處在于,它將專業剪輯軟件的復雜,位置隱蔽,但又常用的剪輯操作。「整合」成為底部一個個顯眼的功能圖標,并且用極為精簡易懂的文案,對功能進行了一個充分的描述。這一舉動,大大降低了用戶對剪輯軟件復雜功能的理解門檻,用一種整合式的思維,提供功能給用戶合成使用。這簡單易懂的交互體驗,也大大提高了用戶的黏度,忠誠度。讓小白用戶接觸了剪映后,再也無法回到Ae、Pr了。




          交互思考:


          在AI人工智能浪潮下,一切機器輔助,機器完成,需要人效的地方越來越少,在這大背景下,我們軟件的用戶只會變得越來越懶。
          在新時代的背景下,我們UI、交互設計師,需要一種寶貴的「化繁為簡」能力,在不影響最終呈現效果的前提下,將一個軟件的交互體驗,文案、功能理解,以及功能使用操作做得越簡單,用戶的黏度,忠誠度就會越高。

          一個工具類APP何為「好用」?也許就是像剪上映一樣,“化繁為簡,成效依然”

          02.【剪映】組合操作,簡化界面跳轉的“批量編輯”

          產品體驗:

          在剪映中,識別字幕的交互邏輯,是自動識別所有視頻片段的語音,并且插入時間線中,識別字幕是【批量進入時間軸】的。所以想統一進行編輯,得一個個反復選中,然后逐一檢查,這種累人的交互體驗,讓用戶用了第一次就不會想用第二次。

          剪映推出了「批量編輯」交互功能。

          語音識別后,用戶點擊其中一個識別字幕,底部第一個功能就是「批量剪輯」功能,點擊后,可以一鍵編輯全體的識別字幕內容,減少了用戶調整識別字幕是的操作交互時間,增加了用戶操作效率



          設計思考:

          在產品的功能交互設計中,不妨使用剪映的「整合思維」,將一些重復性高,標簽統一,可統一操作的元素整合在一個功能中統一編輯,減少用戶的操作切換與跳轉,增加用戶的交互體驗與操作效率

          03.【必剪】軌道按鈕文案自適應滑動跟隨

          產品體驗:

          在必剪中隨著用戶左右移動,軌道按鈕的文案也會跟隨移動,讓用戶無論滑動到何處,什么位置,都能清晰的知道軌道的應用名稱,而不會出現混淆的情況。最大程度上,減輕了用戶的理解成本



          設計思考:
          當我們的圖標,功能板塊,或者某些重要信息,被用戶左右、上下滑動導致超出屏幕展示區域,用戶想回頭找到這些元素,就得重新滑動到對應位置,走一趟“回頭路操作” 。這對用戶來說其實是不便捷的,對交互設計來說,是不聰明的

          我們可以利用【必剪】的文字跟隨交互,來舉一反三,讓一些重要的功能,信息區域,隨著用戶的滑動而自適應跟隨,最大限度地保證用戶他不錯過這些重要的功能、信息。

          04.【剪映/IOS】首頁新增(試試看)教程專區板塊,快速入門軟件

          產品體驗:

          在用戶(特別是大齡用戶),在初次使用【剪映】這種有一定入門難度的APP的時候,其實都是感到陌生的,新手指引雖然能一定程度解決此問題,但是新手引導只能在第一次打開APP時展示,而且新手指引有非常強的局限性,它只能告訴能這功能要怎么用,而無法告訴你這功能的使用場景。

          所以在首頁中新增一個軟件使用技巧、教程專區,可以讓有需要的用戶第一時間觀看課程,入門軟件,而且課程用戶可反復觀看,不像新手指引般一次性展示。

          這種交互體驗,大大減輕了用戶入門軟件的難度。



          設計思考:

          在我們設計的產品是一個工具型軟件,且有一定入門、使用難度的時候,不妨參考一下【剪映】的首頁+軟件使用教程 的交互思維。

          用最低成本教會用戶如何使用這個軟件,而且展示位置是每次打開APP時都會看到的首頁,不用擔心一些粗心的用戶錯過。

          05.【剪映】“剪同款”功能,讓用戶快速出片

          產品體驗:

          在剪映Tap欄中,有一個 “剪同款” 功能,選中對應的視頻模版后,填入自己相冊的素材,聽過自動剪輯,特效覆蓋,自動填充文字、BGM等一系列操作,支持用戶一鍵快速成片。



          設計思考:

          在流量為王的時代,內容輸出效率就代表了一切,剪映的 “剪同款” 功能,就是讓用戶的內容輸出效率大大提高,將輸出內容的過程簡單化,無腦化,用戶無需再去想用什么創意,視頻用什么BGM,以及視頻特效如何制作,這些都由APP的模版設計師幫你搞定,用戶需要做的,就是提供出自己的素材即可。

          這給予了我們產品設計師一個啟發,在我們設計產品時,是否也能關注一下,急需內容輸出,但內容輸出困難的領域呢?也能把一些可自動化實現的步驟(如特效,BGM,字幕等等),交給系統,用戶只需參與拍攝或提供一小部分素材,即可生成一條優質的內容。解決用戶輸出內容痛點,從而留存用戶數量,從而實現用戶量變現。

          06.【剪映】上滑升起列表,讓用戶查看選擇更加直觀

          產品體驗:

          在剪映APP中,一些展示選擇列表的功能中,用戶上滑,列表都會隨之升起,讓用戶可以更直觀的查看選中其中內容,大大增加視覺傳達效率。

          讓用戶不會被窗口高度限制,更高效地瀏覽、選用列表中的元素,增加產品功能成效效率



          設計思考:

          當我們的瀏覽窗口,因UI布局高度受限時,設計師可以通過【窗口隨著滑動響應移動】的交互方式,使得界面UI交互更多變幻,更為靈活。

          07.【剪映】不同類型的模塊,分區展示

          產品體驗:

          在剪輯APP中,難免會有許多種類不同,作用各樣的模塊,但是剪輯軌道UI展示的空間有限,如果沒有分區思維,那么整個剪輯軌道將會變得雜亂不堪,用戶用久了看到各種軌道模塊,也會疲勞過載

          而剪映提供的UI解決方案也非常值得參考,將各種不同種類的效果軌道模塊,分區展示,在用戶點擊【特效】前,剪輯軌道不展示所有的【特效模塊】,在用戶點擊【特效】功能后,才展示對應的【特效模塊】軌道



          設計思考:

          在我們面對多種不同類型,但是作用相同對象的作用對象時,利用交互思維,在UI界面上進行視覺分類很重要,否則你整個APP的操作界面將會雜亂無章。

          剪映給了我們一個很好的參考,就是將不同種類的對象 【分區展示,分區管理,分區操作】,最大限度的保證交互界面的簡潔舒適,且分類也能讓用戶更好的“點對點”進行操作,節省尋找對應操作對象的時間,所以,分類思維 是目前作為交互設計師的一項必不可少的技能了。

          08.【剪映】選中特效后,自動播放(特效預覽效果)

          產品體驗:

          在剪映APP中,用戶選中特效,系統會自動播放【特效預覽效果】,且自動暫停(如特效時長3s,那么系統播放完3s特效效果后會自動暫停,不會繼續播放)

          用戶可以直接了當地查看特效與畫面融合的效果,而不用選中后,再點擊播放預覽效果,覺得效果不滿意,還得反復切換。這種交互方式,大大節省了用戶的選擇模版時間,讓其成為(選擇+預覽=選中) 的高效交互流程



          設計思考:

          在我們設計一些需要實時預覽的功能時,我們不妨參考一下剪映的(選擇+預覽=選中)的高效交互流程,讓用戶免去反復操作預覽,重復選擇的無效交互,提升用戶在工具型APP的內容輸出效率

          09.【剪映】濾鏡功能“單行瀏覽”的原因以及必要性

          產品體驗:

          當用戶在剪映中喚起濾鏡功能列表時,難免會感到驚訝,以及提出疑問:“為什么剪映要用單行瀏覽這種低效的交互方式?

          但是只要你仔細思考,并付出實踐你就會明白,剪映在濾鏡列表中,使用單行瀏覽的原因。

          因為用戶對濾鏡的選擇,是出于此濾鏡的畫面效果,所以展示濾鏡效果時,濾鏡效果圖的比例大小是否清晰顯得尤為重要,所以,剪映犧牲了一些瀏覽效率,但是大大保證了用戶對此濾鏡的瀏覽精讀。

          另外,濾鏡列表不同于特效列表,具有大量重復圖片填充。濾鏡幾乎每張填充的圖片都是有所不同的,所以使用多行列表式排列,在多種不同顏色,不同風格的圖片填充下,畫面會變得雜亂不堪



          設計思考:

          當我們遇到,填充圖片風格各異、或者注重展示畫面的列表設計時,可以參考剪映,犧牲一下瀏覽效率,保證瀏覽舒適度,精讀的設計方式,來防止我們設計的列表在視覺交互上顯得雜亂無章



          作者:堅行    來源:站酷



          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加微信ban_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~

          希望得到建議咨詢、商務合作,也請與我們聯系01063334945。 



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



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

          2022追波設計流行趨勢

          博博


          追波年度最佳作品

          追波年度最佳作品來自大家最熟悉的UI8團隊中的Tran Mau Tri Tam ?,作者來自越南西貢,最佳作品截止目前355K瀏覽量,2933個贊


          為什么看似平平無奇的作品卻能獲得追波年度最佳作品呢?既不是C端也不是純B端的作品,更像一個網頁與平面的結合體。如果去掉搜索圖標、分類圖標和按鈕,你可以理解它就是一個平面作品,一個字體加幾何形體構建的作品,為了豐富畫面的層次,讓畫面更加的活潑采用了多彩加幾何色塊,讓標題閱讀有停頓感和呼吸感。faster底部的橫線讓它從標題文字中脫穎而出,這種使用線條突出重要信息的設計也是今年追波設計流行趨勢之一。


          MetroUI是Windows8的界面設計語言,在2010年至2013年間曾經風靡一時,那也是移動互聯網的發展元年,現在國家推行實體經濟、數字化帶動To B 、To G 的發展元年,通過幾何色塊(MetroUI)實現B端產品與C端設計風格的傳承與銜接,你會發現歷史總是驚人的相似。最后背景結合今年最流行的微軟風,毛玻璃的多彩高斯模糊漸變風,年度作品當之無愧。


          最后來看下按鈕的設計,正常的按鈕要么文字加色塊,要么左圖標加右文字,它設計成左文本加右圖標,更加注重信息的可讀性和易讀性,也體現B端設計重功能和交互體驗,視覺點到為止的設計理念。


          下面我們來欣賞年度最佳作品里面的流行趨勢吧。


          易讀性(停頓感)

          字體三原則:可讀性、易識性、易讀性。當你同時讀一篇文言文和一篇設計文章,肯定設計文章的內容可讀性更好。易識性是用在字體設計上,不能過于浮夸的改變字體骨架、形體而不易識別。易讀性和每個位設計師都息息相關,因為我們都需要編排文本。當我們小時候寫作文時,不會寫的文字可以用拼音代替。這時候讀者讀到拼音時會有停頓感,更加適合用戶閱讀。


          通過給用戶制作停頓感來增加用戶的易讀性。可以在相關聯文本后面添加圖片、表情、圖標來更好的理解文本內容,豐富文本內涵。比如情侶間表達愛意時會輸入文本,“我愛你”、“我Love你”、“我ai你”、“我??你”,哪個更加會有情感共鳴呢?不言而喻,相信你心中已經有答案了。



          曲線

          在標題文字上添加曲線來突出重要文案是2021追波最流行的趨勢之一,第一個設計目的就是突顯文字,其次就是想表現鉛筆真實書寫的感覺。之前很多帶有簽名的設計中,簽字的文本都是手寫體的感覺,手寫體對比電腦的機械字體會帶有一種人文氣息,也會讓兩者之間產生一種對比、矛盾。


          除了突顯文本外,曲線還有視覺引導的作用。通過視覺引導讓用戶按照設計師編排的順序進行瀏覽界面。當然還有比這更科學的工具就是眼動儀測試,通過真實用戶眼睛瀏覽界面顯示對應的熱點圖。



          多彩高斯漸變風

          多彩高斯漸變風是從色彩的角度來傳達和豐富畫面的,多彩高斯漸變風其實是從制造矛盾到平衡矛盾的過程,多彩漸變多為冷暖對比來制造畫面的沖突,需要控制冷暖畫面的大小來實現平衡。主流的還是以暖色突顯為主。多彩漸變主要起到活躍氣氛、吸引目光、平衡畫面的作用。


          多彩高斯漸變還可以結合輕擬物、幾何圖形、三維等新的組合方式去創新,給用戶呈現一種更加新穎的視覺表現形式。最后我們還是要回歸到內容上,為了更好的傳達信息需要去設計與內容相匹配的視覺風格。




          B端界面設計


          側邊欄Sidebar

          B端設計的火爆帶動了B端相關模塊設計,更多的人也愿意嘗試B端相關模塊設計,側邊欄作為產品架構中重要的導航系統,好的側邊欄設計能為用戶帶來更好的效率。主流側邊欄都做了展開、收起、拖拽等交互效果,也是受限于PC屏幕為展示更多數據而騰空間。側邊欄主要承擔的功能有導航、分類、自定義篩選、共享、新增等。追波的B端產品設計已經不再是假大空概念設計,而是一套實用美觀可落地的設計。



          儀表盤設計

          儀表盤設計是一個很好的隱喻,想象一下開摩托車或汽車主駕駛前面的屏幕,汽車儀表有燃油表、車速表、里程表、水溫表、轉速表、故障指示燈等。B端類產品后臺界面的儀表盤設計也需要展示一些重要的數據和各種狀態,大體分為側標欄、導航欄、待辦任務、個人信息、報表數據、消息中心、快捷入口等。當然最重要的就是報表數據,團隊收益、任務進度、轉化比例、新增、存量、團隊工作時長等都是老板或領導關心的內容。每個公司業務不同、每個人員權限不同,自定義的儀表盤也各有差異。重要的是突顯數據和業務狀態,需要分層級系統性去思考和設計。



          流程設計

          復雜的事情簡單化,簡單的事情標準化,標準的事情流程化,流程的事情自動化。流程設計是每一個企業核心功能和業務,可自定義的管理流程系統搭建也是B端產品設計的難點,需要對業務高度抽象,讓每一個業務人員可自定義的流程才是好的流程設計。



          B端C化

          B端C化是B端產品設計的視覺表現力慢慢往C端產品設計的視覺靠齊,國內B端產品界面設計視覺水平還有很大的提高空間。除了視覺上的提升外,由于業務的發展,B端產品也開始移動化、智能化,國內主流還是通過小程序、H5來現實B端產品C端化



          輕代碼化

          輕代碼化是一種低代碼賦能無代碼的方式,彌補無代碼拓展性差、覆蓋場景少的問題。在保有無代碼靈活、易用、快捷的同時,又能覆蓋低代碼使用場景。簡單理解就是無需代碼開發即可如搭積木般快速、靈活地創造屬于你的個性化管理系統,輕松實現多元業務場景的數字化管理。


          輕代碼化將功能進行打包,升級成全局可以用的配置,技術人員配置好后,業務人員在應用編輯時直接選擇使用模版,綁定對應的變量即可使用。




          界面設計技巧


          人文氣息

          為什么人加色塊的組合方式能流行起來?還是B端行業流行帶動的。B端講的更多的是企業對企業。企業對企業除了講行業解決方案外,還需要傳達公司的價值觀、使命、愿景。人加色塊的組合方式非常適合體現公司的企業文化。對于一家全球化的公司不同膚色的人物組合在一起,這種人文氣息和價值觀已經就不言而喻了。


          當然企業也需要進行營銷,抓人眼球。幾千年來的遺傳證明了,人的大腦對食物、性、動的東西、人臉和眼睛、危險的動物很敏感。人加色塊的組合方式也具有抓人眼球營銷的功能。真可謂一舉兩得。


          這種風格更適合大公司,國內的一些手機廠商OPPO、VIVO等也會通過手機+背景+人物來體現科技與人文的結合,而對于中小型公司產品差異化和行業解決方案展現應該還是重中之重。



          毛玻璃效果

          毛玻璃效果加大了模糊程度,透明效果更加扁平,很好的順應當下UI扁平化的設計趨勢。蘋果Mac OS Big Sur系統的圖標、界面中運用了大量毛玻璃和半透明元素,界面更扁平。至于C4D三維彩色玻璃的視頻教程可以在B站搜索“透光藝術-C4D創建彩色玻璃的4個技法”,完全能滿足UI設計師。當然還有一個好消息就是Mac用戶可以享有OC一年免費的使用權,具體安裝購買方法可以上“某寶”就可以輕松搞定,真香。




          輕擬物

          輕擬物這幾年一直流行,在UI設計中趨于穩定的位置。從寫實到扁平再到輕擬物,其實是設計師們一路不斷探索的結果。本質就是光影對形體產生的視覺感受。在色彩中對高光、亮面、明暗交界線、暗面、反光(環境光)五個部分的處理。寫實三維的圖標等設計更適用于簡潔的畫面中,扁平等設計更適用于復雜一點的界面中,比如B端產品界面中的功能圖標。輕擬物可使用的范圍更廣,效果更佳。Sketch、Figma軟件對于漸變、高光、投影、高斯模糊處理已經非常簡單且出彩。




          簡潔設計

          簡潔設計遵從了密斯·凡德羅的“少即是多”的設計原則,在B端產品界面中更加需要簡潔設計,我們最熟悉的Sketch軟件界面已經是相當的簡潔了?;氐浆F實當需求功能不斷增加,產品界面的編排如何取舍,如何保證界面的簡潔是設計師需要深度思考的問題?如何與上級溝通?該功能是否可做可不做?是否需要埋點用數據說話?如果只是一味競品有我們就需要有,功能不斷累加只會讓界面越來越重。



          幾何圖形

          幾何圖形和幾何插畫有異曲同工之妙,幾何圖形多為產品界面和宣傳內容的抽象,產品界面的幾何圖形多為占位符形式,加上色彩和幾何色塊讓其成為一個整體。B端產品視覺設計C端化的進程中,幾何圖形、幾何色彩不失為最好的突破口,相信今年追波B端產品的視覺設計一定會更上一個臺階。



          幾何圖形另一個場景化的地方就是品牌,作為一名UI設計師一定會經歷從圖標到幾何圖形到品牌設計的過程,品牌設計的技巧基本還是以幾何圖形為主,至于品牌的內涵需要更深層次的解讀。掌握主流品牌設計的技巧對產品定位、品牌宣傳打下扎實的基礎。



          暗黑設計

          暗黑模式的設計是解決在微弱環境下內容也可以有更高的可讀性。隨著用戶夜晚及深夜使用電子設備時長增大,如何在夜晚這個特定場景下使用更加舒適。合理使用暗黑模式可以減輕眼睛疲勞,提高在夜間使用的可讀性。


          在設計暗黑主題時,不能為了突顯視覺上的逼格,而去使用高飽和度鮮艷的色彩來突顯界面的品質感。而應該把舒適度、可讀性作為設計的衡量指標。Material Design給出了暗黑主題的設計準則,即正文和背景之間的對比度應至少為15.8:1。按照此標準設計,可讀性都還不錯。這里介紹一個插件“Stark”(Figma、Sketch、XD、Chrome插件)用來測試界面的對比度。



          模塊化(組件化)

          為什么叫模塊化,而不叫組件化,組件化更多的利用原子系統從原子、分子、組織、模版、頁面來快速的搭建界面,但在B端產品設計中基礎組件和業務組件的搭建是以提高工作效率為前提,是否有從0到1搭建B端產品組件的經歷是設計師一生中最寶貴的經驗之一,它能提高設計師的系統化思維、邏輯思維和抽象思維能力


          產品模塊化設計就是將產品分成幾個部分,也就是幾個模塊,每一部分都是具有獨立功能,具有一致的連接接口和一致的輸入、輸出接口的單元,相同種類的模塊在產品族中可以重用和互換,相關模塊的排列組合就可以形成最終的產品。通過模塊的組合配置,就可以創建不同需求的產品,滿足客戶的定制需求 。




          插畫

          插畫作為設計的一大品類,不同的插畫師都有自己擅長的風格,本質是都有自己的個性,但是在產品設計中更多是需要共情、共性來講故事,表達產品理念和價值觀。這就需要插畫師去嘗試并探尋出適合互聯網產品設計類的插畫風格。設計的本質是舊元素的重新組合,插畫不會過時,而是需要結合當下和產品找到最匹配的設計風格。



          幾何插畫

          幾何插畫算是插畫簡化的一種表現形式,人和物的形態不再寫實,而是抽象成幾何圖形拼湊的感覺,同時保留人物形態的神韻。加上幾何色塊與人物交互形態的表現,傳達出簡潔、科技的現代感。難點還是在人物形態的表現上,平時多練習練習速寫還是很有必要的。



          線面插畫

          線面插畫最近一兩年非常流行,準確的說是非常適合。首先線面插畫主要是由線條和塊面組合而成,用塊面表現人物形態時某些結構會表現不出來,這時候用線條簡單勾勒后,結構就會清晰明了。其次當線面插畫運用在界面上時,可以打破界面純文字或組件化的機械和沉悶感。線面插畫的風格提升畫面熱鬧感的同時,還能保持界面的干凈整潔。




          動效


          微交互

          界面微交互動效會讓用戶的體驗更加精致到位。想要打造優秀的產品設計,微交互和動效設計是繞不開的,UI界面設計通過微交互反饋告知用戶當前正在發生的事情,所處的狀態。細微的動效更能調動用戶情緒,取悅用戶。C端產品微交互和動效已經很成熟了,一部分功勞來自iOS系統原生自帶的效果。B端產品的微交互和動效更多還是在學習海外產品,還需要給前端工程師灌輸微交互和動效的設計價值,共同打造產品體驗細節。



          Mg動畫

          Mg動畫需要很好的節奏感、韻律,每一個場景動畫都需要其中的元素進行連接變化,讓轉場動畫更加自然,MG人物動畫通過點線面的動效變化讓畫面更加有趣、自然,通過粒子效果讓特定場景無限循環會讓人更加印象深刻。




          三維


          三維圖標

          MacOS Big Sur系統圖標的更新帶動了三維圖標的流行,三維圖標的應該場景還是需要有較大留白空間的界面,因為三維圖標太小后就看不到更多細節。三維圖標感覺又回到了擬物化和扁平化哪個更好的問題上?設計師應該保持開放多元的視角。設計本身也在不斷的演化融合,存在即合理。合適最重要,它們都會有適合自己的場景和設計價值。



          輕三維

          為什么輕三維在界面設計中占有一席之位?一個是設計師不斷追求差異化的產物。另一個是更好的表現內容,并與用戶產生共鳴。輕三維的基礎模型都是來自手機界面中的各種元素,比如組件、開關、按鈕、占位符、圖表、幾何圖形、圖標、進度條等,這些都是用戶日常使用系統軟件常見的元素,通過簡單的幾何形體建?!驘艄狻硬馁|—渲染—PS調色。難度系數不大但效果很出彩。第一個出彩點是模型帶有厚度的倒角,結合燈光渲染的光澤是二維軟件不能比擬的。第二個出彩點就是材質自由添加,特別是當下流行的毛玻璃效果,玻璃材質渲染效果更佳。第三個出彩點就是可以加局部燈光,局部的漸變色或環境光更佳出彩



          P4D(PS+C4D)

          P4D是PS加C4D的設計表現技法,也是視覺設計的最后一個環節,通過PS對C4D的渲染圖片進行調色,利用PS的調色技巧可以很好的解決C4D打燈光的瑕疵,還可以利用PS強大的合成功能,將渲染圖片與圖片素材進行合成,來表現畫面的視覺度,當然三維軟件比較難實現的水、粒子、煙花等效果,也可以通過PS的后期合成來實現,這也是P4D的強大之處。



          卡通IP

          卡通IP設計最近三四年技術的迭代已經慢慢的走上成熟,卡通IP也從傳統的純PS手繪技法,轉到C4D建?!巧壎ā狹D衣服制作—OC渲染—PS(靜態)/AE(動態)調色。


          卡通IP火的本質更適合做營銷,相比于品牌或Slogan,卡通IP具有親和力和畫面感。隨著各種手辦行業大熱,受互聯網大廠影響下,卡通IP已經是互聯網B輪以上公司的標配了。如果團隊中沒有這樣能力的人,也可以通過繪制好二維,一套三維可以選擇外包完成。


          對于UI設計師來說學習是有成本的,暫時并不是必備技能,如果喜歡完全可以學習,從設計差異化的角度來看三維視覺確實有一定的競爭力。



          三維動畫

          C4D三維場景動畫通過構建實物和場景模擬生活中的現實場景,會讓用戶體驗真實感,三維軟件制作動效的最大優勢是通過動力學和表達式來模擬真實感,未來在AR/VR領域會有更好的發展。相對于界面動效學習成本難度也相對較大。在三維動畫中C4D軟件對于域、動力學還是有一定的優勢。

          作者:水手哥。    來源:站酷

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

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

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

          高級設計師才會的設計思維,31個細節幫你深入了解!

          博博

          設計科學才是對人類的恰當之研究,它不僅是技術教育的專業組成部分,也是每位經受文科教育之人的核心學科?!薄?赫伯特·西蒙

          1. 并不存在單一的設計過程

          設計過程被描述為多個階段,每個階段都包含不同的活動來完成該階段,它沒有統一的標準流程,每個公司和設計師都有自己的流程版本。

          盡管存在多個流程,但一般流程和階段類似于以下內容:

          了解問題:初步了解問題。觀察、采訪和傾聽用戶。

          定義問題:解釋和定義要解決的問題。

          構思:通過頭腦風暴產生盡可能多的想法。

          原型設計:構建原型并與其他人分享( 再次縮小解決方案空間,為實驗階段 )。

          測試:測試可能的解決方案、實施、改進或重新設計。

          2. 設計思維是傳統解法和創造性設計過程的結合

          傳統的問題解決采取有條不紊而又科學的形式。該過程從一個問題開始,定義要采取的步驟以及達到解決方案的工具或方法。

          設計思維是一種創造性的策略,可以產生創造性的未來結果和/或創造性的問題解決方式,它應該被認為是一種以解決方案為中心的思維策略。

          它通常被描述為一種創造性、主觀和感性的對許多大型組織的分析邏輯( 布朗,2008 年 ),或作為分析和創造性推理模式的組合( 鄧恩 & 馬丁,2006 年;利特卡,2015 年 )。

          3. 設計思維是問題解法的進階

          設計思維來源于常規問題解決方法,常規問題解法是設計思維的基礎。

          從解決問題到設計思維,Liedtka (2013)

          結果發現,設計思維實際上也是一個解決問題的過程,而不僅僅是一個創新過程( 利特卡,2013)

          一個例子是,豐田采用設計思維從頭開始分析其西海岸的一個客戶聯絡中心,在重新設計過程中,組建了一個由一線呼叫代表、軟件工程師、業務主管和變革代理組成的跨職能團隊,這一舉動最終改變了客戶和員工的服務中心體驗。

          4. 從起床到入睡,你都在解決問題

          我們每天都會遇到問題,但是當我們解決同樣的問題時,它們就成了例行公事( 似乎已經忘記它們是問題了 ),我們甚至都沒有意識到正在解決這些問題。例如,我的辦公室在 30 分鐘路程之外,該怎么到達那里?開車、坐火車或巴士到目的地;除非車子輪胎被刺破,否則你就需要弄清楚如何到達辦公室。

          5. “設計思維”術語的產生

          1990 年代,IDEO 的 David Kelley 和 Tim Brown 與 Roger Martin 共同創造了特定術語:“設計思維”,并將多年來醞釀的方法和想法封裝成一個統一的概念。

          6. 工程設計思維現在被稱為設計思維

          設計思維是以人為中心、開放式、基于問題的方法論。這種方法最初是為了改變工程教育中的教學方式,而工程師處理和解決問題的方式有其設計思維的基礎。

          7. 設計思維的歷史早已出現(2000 年)

          設計思維一詞可以追溯到 1987 年 Peter Rowe 的著作:“設計思維。” 他描述工程師和建筑師處理問題的方法有很大不同。

          90 年代初,認知科學家 Don Norman 加入 Apple 團隊,擔任他們的用戶體驗架構師,這使他成為第一個在職位中包含 UX 的人。他提出了“用戶體驗設計”這個術語,因為他想“涵蓋人們對系統體驗的所有方面,包括工業設計、圖形、界面、物理交互和手冊?!?從那時起,這些領域中的每一個都將用戶體驗,擴展到了自己的專業領域。

          8. “棘手的”設計思維

          設計思維在解決“棘手問題”時特別有用。

          棘手問題的特征

          “棘手問題”一詞是由設計理論家 Horst Rittel 在 1972 年創造的,用來描述本質上非常模糊 \ 特別棘手的問題。棘手問題,有很多未知因素,沒有確定的解決方案。問題或解決方案可能與另一個棘手的問題有關,因此這是一個需要設計思維的持續過程。貧困、饑餓和氣候變化是一些現代的棘手問題。

          9. 設計思維不僅限于數字化設計的應用

          設計主題的范圍是普遍的,因為 設計思維可以應用于人類經驗的任何領域。

          它可以用于:

          符號和視覺傳達:這包括平面設計的傳統工作,如排版和廣告、書籍和雜志制作、科學插圖、攝影、電影、電視和計算機顯示。

          材料:這包括對日常用品的形式和視覺外觀的傳統關注 —— 服裝、家用物品、工具、儀器、機械和車輛。

          人類活動和組織性服務:包括對物流的傳統管理關注,結合物質資源、工具和人類低效的序列和時間表,以達到特定的目標。

          復雜的系統或環境:生活、工作、娛樂和學習。這包括系統工程、建筑和城市規劃的傳統關注點,或復雜整體部分的功能分析及其隨后在層次結構中的集成。

          10. 設計思維不僅限于設計師的實踐

          設計思維起源于設計師的培訓和專業實踐,但這些原則可以被每個人實踐并擴展到每個活動領域。(布朗,2013 年)

          在企業中,設計過程可以為企業環境中的問題解決帶來創新思維。它還可以用于醫療保健,通過向護士、醫生和管理人員教授設計思維技術,我們可以激勵相關從業者貢獻新的想法。

          11. 了解問題是第一

          不管是什么設計,理解和研究問題是必不可少的,因為我們能夠從其出發,從而進行以用戶為中心的設計。

          設計思維的最早階段是搞懂你能帶來的情感價值。設計思維方法迫使你停留在提問與質疑階段,而不是準確定義出問題后進入下一階段。我們都有過快進入解決方案模式的傾向,所以設計思維方法迫使你真實地存在于這個不清楚、有時還非?;靵y的時刻,從而使你對要解決的問題產生更好的理解。(利特克,2013)

          12. 設計思維需要兩種不同的思維

          傳統的問題解決涉及提出一個解決方案,但設計思維首先使我們發散,試圖為問題生成各種可能的替代解決方案。然后讓我們進行收斂性思維,縮小多種可能性,找到單一的最佳解決方案。

          13. 設計思維是可以傳授和學習的,它不是一種人格特質

          根據利特卡和奧美 (2011) 的說法,設計思維的全部意義在于學習一種新的、系統的解決問題的方法。正如我們思考創造力一樣,即使是設計思維也可以通過實踐來教授和改進。

          14. 設計過程不是線性的

          設計過程從來都不是線性的,它由多次失敗和迭代組成(布朗,2018)。

          首先,設計師試圖將問題與過去的類似案例聯系起來。如果這種方法不能提供任何解決方案,下一步就是使用知識和創造力作為一種實驗思維形式來產生新的想法。使用決策矩陣對這些想法進行評估,從而會產生被進一步分析和測試的解決方案。如果成功,它將被實施。如果不成功,則需要重新表述問題,并重復該過程。這是一個迭代過程,即循環方法。

          這一持續不斷的重新再設計過程,源于和客戶親密接觸的洞察。

          15. 調研是設計思維非常重要的工具

          學習設計思維不僅僅意味著學習一套新的工具。它還意味著:學習收集和分析大量數據;學習挖掘對象可能的形態而不是自主認為他是什么;學習管理不確定感,以及與許多新的伙伴合作( 利特卡和奧美,2011)。你可以進行的研究類型分為三類:生成性研究、評估性研究和驗證性研究。

          16. “要么很快失敗,要么經常失敗”

          一種常見的表述 —— 實際上是設計思維的另一種視角 —— 即設計師應該預料到會“很快失敗或經常失敗”(布朗,2009)。

          當過程早期發生故障時,例如被拒絕的原型,實質上它可以為有效解決方案提供關鍵見解。這種觀點與傳統的先形成理論,再檢驗正誤的方式相矛盾。

          17. 公司正在將設計思維作為解決問題的核心方法

          Airbnb、Braun 和百事可樂等多元化公司都在 采用設計思維并將其作為核心戰略。例如,IBM 為全球旗下的 44 個設計工作室聘請了 1600 名設計師,并且正在培訓數以萬計的設計師員工建立深度創新能力 ( O'Keefe, 2017 )

          18. 以人為本的思維

          設計思維為我們解決問題添加了以人為本的元素。當我們試圖通過牢記人們的想法來解決問題,并使用基于直接觀察乃至訪談的研究時,我們便會捕捉到與消費者需求一致的意外見解和創新。

          19. 可觀的商業價值

          它有助于將成功的產品更快地推向市場,最終節省企業資金。
          IBM 的健康和人類服務組織的設計思維實踐,通過有效使用設計和設計思維幫助企業將缺陷數量減少了 50% 以上。這種更高效的工作流程導致計算出的 ROI 超過 300%。

          20. 對復雜問題的作用性

          由于復雜的問題從來不能被所有人完全理解,因此在嘗試設計解決方案時,處理歧義和多個并發的思路方向的能力是至關重要的素質。

          設計思維通過綜合和歸納思維,幫助實現質的飛躍。它允許通過解構來測試約束,并允許通過多樣性思維和批評思維,來擁抱和探索歧義。

          消費者通常不知道他們有什么問題需要解決,或者他們無法用語言表達出來。只有經過仔細觀察,設計者才能根據真實消費者行為中看到的東西來識別問題,而不是簡單地根據對消費者的想法來確定問題。這有助于定義模棱兩可的問題,并找到解決方案。

          21. 別名:跳脫框架的思維

          該方法鼓勵“跳出框架思考”(“瘋狂的想法”);它蔑視顯而易見的事物并采用更具實驗性的方法。
          在早期的流程階段鼓勵大膽的想法,以產生創造性的解決方案。使用它是為了讓設計師可以嘗試開發新的不受約束的思維方式,或對常見問題的創新解覺方法。

          22. 設計思想家的特征

          根據大多數設計學院的說法,具備特定特質的人能夠更好地發揮設計思維的作用。

          同理心:從多個角度想象世界 —— 同事、甲方客戶、實際使用者和消費者的角度。要成為更好的同理心,必須傾聽和觀察他人的行為,注意并獲得洞察力。

          綜合思維:重要的是不僅要有分析能力,而且要能夠提出新穎的解決方案,還要憑直覺。

          樂觀:除非你相信有解決方案,否則在遇到挑戰且解決方案遇到瓶頸時,你可能會放棄。

          實驗主義:重大創新并非來自漸進式調整。設計思想家以創造性的方式提出問題并探索限制因素,并朝著全新的方向發展。

          協作:產品、服務和體驗日益復雜,因此必須擁有一支具有不同背景的團隊,以幫助從多個角度看待問題。

          23. 有助于對抗某些偏見

          當我們想到一個問題的多種解決方案時,對我們解決問題會非常有幫助,因此“功能固定性”阻止了我們以新穎的方式使用舊工具解決新問題。想要擺脫功能固定,首先是要讓人們可以使用“改造后的衣架進入上鎖的汽車”。這也是盜賊第一次可以用信用卡撬開簡單的彈簧門鎖。

          24. 實用

          為了幫助設計師利用文科和技術理論,整合多個領域的知識以找到創新的解決方案,我們采用設計思維來獲得洞察力。該方法側重于可視化和操作,因而幫助我們更容易地了解實際解法,而不僅僅是理論模型。

          25. 執行

          第一批美國公司在 2000 年代初期開始實施設計思維,這一概念引起了德國投資者 Hasso Plattner 的興趣,他于 2006 年資助創建了兩所設計學校(d.schools),其中一所位于波茨坦大學(德國),另一所位于美國斯坦福大學。由于兩所學校都成功地為大型組織提供了高管設計思維培訓,因此該研究重點關注這些國家,以尋找早期實施者。

          26. 團隊思考

          設計思維通常涉及希望參與整個設計和開發過程的龐大利益相關者團隊。

          觀點、才能和經驗的多樣性被認為是注入新思維的部分重要來源。多樣性確保通過融合不同的觀點、技能和知識來產生創意(卡振思,2018 年;薩梅和德拉赫-扎哈維,2013 年)。設計思維的協作方法和工具可幫助團隊以積極的方式利用他們的差異。

          決策是平等的,因為每個成員的意見都被征求和使用(卡爾格倫等,2016)。

          27. 不需要花哨的技術原型

          當 IDEO 去 Apple 展示他們的鼠標時,它不是什么花哨的設備,而是一個用膠帶粘起來的原型。

          低保真原型制作起來既快速又便宜( 想想幾分鐘和幾分錢 ),但可以從用戶和同事那里得到有用的反饋,這符合快速驗證、廉價試錯的原則。為每個想法投入盡可能少的資源意味著前期投入的時間和金錢更少。此外,將多個原型帶到現場進行測試為用戶提供了比較的基礎參考,同時也有助于揭示某些需求。

          28. 過程強調心態和行動

          為了創新,設計思維意識到認知和行動對創新過程很重要。認知包括接受度、樂觀和創造性的信心( 凱莉 & 凱莉,2013;鄭,2018),而行動包括快速原型設計、旅程地圖和假設浮現( 假設浮現:assumption surfacing,這是一種評估技術,涉及寫出潛在的假設和反假設。)( 卡爾格倫等,2016;利特卡,2015)

          29. 在組織中實施設計思維的挑戰

          如果領導層不歡迎風險、模棱兩可和風格的改變,實施起來就會變得更加困難。它會被管理者“質疑”其具體指標

          沃爾特斯 ( 2011 ) 聲稱,由于設計思維的模糊性,它與組織文化相沖突。

          據受訪者稱,在日常業務中使用設計思維之所以不會是最優選項, 因為它是資源密集型的,增加了工作量。( 麗莎等,2016)

          在醫療保健等規避風險的行業和公司中,“經常和早點失敗”的方法被認為是非常困難的。

          30. 設計思維的問題

          許多設計師反對設計思維這一觀點,設計思維不僅關乎一個過程,而且關乎改變思維過程并提高人們可能提出的解決方案的創造力。

          “設計思維”的推廣已被大型全球公司用來增加業務。不過,在更廣泛的設計世界中,我甚至會說“設計思維”的過度宣傳導致了所提供設計質量的下降?!?Yasushi Kusume

          弗吉尼亞理工大學科學、技術和社會助理教授 Lee Vinsel 在《設計思維運動是荒謬的》中寫道,“歸根結底,設計思維與設計無關。這與文科無關。這與任何有意義的創新無關。如果這意味著重大的社會變革,那肯定不是關于“社會創新”。這是關于商業化的?!?

          31. 為什么需要共情

          觀察人們的行為以及他們如何與環境互動,可以為你提供有關人們想法和感受的線索。

          你可能認為你知道問題所在,但只有通過觀察才能了解消費者真正需要什么。

          宜家派設計師到人們家中,觀測他們的互動行為來了解他們的需求。這將使設計者能夠推斷這些經歷的無形含義,以發現洞察。這些洞察提供創新解決方案的構思方向。而事實上,最好的解決方案來自于對人類行為的最佳洞察。

          Good Kitchen 是一家為老年人和體弱者提供膳食的社會服務機構。起初的問題似乎是設計不當的膳食菜單。然后設計思維揭示了無數問題,所有問題都源于服務本身的性質。因此,經由對服務進行了徹底改革的之后,最終提高了客戶和員工的滿意度(利特卡,2014)



          作者:用盡晴天來源:站酷



          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加微信ban_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~

          希望得到建議咨詢、商務合作,也請與我們聯系01063334945。 



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



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

          一篇文章搞懂如何做好對話框設計

          博博

          對話框是一種重要的交互方式,主要用于完成信息傳遞。對話框很常見,但并不見得每一個設計師都可以百分百地弄明白對話框這個概念

          對話框是一種重要的交互方式,主要用于完成信息傳遞。對話框很常見,但并不見得每一個設計師都可以百分百地弄明白對話框這個概念。這篇文章是對「對話框」的一個簡單梳理和總結,希望可以解決大家心中的一些疑惑。

          01

          了解對話框

          1、對話框定義

          對話框是疊加在應用主窗口上的彈出式的窗口。對話框以對話的方式讓用戶參與進來,在對話中它給出消息或要求輸入。

          當用戶完成消息的閱讀或者作出選擇后,可以取消或者接受該對話框,之后,這個對話框便消失了,把應用的主窗口交還給用戶。

          關于對話框的概念,以下是百度百科的解釋:

          對話框越來越廣泛地被應用于軟件、網頁、以及移動設備中。它可以保留用戶當前進程的情況下,指引用戶完成一個特定的操作 。


          2、對話框分類


          按照對話框的交互方式,可將其分為「模態[1]對話框」和「非模態對話框」。我們可以把他們看作是兩個小家族,模態家族的人比較強硬,而非模態家族的人相對溫柔一點。兩個家族的主要區別:是否強制用戶對其進行回應。

          模態對話框:是位于瀏覽器的主頁面核心區域,需要用戶對它做出相應交互,模態才會消失。而對話框會因為自身的吸引程度、停留時間、信息量承載多少被劃分為多種對話框類型進行區分,常見的對話框分別為:普通對話框、內嵌表單對話框、分步表單對話框、文件選擇對話框、復雜信息展示對話框。

          △ 何時使用模態對話框

          1)在重要的警告時使用,避免出現嚴重問題、或修正已出現的問題。

          例如:用戶錄入信息后未保存就要關閉時,彈出模態對話框提示用戶保存。

          2)在需要用戶輸入信息或進行某操作,才能繼續當前流程的時候使用。

          例如:在使用Canva資源網站時,點擊“上傳”會彈出模態化的登錄/注冊窗口,引導登錄/注冊后使用。

          3)用來將復雜流程拆分成簡單步驟。

          例如:Teambition-分步驟的模態對話框式創建項目。

          4)用來獲取信息,該信息可大大減輕用戶的后續操作/精力。

          例如:在轉賬場景中,如果先復制一個賬號,打開手機銀行APP(以招商銀行或平安口袋銀行為例),系統會通過模式對話框詢問用戶是否向這個賬號轉賬,這樣的設計做到了預判用戶行為,節省用戶后面的操作成本。

          非模態對話框:與模態完全相反,它更加溫和,不會強制打斷用戶正在進行的現有流程,對用戶的干擾比較小。通常這類對話框只會在屏幕上短暫停留,幾秒就會消失,也因此用戶容易忽略它們的存在。因此非模態對話框不適合展示重要信息、不能承載大量文案,常見的類型有:通知提醒、全局提示、警告提示、氣泡卡片、文字提示。

          △ 何時使用非模態對話框

          1)在獲取與當前流程不必要信息的時候使用。

          例如:平安口袋銀行和平安數字口袋采用氣泡卡片展示更多功能或引導用戶登錄。

          2)不打斷重要流程中使用。

          例如:在平安口袋銀行APP中購買理財時,如果遇到疑問的話,不會彈出框提示讓客戶咨詢投顧,而且采用氣泡框形式提示,不打斷用戶購買。

          簡單來說,兩者的優缺點見下表:

          02

          對話框常見應用場景

          從前面講到的定義來看,對話框最主要的目的是:傳遞信息。那么從目標導向的角度來看對話框,對話框要傳遞的信息的常見應用場景主要有以下五種:


          1、屬性對話框


          屬性對話框是向用戶呈現或讓用戶改變所選對象的屬性或者設置。一般來說,在屬性對話框中,用戶可以修改當前的選擇,也可以設置應用程序的全局屬性。該對話框適用于非頻繁操作和或僅需要設置一次的屬性,屬性對話框常見在一些設置、詳情中。

          例如:Windows 11系統的設置界面,可設置系統的全局屬性。


          2、功能對話框


          功能對話框通常從菜單中打開,是最常見的模態對話框,只控制單一功能,如打印、文件上傳/導入、插入對象或拼寫檢查。該對話框不僅允許用戶啟動一個動作,而且也允許用戶設置動作的細節,屬于模態對話框。

          例如:瀏覽器的打印功能,會彈出模態化的打印窗口,用戶可設置打印的細節。

          例如:飛書的文檔導入功能,使用模態化對話框,引導用戶選擇文件類型或進行批量導入操作。


          3、進度對話框


          進度對話框是由應用程序啟動的,而不是由用戶請求而啟動的。它們向用戶表明當前應用正在忙于某些內部功能,其他功能的處理能力可能會降低。

          每個進度對話框都應該向用戶清晰地展現如下信息:

          • 一個耗時的進程正在進行
          • 現在一切正常
          • 該進行還有多長時間才能完成
          • 還有多少事情或項目沒有做完
          • 用戶如何才能取消該操作,或重獲控制權

          例如:使用Axure軟件導出html文件時的進度提示,既提醒用戶當前Axure正在運行,又告知用戶當前文件導出進度。

          例如:使用Sketch軟件導出文件時的進度提示


          4、通知對話框


          通知對話框將一些重要信息報告給用戶。來源可以是一些觸發的事件,也可以是其他用戶的通知。

          常見的有通知中心對話框,處理完成某個操作的告知等等。

          例如:花瓣的通知提醒

          例如:脈脈的隱私政策閱讀提示和汽車之家的開啟通知提示,均采用模態對話框方式。


          5、公告對話框


          公告對話框,和進度對話框一樣,由應用程序直接啟動,不是由用戶請求發起的。公告對話框有三種:錯誤、警告、確認。

          這種對話框通常不會要求用戶填寫什么,只會詢問你“真的要進行嗎?”或者告訴你一件事情。所以在這種對話框上,一般只會有只有[取消]和[確認],或者[OK]。

          屬性、功能、進度對話框,是用戶主動請求的--它們為用戶服務。但是,應用程序發起的公告對話框--它們為應用程序服務,常常會犧牲用戶利益。由于公告對話框比較常見且常常犧牲用戶利益,那么我們怎么把這些討厭且無用的公告對話框直接鏟除掉,換成更加友好、能給用戶帶來真正幫助的交互方式呢?接下來我們來一起看看怎么讓公告對話框“名聲鵲起”。

          03

          怎么讓公告對話框“名聲鵲起”

          我們可以從應用本身和對話框本身著手提供友好的交互方式,減少公告對話框的出現頻率。

          1、應用方面


          解決用戶錯誤的方法不是指責用戶,讓用戶再認真一些,或者給他們更多的指導練習,而應該優化應用設計,讓犯錯變得困難。

          讓應用變“聰明”,減少用戶犯錯


          • 使用有界控件。比如驗證碼輸入框、數字鍵盤等

          示例:登錄藍湖時的短信驗證碼輸入框

          示例:轉賬時輸入金額的數字鍵盤,金額大小的位數提示;平安口袋銀行的身份證號專屬鍵盤。


          • 提高可見性,用戶可自主糾錯

          示例:輸錯密碼是一個很難避免的錯誤場景,語雀密碼登錄支持可見密碼,一來是考慮安全問題,二來在用戶輸錯的場景下可以打開眼睛,即可見密碼,減少出現錯誤頻率。


          • 具備預判思維,在容易出錯的地方提供更方便的功能

          示例:在支付寶聊天窗輸入一串數字,支付寶發現這個問題后,提供了識別后直接轉賬的功能,預判了用戶的慣性,減少錯誤發生。

          Zoom - 拉會前預設值在加入會議室的界面,提前選擇是否在進入會議房間后“不自動連接語音”和“保持攝像頭關閉”,有效避免忘記閉麥或者忘記關攝像頭就直接加入了線上會議的意外尷尬。


          讓操作可“復原”,提供撤銷功能。


          在很多破壞性的操作都會二次進行提醒,讓用戶確認操作,比如說刪除操作。在刪除之前都會詢問用戶“你真的要刪除嗎?”想一想……你在看到這些提示的時候,是不是眼疾手快地按下那個「確認」按鈕?

          這種對話框在沒有容錯處理時,非常容易被我們這種無腦按「確認」的用戶釀成大錯。比如我“手賤”只是試試這個刪除,然后就把某個表幾千條辛苦寫了一個月的數據刪掉了,由此可見系統的容錯處理有多么重要。

          示例:Windows系統在早期的時候,刪除文件時會讓用戶進行二次確認,但這是完全沒必要的,因為刪除文件不是真正的刪除,還會在回收站里面。

          Mac系統:在回收站刪除文件將是永久性刪除,此時的確認對話框才是對用戶有用的。


          2、對話框設計方面


          從對話框本身的設計優化出發,我們可以對話框的使用場景和文案方面著手進行優化設計。

          對話框使用場景


          其實什么時候使用對話框、是否使用取決于你要給用戶展示的信息是否重要。

          例如你在手機上買了一張電影票,支付失敗的結果如果用toast展示就會容易被用戶忽視。那么等到用戶到了電影院才發現自己購買失敗,那么用戶極有可能當場卸載你的產品。

          模態彈框會打斷用戶當前操作流程,所以「使用對話框要克制」??傇瓌t是:能在界面展示就不用彈框,能用非模態彈框的就不要用模態彈框??傊?,重要的信息優先考慮使用對話框。

          具體的使用原則有:

          • 彈框使用盡量克制。
          • 文字需要精簡,使用行為召喚動詞。
          • 注意區分復雜任務和輕量任務,選擇對應的彈框類型。
          • 反饋要及時。
          • 可使用引導幫助選擇。


          清晰且友好的文案


          如果非要使用對話框,那么請使用友好尊重用戶的方式。當我們說到人與人之間的交流時,語言是重要的媒介,而用戶與產品之間同樣如此。

          在設計過程中應始終努力設計出有效的提示性文案,但是, 一定是有比沒有要好嗎?個人認為也是不必要的,糟糕的提示性文案甚至會破壞產品中最好的用戶體驗。例如以下幾種情況:

          • 含糊不清
          • 過于啰嗦
          • 無意義,產生誤導
          • 無同理心

          因此糟糕的提示文案設計會誤導用戶在產品中采取不必要的操作, 從而使他們感到生氣和困惑,甚至可能會破壞品牌對用戶的忠誠度,產生本末倒置的結果, 也給用戶帶來不佳體驗。

          所以,語言是使產品更加人性化的主要因素。產品的文案則充當了語言的角色,它可以使用戶參與其中,影響他們的情緒,并把這種人機的功能性關系轉化成人類的個人情感體驗。而這種用戶的情感體驗才能夠真正的彰顯品牌個性,從而與其他產品區分開來。

          △ 錯誤提示設計三步法

          • 盡可能準確地描述問題和哪里出錯了,簡明易懂。
          • 提出建設性意見,解決問題,保持流程前進不中斷。如果此時問題還不能解決,告訴用戶可以做些什么來幫助他們,以及他們可以向誰求助。
          • 不要責怪他們,禮貌的對待用戶,在報錯中加入情感。

          總結:

          對話框可以成為幫助用戶完成目標的有用助手,而不是讓他們在每一步操守挫敗的可怕絆腳石。通過保持對話框的可管理性,并且只有在他們的功能真的屬于另一個房間的情況下才調用他們,你將很好地維持用戶的工作流狀態,保證他們會成功完成任務,并且滿懷感激。


          作者:DESIGN阿志來源:站酷

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

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

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

          多元好玩的科技廟會-好運中國年“新”體驗

          博博

          本文主要闡述我們是怎樣通過創新來打造一款具有科技感知多元玩法的百度好運中國年活動。


          前言

          每當臨近春節時,互聯網大廠的新年福利活動都會相擁而至,大家在各種活動中紅包拿到手軟。此時,百度APP的「好運中國年」系列活動也如期與大家見面,毫不吝嗇的把“好運”傳遞給每個用戶。

          2019年至今,「好運中國年」已進行了五年,每年都會在品牌和玩法體驗上進行探索與創新,今年進行了更深入的打磨,給用戶一種“新”體驗。在設計理念上,通過具有科技感和年俗氣息的視覺創新,打造一場百度獨有的“科技廟會”;活動玩法方面,較以往也更加豐富,包括了百度經典集卡玩法和多種紅包玩法,給用戶多元有趣的活動體驗。今年春節的活動周期比往年更長,近一個月的好運中國年讓用戶樂此不疲。



          打造好玩好逛的科技廟會

          活動初期,我們從產品、用戶、社會三個角度進行分析,確定活動的設計目標。

          百度APP是百度在移動搜索方向的核心產品,代表了百度先進的搜索技術能力,具備很強的科技屬性。今年團隊設計的重點目標就是將活動與產品屬性相結合,因此今年開始嘗試打造「科技感」春節活動;好的活動體驗可以加深用戶對活動的記憶,為了讓用戶對「好運中國年」印象深刻,我們結合多種玩法營造科技廟會的氛圍;而這么多的活動需要一個“集合體”來承載,“它”既要多元又要契合團隊探索的有社會價值的年俗工藝,因此選用了“廟會”這個形式來承載。

          經過分析,最終確定以好玩好逛的“科技廟會”作為本次活動的設計理念,給用戶“新”的體驗感受。



          來場對“科技廟會”的探索

          “科技廟會”是什么樣子呢?通過將詞拆解的方法,以“科技”和“廟會”為關鍵詞進行思維發散,想象以什么樣的視覺來呈現今年的春節活動。



          探索過程中嘗試AI繪畫,用新的科技手段輔助尋找靈感。



          定調

          經探索,廟會的圖像特征越來越清晰,它是一場熱鬧的具有多元文化載體的文化現象,擁有像舞獅/臺戲/商鋪/古樓/燈籠/風竹等事物,是民間藝術的結合體,描繪了老百姓新年期間的市井生活。



          「科技感」則是一種視覺感知,既可以通過點、線、抽象圖形進行感受,是粒子、發光體、光環、全息;又可以通過機器人、移動設備、全息屏幕等具象物體體現,是圖形元素間的動態穿插或是一種變化發展的趨勢。



          我們將射線、光環、粒子、全息圖像、速度感圖形等元素植入具有人文特征的廟會中,切入“科技廟會”主題風格,進而確定視覺調性。

          最終通過KV將探索的“科技廟會”視覺調性展示出來。打造出的視覺情緒是新奇熱鬧的,整體營造一場充滿科技氛圍的春節集市。以兔子形象IP為故事主體,講述一個“兔年春節逛科技廟會”的世界觀。通過“兔子舞獅”、“古鎮建筑”、“商品小攤”等元素來體現廟會,道路上的全息路標、遠處向上延伸的科技立光、城市建筑上的懸浮光圈來增加科技感。



          定義“科技特色”的品牌體系

          從確定設計理念開始,今年「好運中國年」的品牌設計就被貼上了“不一樣”的標簽。有別于往年的關鍵點是,需要在字體、圖形和IP上充分體現今年“不一樣”的“科技感”。

          品牌字體

          首先把“科技感”植入品牌字體中,形成獨特的字體風格?!翱萍肌斌w現的是一種發展與進步、速度與前進,代表了“硬”實力,我們把這種氣質體現在今年的品牌字體中。與去年較圓潤的字體相比,今年的字體更為硬朗,在此基礎上字的斜度統一為12度,起落筆則用“尖角”延伸,整套字體現出科技創新帶來的活力激發。



          品牌圖形

          輔助圖形是品牌的重要記憶點之一,能夠強化品牌特征,提升用戶對品牌的認知。今年的輔助圖形保留了去年的基礎形,不一樣的是增加了「科技感」特色的圖形元素,結合點、線、以及方格符號元素,進一步烘托科技氛圍,在延續去年視覺感受的基礎上增添了新的概念。



          UI組件也注入科技感,在紅包、btn、輔助入口等組件中增加科技感點線元素的點綴,信息載體使用半透明效果的異形面板,指引箭頭則運用馬賽克表現形式。將這些UI組件進行復用,科技氣質貫穿到各活動中,確保在不同玩法上呈現統一的視覺感受。



          品牌IP

          今年的活動IP形象更具親和力和辨識度。在兔子形象的設定過程中我們嘗試多種頭身比例,最終選用的比例為2:1,大頭形象在面部特征和表情上能夠體現更多細節,使整體更具親和力,同時也可以讓科技感的全息眼鏡顯得更為突出。IP貫穿活動始末,起到統一活動主題調性、強化引導,增加新年氛圍和親和力的作用。



          舊瓶裝新酒:經典重塑,打造多元好玩的集卡活動

          集卡是百度歷年春節的經典玩法,是用戶最喜愛的玩法之一,也是「好運中國年」系列活動中在線時間最長的活動,無論在視覺還是玩法上都要更加豐富多元。

          [一] 玩法升級,傳承創新

          過去兩年中,活動采用雙層卡玩法,集齊「好」「運」「中」「國」「年」基礎卡后合成高級卡,集齊高級卡后獎勵會翻倍。然而通過洞察研究發現,用戶在高級卡階段容易失去熱情、感到無聊,由此發現高級卡階段的活動體驗仍有改善空間,因此嘗試在今年進行了“新”的玩法體驗創新。

          今年團隊在傳統集卡玩法上探索變化,傳承經典的同時,提出“新”的集卡闖關玩法。用戶集齊「好」「運」「中」「國」「年」基礎卡后,開啟新的階段,合成高級卡獲得新春祝福語圖鑒,通關全套祝福語圖鑒獲得終極獎勵,同時整體降低集卡難度,讓用戶更容易玩下去。



          [二] 傳統工藝,氛圍拉滿

          “新酒”還體現在工藝的多樣上,與去年單一的年畫工藝相比,今年的集卡高級卡場景中展示了四種工藝,汲取了廟會中出現的民俗文化和民間藝術品-剪紙、燈籠、爆竹、團扇。通過科技感的全息影像將每個場景串聯,打造了一種科技廟會的感知。四個場景從家到國,層層遞進,各場景結構源于品牌logo的熊掌元素,向用戶傳遞著年俗文化、透傳品牌,宣揚科技興國的理念。



          燈籠

          說到春節,家家戶戶都會準備各式各樣的燈籠來期盼闔家團圓。

          因此活動中選擇燈籠做為構建高級卡場景一的主元素,同時也是文字的主承載物,每個燈籠呈現不同的造型,「團」字的兔子造型和場景中的兔子IP,來呼應兔年生肖。通過地臺上的廟會建筑和糖葫蘆等元素的結合營造出廟會年俗氛圍。

          卡片則采用了較高挑的燈籠輪廓做為基礎造型,強化卡片屬性,也能夠更好的承載文字和品牌的透傳。



          剪紙

          剪紙藝術作為高級卡第二個場景的視覺呈現,帶領用戶感受其豐富內涵,感受設計對民俗生活的理解、對生活之美的追求。

          場景中高級卡下端增加了以全息影像方式展現的廟會場景,同樣營造出科技廟會的氛圍。



          爆竹

          隨著春節的腳步越來越近,人們最期待的便是新年的第一聲爆竹,中國的爆竹文化,蘊含著華夏兒女的精神寄寓,表達著所有民族的共同期盼。近年來,隨著大眾環保意識的加強,爆竹聲已離我們逐漸遠去。因此,“爆竹”元素做為第三關高級卡的主元素,目的是為用戶營造久違的爆竹帶春聲,配合一席冬雪,向用戶描繪大自然對大地和人類的厚愛。



          團扇

          團扇是中國傳統工藝品及藝術品,有著深厚的文化底蘊。同樣寓意著吉祥如意。結合卡面文字,第四個高級卡主元素被設定為團扇。其外觀分別為圓形、花瓣形、芭蕉式等。通過設計手法展現團扇的刺繡工藝,細致到邊角和裝飾。而場景層則通過掐絲琺瑯的形式向用戶展現了祖國的大好河山??ǖ暮竺孢€點綴了具有科技屬性的衛星元素,預示著未來科技的蓬勃發展。



          [三] 科技廟會,獨具特色

          集卡是好運中國年系列活動中最先與大家見面的,為了讓用戶了解陸續開啟的更多活動,我們在集卡活動頁下方開辟了一個活動聚合專區,在設計上將傳統與科技融合,打造了一個豐富又獨具特色的廟會場景。前期提煉的科技元素轉化為環繞道路的彩色全息路標,行駛中的百度無人車,LED光感的廟會建筑等,與各活動入口共同打造一個科技感十足的廟會街道。



          親朋共團圓:疫情后我們第一次團聚

          在過去新冠疫情肆虐的三年中,大家與親人朋友團聚的機會變得格外珍貴。在后疫情時代的第一個新年,活動從除夕到元宵節,逐步開啟多個紅包福利活動,與去年相比,在玩法上更多樣,增加了3個邀好友和2個紅包雨活動,為用戶與親朋創造了豐富多樣的線上互動場景。

          除夕和元宵節是春節的首尾時刻,通過紅包雨游戲為用戶發放福利。在除夕夜,特別開設了多個時段的大額紅包玩法,用戶與家人一起守歲搶紅包、迎接新年到來。



          團圓紅包、新春大紅包、開工領紅包,是春節系列活動中的3個各不相同的邀好友活動,我們通過差異化的設計形態,向用戶呈現豐富多樣的紅包福利。



          在春節假期到來前,團圓紅包活動的互動方式主打線上分享,提前為用戶創造與家人線上聯系領福利的場景。

          而在春節假期后期推出的掃碼領紅包活動中,迎合朋友見面聚會場景,設計上強化掃碼互動方式,便于線下面對面拉好友參與。

          開工領現金是今年百度春節新增的特殊玩法,貼合新年后開工利是的現代習俗,吸引用戶向身邊的同事朋友分享這份好彩頭。

          年俗文化鏈通全局

          當然這些活動的視覺也少不了科技和年俗文化的碰撞,將這些細節元素貫穿在各個活動中給用戶更加統一完整的沉浸體驗,如此多的年俗物件,是在去年活動中沒出現過的。



          傾聽用戶聲音,點滴之中打磨更好的細節體驗

          今年的“新”體驗也體現在我們的細節打磨上。秉承用戶體驗至上的原則,從去年春節活動開始,團隊嘗試通過投放問卷了解用戶參與活動的感受,在今年為用戶打造了更好的細節體驗。

          通過細致入微的設計思考、克制的細節處理,打磨出「更簡單」、「更生活」、「更生動」的體驗。在今年的體驗反饋中,獲得了很多用戶的稱贊。



          [更生活]

          更生活體現在高級卡的場景設計上,將燈籠的點亮態和未點亮態通過顏色和質感進行區分,通過集卡逐一點亮燈籠,制造小的驚喜點,寓意照亮全家人的平安與幸福。



          [更簡單]

          為了讓活動更易于上手,我們將主頁和彈窗中的主按鈕文字放大,提高主按鈕的視覺層級,這種設計讓白發人群也可輕松參與到活動中。



          同樣的,掃碼活動中二維碼的展示也進行了放大處理,節省了點擊再放大的步驟,更便于識別和用戶之間的面對面分享。



          [更生動]

          在紅包雨活動中,為了保證用戶的游戲體驗,使用了二維游戲引擎,增強動畫流暢度。同時在多種道具上增加了點擊實時反饋,強化道具的生命力。



          在開工領紅包活動中使用動作捕捉數據,讓人物的動作更真實,更靈活。同時設計了金幣的碰撞反饋,提升用戶的點擊感和爽感。給用戶更好的游戲感體驗。




          作者:百度MEUX來源:站酷

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

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

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

          日歷

          鏈接

          個人資料

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

          存檔

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