五十路熟妇高熟无码视频,无码簧片,亚洲大尺度无码无码专线,亚洲欧美日韩国产自偷,jizz无码在线观看视频,av色综合,99精品国产成人一区二区,亚洲粉嫩av一区二区黑人

首頁

UI 設(shè)計組件的價值與實踐+常用 UI 設(shè)計組件核心規(guī)范清單

藍(lán)藍(lán)設(shè)計的小編 前端及開發(fā)文章及欣賞

 
在數(shù)字產(chǎn)品的界面世界里,設(shè)計組件就像是建筑中的標(biāo)準(zhǔn)化磚石,既支撐起界面的穩(wěn)固性,又決定了體驗的流暢度。從一張信息卡片到一條進度條,從一個分頁控件到一整塊瓷片區(qū),這些看似微小的元素,正是構(gòu)成優(yōu)秀 UI 的基石。蘭亭妙微的設(shè)計和開發(fā)工程師們,也在這在數(shù)字產(chǎn)品的界面世界里學(xué)習(xí),整日搬磚,哈哈。

 

一、設(shè)計組件:不止是 “零件”,更是體驗的骨架

 
設(shè)計組件并非孤立的視覺元素,而是具備可復(fù)用性、一致性、可擴展性的功能單元。它們不僅能讓設(shè)計師從重復(fù)勞動中解放出來,更能讓用戶在不同產(chǎn)品、不同頁面間建立穩(wěn)定的認(rèn)知邏輯。
 
  • 效率層面:一套成熟的組件庫可以將界面搭建效率提升 50% 以上,避免重復(fù)造輪子。比如進度條、分頁器這類高頻組件,標(biāo)準(zhǔn)化后無需每次重新設(shè)計。
  • 體驗層面:當(dāng)用戶在不同 APP 中看到相似的進度條時,能立刻理解 “進度→完成” 的對應(yīng)關(guān)系,這種認(rèn)知慣性大幅降低了學(xué)習(xí)成本。
  • 系統(tǒng)層面:組件化讓產(chǎn)品迭代更靈活,比如瓷片區(qū)的布局邏輯可以快速適配從手機到手表的不同屏幕尺寸,保證體驗的連貫性。

 

二、常見組件的設(shè)計邏輯與場景適配

 
不同組件的形態(tài)背后,是對用戶行為的深度洞察。我們可以從收集的案例中拆解出典型組件的設(shè)計思路:

1. 信息瓷片區(qū):碎片化信息的 “收納盒”

 
瓷片區(qū)(Cards)是承載碎片化信息的核心容器,它通過視覺邊界將不同功能模塊清晰區(qū)隔,同時保持整體視覺的呼吸感。
 
  • 場景適配:在學(xué)習(xí)類 APP 中,瓷片區(qū)可以將 “自由練習(xí)”“睡眠助手” 等功能模塊獨立呈現(xiàn);在醫(yī)療類界面中,“極速問診”“找醫(yī)生” 等入口也通過瓷片實現(xiàn)快速分流。
  • 設(shè)計要點:圓角、陰影和微妙的背景色變化,是區(qū)分瓷片層級的關(guān)鍵。同時,瓷片內(nèi)的信息密度需要與用戶需求匹配 —— 工具類瓷片突出功能按鈕,資訊類瓷片則優(yōu)先展示標(biāo)題與摘要。

 

2. 進度條:看不見的 “情緒安撫器”

 
進度條的核心價值,是將抽象的 “等待” 轉(zhuǎn)化為可視化的 “進度”,從而緩解用戶的焦慮感。
 
  • 場景適配:在支付流程中,步驟式進度條讓用戶清晰感知 “填寫信息→確認(rèn)訂單→完成支付” 的路徑;在健身 APP 里,環(huán)形進度條則通過直觀的百分比反饋,強化用戶的成就感。
  • 設(shè)計要點:除了基礎(chǔ)的線性進度條,擬人化的動態(tài)進度條(如帶表情的加載動畫)能進一步提升趣味性;而分段式進度條則適合多節(jié)點的流程場景,比如 “高考日程” 時間軸。

3. 分頁器:長內(nèi)容的 “導(dǎo)航羅盤”

 
當(dāng)內(nèi)容量超出一屏承載能力時,分頁器就成了用戶探索長內(nèi)容的導(dǎo)航工具。
 
  • 場景適配:電商平臺的商品列表、內(nèi)容平臺的文章流,都依賴分頁器實現(xiàn)高效瀏覽。下拉加載是移動端的主流選擇,但在需要精確定位的場景(如后臺管理系統(tǒng)),數(shù)字分頁器依然不可替代。
  • 設(shè)計要點:分頁器的交互需要兼顧效率與容錯性,比如 “跳轉(zhuǎn)到指定頁碼” 的輸入框,適合有明確目標(biāo)的用戶;而 “上一頁 / 下一頁” 的按鈕,則更符合無目的瀏覽的行為習(xí)慣。

4. 導(dǎo)航欄:用戶的 “空間錨點”

導(dǎo)航欄是用戶在產(chǎn)品中定位的核心依據(jù),無論是頂部標(biāo)簽欄還是側(cè)邊抽屜導(dǎo)航,本質(zhì)都是為了降低用戶的迷路成本。
 
  • 場景適配:內(nèi)容類 APP 的 “推薦 / 關(guān)注 / 訂閱” 標(biāo)簽欄,讓用戶在不同內(nèi)容流間快速切換;工具類產(chǎn)品的功能導(dǎo)航欄,則通過圖標(biāo) + 文字的組合,讓復(fù)雜功能變得觸手可及。
  • 設(shè)計要點:當(dāng)前選中狀態(tài)的視覺強化(如顏色加深、下劃線)是導(dǎo)航欄的核心設(shè)計原則;同時,導(dǎo)航項的數(shù)量需要控制在用戶記憶閾值內(nèi),一般不超過 5 個。
 

三、組件化設(shè)計的進階思維:從 “用組件” 到 “造系統(tǒng)”

 
成熟的組件設(shè)計,不止是單個元素的打磨,更是一套可生長的系統(tǒng)工程。
 
  • 原子化設(shè)計:將組件拆解為 “原子(按鈕、輸入框)→分子(搜索框、卡片)→有機體(表單、列表)” 的層級,讓組件具備更強的組合性和適應(yīng)性。
  • 適配性設(shè)計:同一組件需要在不同設(shè)備上保持體驗一致。比如智能手表上的瓷片需要更大的觸控區(qū)域,而平板端的進度條則可以承載更多信息維度。
  • 情感化設(shè)計:在功能性基礎(chǔ)上注入情感細(xì)節(jié),比如完成任務(wù)時進度條的慶祝動畫、瓷片 hover 時的微交互反饋,都能讓冰冷的界面變得有溫度。

 

 

 

設(shè)計組件從來不是冰冷的像素集合,而是連接產(chǎn)品與用戶的情感觸點。一個加載時的動態(tài)進度條,可能讓用戶愿意多等 3 秒;一張信息清晰的瓷片,或許能讓老年人也輕松上手。在追求效率與一致性的同時,別忘了給組件注入人文關(guān)懷 —— 這正是優(yōu)秀 UI 與平庸界面的本質(zhì)區(qū)別。

常用 UI 設(shè)計組件核心規(guī)范清單

 
本清單圍繞高頻通用組件制定,兼顧視覺統(tǒng)一、交互適配、多端兼容原則,適配移動端 / PC 端通用設(shè)計場景,可直接落地項目并根據(jù)品牌風(fēng)格微調(diào)。

一、基礎(chǔ)容器類:信息瓷片區(qū)(Card)

視覺規(guī)范

  • 圓角:移動端 8~12px,PC 端 12~16px(極簡風(fēng)格可降至 4px,無圓角慎用于高頻觸控場景)
  • 陰影:輕量瓷片(信息展示)用低 - opacity 柔陰影(rgba (0,0,0,0.06),偏移 0 2px,模糊 8px);重量級瓷片(功能核心區(qū))用雙層輕陰影增強層級,避免厚重投影
  • 邊距:瓷片內(nèi)部上下左右內(nèi)邊距,移動端 16px,PC 端 20px;瓷片之間間距,移動端 12~16px,PC 端 20~24px
  • 背景:默認(rèn)純白 / 品牌淺灰,hover 態(tài)(PC 端)可加淺底色(rgba (品牌主色,0.03)),禁用高飽和底色作默認(rèn)態(tài)

交互規(guī)范

  • 觸控區(qū)域:移動端單個瓷片最小觸控面積≥44×44px,避免文字 / 圖標(biāo)單獨觸控
  • 反饋:點擊態(tài)瓷片輕微下沉(transform: scale (0.98))+ 陰影變淺,PC 端 hover 態(tài)光標(biāo)變?yōu)?pointer,無點擊功能的瓷片禁用任何交互反饋

內(nèi)容規(guī)范

  • 信息密度:單瓷片最多承載 “標(biāo)題 + 副標(biāo)題 + 1 個核心按鈕 / 圖標(biāo) + 簡要說明”,避免多模塊信息堆砌
  • 視覺層級:標(biāo)題(粗體 / 高字號)> 核心信息(常規(guī)字重)> 輔助信息(淺灰 / 小字號),禁用 3 種及以上字體字重

二、進度反饋類:進度條(Progress Bar)

線性進度條

  • 尺寸:高度移動端 4~6px,PC 端 6~8px;寬度適配父容器,最小寬度≥80px
  • 樣式:默認(rèn)底色為品牌淺灰,進度底色為品牌主色,無外邊框;百分百完成態(tài)可加 1px 品牌主色描邊
  • 交互:加載中可加緩慢流動的動效(速度 0.8~1s / 次),完成態(tài)觸發(fā)輕微閃爍(3 次 / 0.3s)或漸變?yōu)槌晒ιňG色系)

環(huán)形進度條

  • 尺寸:直徑移動端 40~60px,PC 端 60~100px,環(huán)寬為直徑的 1/8~1/6
  • 樣式:環(huán)體默認(rèn)淺灰,進度環(huán)為品牌主色,中心可放置百分比數(shù)字(字號為直徑的 1/3~1/4)
  • 場景適配:單目標(biāo)進度(如完成率、打卡率)用環(huán)形,多節(jié)點流程(如支付、報名)用分段式線性進度條

分段式進度條(流程類) 

  • 節(jié)點:圓形節(jié)點直徑 8~12px,已完成節(jié)點填充品牌主色 + 描邊,未完成淺灰描邊,當(dāng)前節(jié)點放大 1.2 倍 + 品牌主色描邊 + 內(nèi)白圈
  • 間距:節(jié)點之間的連線長度,移動端≥20px,PC 端≥30px,連線高度與線性進度條一致
  • 文字:節(jié)點下方標(biāo)注流程名稱,字號比正文小 2 號,已完成文字為品牌主色,未完成淺灰,當(dāng)前節(jié)點文字加粗

三、內(nèi)容導(dǎo)航類:分頁器(Pagination)

移動端分頁器(下拉加載 / 上拉刷新) 

  • 加載提示:居中放置 “加載中…” 文字 + 輕量加載動畫,文字為淺灰,字號比正文小 1 號
  • 無更多內(nèi)容:提示文字為淺灰(rgba (0,0,0,0.4)),可搭配簡約圖標(biāo)(如空盒子),禁用高飽和顏色
  • 觸發(fā)區(qū)域:下拉刷新觸發(fā)距離≥50px,上拉加載觸發(fā)距離≥30px,避免誤觸

PC 端數(shù)字分頁器

  • 布局:居中對齊,按鈕與數(shù)字橫向排列,整體間距 12px
  • 按鈕樣式:上一頁 / 下一頁為圓角矩形(圓角 4px),寬度≥60px,禁用純圖標(biāo)按鈕(需搭配 “上一頁 / 下一頁” 文字)
  • 數(shù)字樣式:當(dāng)前頁碼為品牌主色底色 + 白色文字,非當(dāng)前頁碼為透明底色 + 淺灰文字,hover 態(tài)變?yōu)槠放茰\灰底色
  • 功能按鈕:“首頁 / 末頁” 按需添加,“跳轉(zhuǎn)到” 輸入框?qū)挾?ge;80px,輸入框右側(cè)搭配 “確定” 按鈕(與分頁按鈕樣式統(tǒng)一)

通用規(guī)范 

  • 容錯性:頁碼輸入框僅允許輸入數(shù)字,超出總頁數(shù)時自動提示,禁用非法字符輸入
  • 場景適配:長列表內(nèi)容(如商品、文章)用下拉加載,需精確定位的內(nèi)容(如后臺數(shù)據(jù)、報表)用數(shù)字分頁器 

四、頁面導(dǎo)航類:導(dǎo)航欄(Navigation Bar)

頂部標(biāo)簽導(dǎo)航欄(Tab Bar)

  • 數(shù)量:默認(rèn) 3~5 個,最多不超過 6 個(超出則用滾動式標(biāo)簽),避免用戶記憶負(fù)擔(dān)
  • 尺寸:移動端高度 48~56px,PC 端高度 60~72px;單個標(biāo)簽寬度均分,最小寬度≥80px
  • 樣式:未選中狀態(tài)為文字(+ 可選圖標(biāo)),淺灰顏色;選中狀態(tài)為文字 + 圖標(biāo)(或僅文字加粗),品牌主色,可加底部下劃線(高度 2~3px,與主色一致)
  • 交互:PC 端 hover 態(tài)文字變色 + 光標(biāo) pointer,移動端點擊態(tài)輕微下沉,切換時無卡頓(動畫時長≤0.3s)

側(cè)邊導(dǎo)航欄(PC 端專用)

  • 寬度:固定寬度 200~240px,可搭配折疊功能(折疊后寬度 60~80px,僅顯示圖標(biāo))
  • 層級:一級導(dǎo)航為主標(biāo)題(加粗,字號 16~18px),二級導(dǎo)航為子標(biāo)題(常規(guī),字號 14~16px),縮進 16px 區(qū)分層級
  • 樣式:選中導(dǎo)航項加左側(cè)主色豎線(寬度 4px)+ 淺灰底色,hover 態(tài)僅淺灰底色,禁用多色高亮
 通用規(guī)范
  • 視覺:導(dǎo)航欄背景為純白或淺灰,與頁面內(nèi)容區(qū)有清晰邊界(可加 1px 淺灰分割線),禁用漸變背景(極簡風(fēng)格除外)
  • 功能:必備返回 / 首頁按鈕(移動端),可選搜索 / 設(shè)置按鈕,避免功能按鈕堆砌(最多 2~3 個)
  • 適配:移動端導(dǎo)航欄適配劉海屏 / 挖孔屏,預(yù)留安全距離,避免內(nèi)容被遮擋

五、通用交互規(guī)范(所有組件適用)

  1. 動畫時長:所有組件的點擊、hover、切換動畫時長控制在 0.2~0.3s,快速反饋且無拖沓感
  2. 顏色體系:全組件僅使用品牌主色、輔助色(≤2 種)、中性色(黑、白、不同深度灰),禁用雜色,保證視覺統(tǒng)一
  3. 字體體系:全組件字體統(tǒng)一(如移動端思源黑體、PC 端微軟雅黑 / 思源黑體),字重僅用常規(guī)、加粗 2 種,避免多字重混用
  4. 多端兼容:同一組件在移動端 / PC 端的核心功能、視覺風(fēng)格一致,僅調(diào)整尺寸、交互方式(如 PC 端 hover、移動端點擊)
  5. 無障礙設(shè)計:組件顏色對比符合 WCAG 標(biāo)準(zhǔn)(文字與背景對比度≥4.5:1),支持鍵盤 Tab 鍵切換,圖標(biāo)搭配文字說明(避免純圖標(biāo)組件)

蘭亭妙微(藍(lán)藍(lán)設(shè)計)m.wtxcl.cn 是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計B端界面設(shè)計桌面端界面設(shè)計APP界面設(shè)計圖標(biāo)定制用戶體驗設(shè)計交互設(shè)計UI咨詢高端網(wǎng)站設(shè)計平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。

 

image.png

UI 圖標(biāo)繪制全攻略:從風(fēng)格到細(xì)節(jié),輕松打造統(tǒng)一質(zhì)感

濤濤 圖標(biāo)設(shè)計文章及欣賞

在 UI 設(shè)計中,圖標(biāo)是傳遞信息、提升界面顏值的核心元素。很多新手設(shè)計師明明看過不少教程,卻依然畫不出一套風(fēng)格統(tǒng)一、兼具實用性與趣味性的圖標(biāo) —— 要么風(fēng)格雜亂無章,要么細(xì)節(jié)處理粗糙,要么表意模糊。其實,圖標(biāo)繪制有章可循,掌握 “風(fēng)格定位、統(tǒng)一規(guī)范、造型方法、細(xì)節(jié)優(yōu)化” 四大核心,就能快速上手。本文結(jié)合實戰(zhàn)經(jīng)驗,拆解圖標(biāo)繪制的完整流程,幫你避開常見誤區(qū),畫出專業(yè)級圖標(biāo)。

B 端設(shè)計師必備:高效競品分析實戰(zhàn)指南

濤濤 B端ui設(shè)計文章及欣賞

對于 B 端設(shè)計師而言,競品分析是解決設(shè)計難題、把握行業(yè)趨勢的核心工具。但實際工作中,很多設(shè)計師都會陷入 “難試用、術(shù)語多、無結(jié)果” 的困境 —— 要么拿不到競品賬號,要么被專業(yè)術(shù)語繞暈,要么漫無目的地點擊瀏覽,最后只留下 “這個界面不好看” 的淺層評價。其實,B 端競品分析的核心不是復(fù)刻產(chǎn)品功能,而是通過拆解表象、挖掘邏輯,為自身設(shè)計提供可落地的思路。本文結(jié)合實戰(zhàn)經(jīng)驗,從核心價值、競品分類、分析方法到資源渠道,全方位拆解 B 端設(shè)計師該如何做好競品分析。

設(shè)計驗收:行之有效的機制探索

清陽 隨筆的一些文章

本文為「蘭亭妙微」轉(zhuǎn)載并編錄的行業(yè)實踐經(jīng)驗分享。原文圍繞產(chǎn)品設(shè)計驗收的意義、流程與評估方法展開,并結(jié)合齊治設(shè)計團隊在網(wǎng)絡(luò)安全產(chǎn)品DSG項目中的實際案例,系統(tǒng)闡述了如何通過標(biāo)準(zhǔn)化、體系化的驗收機制提升產(chǎn)品體驗與業(yè)務(wù)成效。希望能為關(guān)注產(chǎn)品設(shè)計質(zhì)量與團隊協(xié)作效率的同行提供參考。

image.png

一、設(shè)計驗收的價值何在?

設(shè)計驗收是指設(shè)計人員按照設(shè)計方案對研發(fā)人員的落地內(nèi)容進行逐項檢驗,理想狀態(tài)下,最終達成設(shè)計方案的完全還原。

由此可見,設(shè)計驗收的直接目標(biāo)是保證設(shè)計還原度。那么設(shè)計還原度究竟可以為產(chǎn)品帶來些什么?我們假定設(shè)計方案不存在問題:

  • 從需求層面來說,高還原度意味著用戶的功能需求得以滿足
  • 從體驗層面來說,高還原度意味著用戶的操作體驗得以保障

設(shè)計驗收追求每一個設(shè)計細(xì)節(jié)的切實落地,由此帶來的正面效益會傳遞給用戶更好的產(chǎn)品體驗,也進一步提升業(yè)務(wù)交付的滿意度。

那么如何在日常工作中高效高質(zhì)地開展設(shè)計驗收、發(fā)揮其價值,以下是齊治設(shè)計團隊結(jié)合網(wǎng)安產(chǎn)品DSG項目的驗收實踐給出的答案:

二、驗收流程的標(biāo)準(zhǔn)化:四個階段

規(guī)范工作流程有助于提高驗收效率,保障驗收質(zhì)量。

在制定設(shè)計驗收流程前,首先思考以下幾個基本問題——

  1. 何時開始驗收?
  2. 什么輸出內(nèi)容?
  3. 輸出給誰?
  4. 是否需要根據(jù)需求體量區(qū)分驗收方案?

最后,我們將設(shè)計驗收拆分為四個階段,明確以下標(biāo)準(zhǔn)流程用于指導(dǎo)設(shè)計驗證的開展:

1、準(zhǔn)備驗收階段

確定設(shè)計驗收的開始時間、驗收環(huán)境以及賬號密碼是設(shè)計人員開展設(shè)計驗收的必備條件。

理想狀態(tài)下,設(shè)計驗收的開始時間應(yīng)該是功能驗收基本完成,流程無阻斷性Bug之后,即發(fā)布前的最后2-3輪提測。但是考慮到具體項目執(zhí)行的變化,本流程建議設(shè)計人員主動向研發(fā)或測試負(fù)責(zé)人確認(rèn)開始前的條件信息。

2、具體驗收階段

通過比對設(shè)計方案與落地方案,設(shè)計人員可以發(fā)現(xiàn)落地方案未還原的內(nèi)容,以及少數(shù)設(shè)計方案不完善、不合理的地方。然后,為了更好地服務(wù)于問題修復(fù)階段的設(shè)研協(xié)作,設(shè)計人員需要將這些問題形成驗收表,并以在線文檔的形式共享給研發(fā)人員。這樣可以大大減少信息混亂、溝通低效、追溯困難等問題。

3、問題修復(fù)階段

設(shè)計人員發(fā)現(xiàn)問題并記錄于驗收表后,驗收就進入了最關(guān)鍵的一環(huán)。嚴(yán)格按照“溝通問題-修復(fù)問題-再次驗收直至問題被解決”的循環(huán)工作流來消滅問題,有助于切實提升設(shè)計落地的還原度。同時,出于驗收質(zhì)量的要求,建議設(shè)定一個循環(huán)次數(shù)的紅燈值,這是對設(shè)計人員與研發(fā)人員雙方的更高要求。

通過DSG項目的執(zhí)行驗證,我們發(fā)現(xiàn)「溝通」在這個階段至關(guān)重要,這包括所有問題的整體澄清以及具體問題的修復(fù)溝通。尤其當(dāng)問題總數(shù)較大時,設(shè)計人員與研發(fā)人員之間的充分溝通會讓問題修復(fù)進展得更加順暢、大家的協(xié)作體驗也會更好。

以下兩點可以看作提高協(xié)作效率、推動問題修復(fù)的關(guān)鍵任務(wù):

  • 設(shè)計人員應(yīng)當(dāng)及時澄清待修復(fù)問題(開始修復(fù)之前)
  • 研發(fā)人員應(yīng)當(dāng)快速明確問題修復(fù)的負(fù)責(zé)人員及完成時間

4、復(fù)盤階段

DSG第一個上線版本的設(shè)計驗收修復(fù)質(zhì)量不佳,遺留問題過多。為了有效改善這個情況,版本上線后,設(shè)計人員組織研發(fā)人員、測試人員一起進行了該期設(shè)計驗收的復(fù)盤會議。會議主要圍繞著「明確遺留問題的處置方案」和「反思修復(fù)問題的限制因素」展開。通過復(fù)盤,我們主動發(fā)現(xiàn)本次驗收過程中的不足之處,并討論未來工作中的優(yōu)化措施。反映到DSG項目來說,二期驗收修復(fù)率較一期提升了26.24%。

由于在項目實踐中顯而易見的顯著效果,復(fù)盤階段也被引入到標(biāo)準(zhǔn)流程當(dāng)來。我們擴寬了復(fù)盤的行動范圍,首先由設(shè)計人員進行遺留問題的整理以及修復(fù)率等驗收數(shù)據(jù)的統(tǒng)計,然后據(jù)此判斷本次驗收質(zhì)量。質(zhì)量較低時組織全體性的復(fù)盤會議,明確后續(xù)改進方案;質(zhì)量較高時則以更輕量的方式與項目團隊成員進行信息對齊,如我們目前采用的方式是:具體問題由相關(guān)責(zé)任人及時溝通;整體驗收情況與遺留處置計劃放到下一期的設(shè)計澄清會議上進行全體對齊。

三、驗收機制的體系化:一張表

建立起標(biāo)準(zhǔn)化的設(shè)計驗收流程后,如何進一步形成體系化的設(shè)計驗收機制來指導(dǎo)工作?我認(rèn)為可以是對工具/手段的探索,如驗收結(jié)果的輸出內(nèi)容就是一個不錯的方向。

設(shè)計人員向研發(fā)人員告知驗收結(jié)果的方式可以靈活多樣,但無數(shù)的經(jīng)驗告訴我們,當(dāng)問題數(shù)量一多,簡單的口頭溝通或面對面演示等方式在問題管理、修復(fù)追蹤等方面的缺陷就顯露無疑了。故在本驗收機制下,我們還提供了一個設(shè)計驗收表的內(nèi)容模版。

這個驗收表采用「設(shè)計-研發(fā)共同編輯」的協(xié)作模式,畢竟設(shè)計驗收不是一個人或一個團隊的事兒,需要設(shè)計與研發(fā)乃至產(chǎn)品、測試多方的溝通與努力。

此外,我們目前還未針對該驗收表內(nèi)部分需要細(xì)化的項給出范圍定義與填寫說明,如「問題類型」的囊括范圍、「嚴(yán)重程度」的判斷方式,這都有待后續(xù)完善。

找到一個可用的工具是第一步,怎么把工具用好則是接下來真正的挑戰(zhàn)。

四、驗收效果的量化:一個數(shù)據(jù)

那么如何度量設(shè)計驗收的效果呢?下圖是我們在DSG項目中對驗收效果量化所做的探索:

從實踐中沉淀,我們引入了“修復(fù)率”這個數(shù)值,他的獲取門檻較低,又直觀反映了問題的存在——

修復(fù)率=修復(fù)問題數(shù)/(驗收問題總數(shù)-無法修復(fù)問題數(shù)),其中問題總數(shù)=當(dāng)期發(fā)現(xiàn)問題(新)+遺留問題(舊);無法修復(fù)問題是指極少數(shù)現(xiàn)階段難以改變的問題,一般多是技術(shù)限制導(dǎo)致的。

隨后,我們可以通過同產(chǎn)品不同期、不同產(chǎn)品同期等對比方式來分析修復(fù)率,量化設(shè)計驗收;或者結(jié)合更多維度的產(chǎn)品體驗數(shù)據(jù),對修復(fù)率的數(shù)值范圍進行劃界,進一步給出設(shè)計驗收執(zhí)行效果的通用衡量標(biāo)準(zhǔn)。

當(dāng)然,量化設(shè)計驗收效果,答案或許不止這一個,我們也將繼續(xù)探索并沉淀。如上文提到的修復(fù)循環(huán)次數(shù)的紅燈值,亦是一個不錯的切入點。

五、合抱之木,生于毫末

當(dāng)然,本文構(gòu)想的設(shè)計驗收機制仍處于初級階段,后續(xù)還有很長的路要走。比如以下幾個初步設(shè)想:

1、通過更多項目機會驗證該機制(包括階段設(shè)計、表設(shè)計等)的完整性、合理性

2、總結(jié)歸納四個階段在執(zhí)行過程中的注意事項,形成指導(dǎo)原則

3、定義說明驗收表內(nèi)部分使用起來存疑的信息字段

4、探索沉淀更多有價值的量化數(shù)據(jù)

5、深入考慮當(dāng)前機制如何充分適應(yīng)不同需求體量下的設(shè)計驗收

為團隊提效,為業(yè)務(wù)賦能,愿我們秉承初心,繼續(xù)探索行之有效的設(shè)計驗收機制。

轉(zhuǎn)載:人人都是產(chǎn)品經(jīng)理

蘭亭妙微(藍(lán)藍(lán)設(shè)計)m.wtxcl.cn 是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計B端界面設(shè)計桌面端界面設(shè)計APP界面設(shè)計圖標(biāo)定制用戶體驗設(shè)計交互設(shè)計UI咨詢高端網(wǎng)站設(shè)計平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。

 

image.png

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

清陽 用戶研究

在電商平臺,中后臺系統(tǒng)工作龐大且復(fù)雜,而中后臺系統(tǒng)是否有規(guī)范的邏輯、是否有高效的體驗,則會體現(xiàn)在用戶的身上。本篇文章作者總結(jié)自身經(jīng)驗,為我們總結(jié)中后臺體驗優(yōu)化的思路和方法,一起來看看。

image.png

自 18 年 6 月底介入電商中后臺交互設(shè)計工作以來,筆者有幸做了很多和以往的交互設(shè)計不太一樣的工作,除了日常需求的交互設(shè)計支持以外,更多的精力放在了系統(tǒng)整體體驗提升和設(shè)計規(guī)范上。

本文整理了之前在中后臺體驗優(yōu)化實踐中的思路和方法,如何從設(shè)計角度高效地優(yōu)化整個系統(tǒng)的體驗,如何而非僅僅停留在表現(xiàn)層,希望能與大家交流碰撞。

一、問題背景

1. 后臺為什么需要考慮體驗?

在產(chǎn)品初期的時候,后臺系統(tǒng)只是為了支持前臺,實現(xiàn)功能即可,但隨著產(chǎn)品越來越龐大,每一個前臺的小小的功能優(yōu)化,都可能是由后臺一整套支持體系,和一整個運營產(chǎn)品組來維護的。因此,后臺系統(tǒng)的體驗也時刻影響著團隊成員的工作效率,影響著一個產(chǎn)品在用戶面前的形象。后臺系統(tǒng)的體驗提升,并不僅僅是使用體驗提升,更多的是效能提升,和產(chǎn)品邏輯的規(guī)范。

2. 后臺系統(tǒng)體驗優(yōu)化有什么不同?

系統(tǒng)體驗提升的任務(wù),相較于其他工作,不同的地方在于交互設(shè)計師并非被動地接受某個單點需求,也沒有一個既定的模式去執(zhí)行,而是要主動地去思考如何衡量體驗,如何全局地管理體驗,以及如何更好地規(guī)劃方案。在這樣的前提下,交互設(shè)計師更應(yīng)該為全局的體驗負(fù)責(zé),所以發(fā)揮設(shè)計師的主動性非常重要。

3. 如何去做?

基本思路是:衡量 → 收集 → 規(guī)劃 → 設(shè)計。

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

前三步都是與畫稿子無關(guān)的部分,但卻是非常重要的部分,在整個過程中,溝通非常重要,正因為后臺系統(tǒng)的業(yè)務(wù)專業(yè)性強,邏輯復(fù)雜,需求方多,所以需要更多地與各方進行溝通,調(diào)動大家的力量,一起來參與體驗優(yōu)化。

二、衡量體驗,收集反饋

正如現(xiàn)代管理學(xué)之夫彼得·德魯克所說,如果我們不知道平臺的現(xiàn)狀,“提升”也就無從談起。

在 C 端產(chǎn)品中乃至部分B端產(chǎn)品中,我們有很多聰明的辦法去衡量一個產(chǎn)品的現(xiàn)狀,比如凈推薦值,跳出率,任務(wù)完成率,可以直接從數(shù)據(jù)觀察到用戶流失的環(huán)節(jié),方便又客觀。但是對于公司內(nèi)部使用的中后臺系統(tǒng)來說,一個是數(shù)據(jù)樣本量少,不一定能準(zhǔn)確代表問題;更重要的是,不管體驗如何,用戶出于完成工作的目的,也必須完成系統(tǒng)的任務(wù),所謂完成率和體驗沒有必然聯(lián)系。

當(dāng)數(shù)據(jù)少的時候,不妨倒過來想,數(shù)據(jù)分析本來就是為大體量的產(chǎn)品客觀分析所有用戶的行為,而把每一個用戶抽象成了一組數(shù)據(jù),再來綜合評估。那么如果你的每一個用戶都至關(guān)重要,且不需要花費太多的精力就可以與他們來一場面對面的對談,豈不是更有助于你去了解你的用戶?用戶訪談、可用性測試、用戶體驗地圖都是非常適合用在這種場景下的。

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

最終,我們在本次優(yōu)化中選擇了 3 種方式來衡量系統(tǒng)的體驗:

  1. 滿意度問卷,把抽象的體驗用用戶的主觀評分來衡量,具象到某個數(shù)值;
  2. 用戶體驗地圖,整體定位系統(tǒng)痛點和機會點;
  3. 流程時效,把時效的提升作為系統(tǒng)體驗提升的一個體現(xiàn);

1. 滿意度問卷

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

一般來說,滿意度問卷在結(jié)構(gòu)上會包含:產(chǎn)品整體滿意度,通用指標(biāo)滿意度,業(yè)務(wù)功能滿意度三部分;為了精細(xì)化分析,我又添加了一部分用戶屬性的內(nèi)容,和最后的開放性意見,主要是為了更好地幫助后續(xù)分析重點優(yōu)化方向和搜集用戶意見。

在設(shè)計問卷的問題和答案時,不要用太過專業(yè)的術(shù)語,答案也不一定要用標(biāo)準(zhǔn)的五級量表(非常滿意、滿意、一般、不滿意、非常不滿意),可以更具象地去描述1-5級的答案,方便用戶選擇。

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

如上述問題,將比較抽象的 “系統(tǒng)穩(wěn)定性” 轉(zhuǎn)化為“頁面打開速度和出錯頻率”來描述,答案也做了更具象的描述,方便用戶確定他們的滿意程度。

下圖是某個系統(tǒng)的功能滿意度,很明顯可以看到 D、E 模塊的滿意度是低于其他模塊的,后續(xù)可重點關(guān)注這2個模塊;同時,海外用戶的滿意度普遍低于所有用戶,確實在這之前海外用戶的需求,比較難觸達到產(chǎn)品組內(nèi)部。

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

2. 用戶體驗地圖

滿意度問卷已經(jīng)幫助我們客觀地了解到用戶對于系統(tǒng)的滿意程度,也有了一定的優(yōu)化重點,但對于落地方案來說,還是比較籠統(tǒng)而零散。作為一次完整的體驗提升優(yōu)化,還需要站在更全局的角度去仔細(xì)審視系統(tǒng)的每一個環(huán)節(jié)。

前面提到,中后臺系統(tǒng)往往有很高的業(yè)務(wù)壁壘,體量大,流程長,涉及角色多,對于某個單一角色來說,想要快速深入到系統(tǒng)底層,找出所有問題,是不現(xiàn)實也不客觀的。

對此,我的想法是,借助用戶和項目成員的力量,共創(chuàng)用戶體驗地圖。

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

用戶體驗地圖

用戶體驗地圖是產(chǎn)品設(shè)計中常用到的一種設(shè)計方法,它讓我們平時零散獲得的抱怨、吐槽,變成有序的階段體驗,直觀地呈現(xiàn)出用戶在每一個目標(biāo)任務(wù)下的行為、思考、痛點和機會點。

在此不再詳述用戶體驗地圖的定義和使用方法,具體可參考螞蟻金服的實戰(zhàn)案例:https://www.uisdc.com/user-maps-design-ali-case#

中后臺系統(tǒng)共創(chuàng)用戶體驗地圖,要在擁有用戶意見的基礎(chǔ)上,邀請產(chǎn)品、技術(shù)、設(shè)計、業(yè)務(wù)方共同參與,當(dāng)涉及多個業(yè)務(wù)方時,也需要同時邀請,一起來思考站在用戶角度的痛點,和站在自己角度可以提出的機會點。

往往此時,不同的業(yè)務(wù)方之間,以及和產(chǎn)品方、用戶方之間,視角不同,都會存在或大或小的利益沖突,大家共創(chuàng)的過程也是不斷碰撞、同步的過程。在大方向(提升系統(tǒng)體驗,促進業(yè)務(wù)成長)一致的前提下,所有人的意見是可以在討論中互相磨合,最終達成細(xì)節(jié)共識的。

在此過程中,有非常重要的一點,在于設(shè)計師要提前和各方確認(rèn)好系統(tǒng)的主流程,并在會議上引導(dǎo)成員按照主流程框架來進行思考和討論,控制好節(jié)奏和話題走向,切記千萬不要讓體驗地圖共創(chuàng),變成了七嘴八舌的「吐槽大會」。最終只是收獲到了一堆抱怨,卻沒有結(jié)論和共識。

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

提前確定好的主流程

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

最終的用戶體驗地圖

三、規(guī)劃方案,輸出設(shè)計

在有了較為全面的用戶體驗地圖后,我們就可以全局地去考慮系統(tǒng)體驗提升如何落地了。事實上,在共創(chuàng)的過程中,包括后續(xù)的整理中,我們可以看到除了業(yè)務(wù)相關(guān)的機會點外,許多體驗上的問題是相通的,例如:復(fù)雜表單填寫缺少規(guī)范、系統(tǒng)通知混亂、流程進度不透明、小屏幕展示不友好等等,雖然這些問題會出現(xiàn)在不同的業(yè)務(wù)模塊中,但是從交互設(shè)計的角度來說,它們的解決方案是一致的,可復(fù)制的。

可以和產(chǎn)品一起把這些需求仔細(xì)評估一遍,分為三個部分:

  • 不需要設(shè)計方案的優(yōu)化:一句話需求,系統(tǒng) bug,讓優(yōu)化先開始起來;
  • 框架性設(shè)計或共性問題:導(dǎo)航、首頁、全局通知、表單填寫規(guī)范等,搭好框架才能在處理細(xì)節(jié)問題時更加高效;
  • 不可復(fù)用的復(fù)雜設(shè)計:細(xì)節(jié)功能優(yōu)化,涉及具體業(yè)務(wù)的底層邏輯變更,新功能等;

在此重點分享一下首頁通知分級流程節(jié)點透明化等參考價值比較高的框架性設(shè)計,也就是第二部分。

1. 首頁重設(shè)計

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

對于首頁改版,最重要的是明確設(shè)計定位,之后就是填充支撐定位的內(nèi)容模塊,設(shè)計展現(xiàn)形式。

1)明確設(shè)計定位

作為一個以協(xié)同辦公為主的平臺,我們對于系統(tǒng)首頁的定位為:

  • 新用戶-了解平臺的快速開始入口;
  • 老用戶-處理事項的快速協(xié)同入口,業(yè)務(wù)激勵內(nèi)容露出的看板;

2)填充內(nèi)容模塊

由此,我們會需要官方公告、幫助引導(dǎo)、待辦事項、業(yè)務(wù)附能等內(nèi)容模塊,可以根據(jù)用戶角色的不同分別顯示。

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

3)設(shè)計展現(xiàn)形式

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

2. 通知分級

當(dāng)用戶抱怨通知消息太多,細(xì)細(xì)追究又發(fā)現(xiàn)每個通知都有必須存在的理由時,我想,可能是系統(tǒng)沒有做好通知分級。

正如我們設(shè)計每個頁面時會對頁面上的信息進行分級,給到不同的展示效果一樣,當(dāng)系統(tǒng)龐大到某種程度,我們就需要對系統(tǒng)的通知進行一次「通知分級」。把重要緊急的消息直接傳遞到用戶面前,弱化一些反饋型通知。

所以就需要我們整理整個系統(tǒng)流程里需要提醒的事,以及確定它的重要程度分類,包括:

  • 重要且緊急,需要用戶盡快處理的事,可以通過郵件、短信等系統(tǒng)外的渠道及時通知用戶;
  • 重要但不緊急,在系統(tǒng)明顯位置給到提醒,保證用戶看到即可;
  • 不重要不緊急,但需要給到用戶的反饋,例如某個流程完成的通知,可適當(dāng)收起,根據(jù)用戶自身習(xí)慣選擇性查看;
  • 甚至某些非常大量,且不重要不緊急的事項通知,可以考慮直接去掉,轉(zhuǎn)化到具體頁面中能查詢到即可;

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

部分通知分級示例

3. 復(fù)雜表單填寫優(yōu)化

在中后臺系統(tǒng)中,經(jīng)常會涉及異常復(fù)雜的表單填寫,不僅僅是內(nèi)容多,而且每個填寫項涉及業(yè)務(wù)規(guī)范,缺少填寫指引,容易出錯,流程反復(fù)駁回,對接低效。

于是,在必要流程前添加了準(zhǔn)備資料階段,列出了所有需要準(zhǔn)備的資料,注意:

  • 每個資料都需要有示例,并標(biāo)注審核要點;
  • 清晰描述資料的業(yè)務(wù)規(guī)范,容易遺漏出錯的內(nèi)容需要高亮說明;
  • 需要用模板填寫的資料提前給到模板;

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

明確的填寫指引,再配合針對審核人及時的通知提醒,目標(biāo)將原來 41 天的流程時效降低到 21 天。

4. 流程節(jié)點透明化

中后臺系統(tǒng)會有非常多的流程協(xié)作功能,但是之前系統(tǒng)的做法僅僅是完成了流程的「功能」,卻沒有照顧到用戶的「心理」,沒有告知用戶每個流程應(yīng)有的節(jié)點、規(guī)范、當(dāng)前進度。用戶在等待流程推進的時候仿佛進入了一個黑箱,不知道現(xiàn)在的進度如何也不知道什么時候會完成,不僅是體驗不好,而且會浪費大量的人力、資源在溝通流程進度上。

所以在整體優(yōu)化時,引入了流程進度模塊,清晰地展示了整體流程的節(jié)點,對應(yīng)的操作人,截止時間,以及完成節(jié)點的操作記錄。這節(jié)省了非常多內(nèi)外溝通的時間。

B端設(shè)計|如何系統(tǒng)性提升中后臺產(chǎn)品體驗

流程節(jié)點透明化

四、總結(jié)

以上,就是本次中后臺系統(tǒng)體驗提升的大致過程:

  1. 定位系統(tǒng)體驗;
  2. 收集各方反饋;
  3. 提煉通用體驗問題;
  4. 設(shè)計解決方案。

中后臺大多數(shù)業(yè)務(wù)復(fù)雜,體量龐大,設(shè)計剛剛接觸時會覺得無從下手,利用這樣的一套流程不僅能幫助我們與團隊成員一起優(yōu)化系統(tǒng)體驗,還能讓我們深入到用戶場景,和各業(yè)務(wù)方、用戶方深入交流,對后續(xù)的工作也很有幫助。

筆者一直認(rèn)為,雖然中后臺是前臺用戶看不見的地方,但后臺系統(tǒng)邏輯的規(guī)范,體驗的高效,最終會透過層層映射展現(xiàn)在用戶面前。對于電商來說,可能更多體現(xiàn)在發(fā)貨、物流、質(zhì)檢等屏幕外的體驗上,但這也是產(chǎn)品體驗不可忽視的一部分,需要我們?yōu)榇颂泶u加瓦,不斷加分。

轉(zhuǎn)載:人人都是產(chǎn)品經(jīng)理

蘭亭妙微(藍(lán)藍(lán)設(shè)計)m.wtxcl.cn 是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計B端界面設(shè)計桌面端界面設(shè)計APP界面設(shè)計圖標(biāo)定制用戶體驗設(shè)計交互設(shè)計UI咨詢高端網(wǎng)站設(shè)計平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。

 

image.png

產(chǎn)品分析實戰(zhàn)指南:從目標(biāo)到落地的全流程方法論

濤濤 用戶研究

在互聯(lián)網(wǎng)行業(yè),產(chǎn)品分析是連接需求與落地的核心橋梁,不僅是產(chǎn)品經(jīng)理的核心技能,更是 UI 設(shè)計師、運營、市場等崗位提升專業(yè)能力、做出精準(zhǔn)決策的必備工具。很多人認(rèn)為產(chǎn)品分析高深莫測,或是簡單羅列功能、堆砌數(shù)據(jù),最終產(chǎn)出的報告缺乏針對性和實操性。實際上,產(chǎn)品分析是一套邏輯清晰、步驟明確的系統(tǒng)方法,核心是圍繞明確目標(biāo),從多維度拆解產(chǎn)品本質(zhì),為工作決策提供有效支撐。本文將結(jié)合實戰(zhàn)場景,拆解產(chǎn)品分析的完整流程與核心要點,幫助新手快速上手。

? B 端表單頁設(shè)計:從規(guī)范到高效的全維度指南

濤濤 B端ui設(shè)計文章及欣賞

在 B 端產(chǎn)品中,表單頁是數(shù)據(jù)錄入的核心載體,更是用戶與系統(tǒng)交互的關(guān)鍵橋梁。很多設(shè)計師往往因表單頁視覺設(shè)計空間有限而忽視其重要性,導(dǎo)致頁面布局混亂、操作繁瑣,嚴(yán)重影響用戶錄入效率。然而,優(yōu)秀的表單設(shè)計能夠通過合理的結(jié)構(gòu)、清晰的指引和智能的交互,將 “被迫填寫” 轉(zhuǎn)化為 “高效完成”,真正實現(xiàn)為 B 端用戶降本增效的核心目標(biāo)。本文將從設(shè)計原則、核心構(gòu)成、交互設(shè)計、布局策略和易用性優(yōu)化五個維度,拆解 B 端表單頁的設(shè)計邏輯與實踐方法。

UI 設(shè)計新范式:從國際案例看體驗與商業(yè)的融合之道

藍(lán)藍(lán)設(shè)計的小編 行業(yè)趨勢

蘭亭妙微作為一家專業(yè)的設(shè)計公司,我們從全球優(yōu)質(zhì) UI 案例中提煉共性與亮點,為自身的設(shè)計實踐提供靈感與參考。以下是對這組精選案例的深度解析,展現(xiàn)我們對 UI 設(shè)計趨勢的敏銳洞察。

 

 

一、趨勢洞察:當(dāng)代 UI 設(shè)計的核心走向

 
  1. 情緒價值優(yōu)先
     
    設(shè)計不再僅僅滿足功能需求,更注重營造符合產(chǎn)品氣質(zhì)的情緒體驗。
     
    • 如 Lumio 智能家居平臺,用米白和淺灰的低飽和色調(diào),營造了溫暖、安心的居家情緒價值。
    • Skillery 教育平臺則用活力藍(lán),傳遞出專業(yè)且充滿活力的學(xué)習(xí)氛圍。
     
  2. 信息架構(gòu)輕量化
     
    復(fù)雜功能被拆解為直觀的模塊,降低用戶認(rèn)知負(fù)荷。
     
    • AI 營銷工具將復(fù)雜的營銷鏈路,拆解為 “點贊 - 轉(zhuǎn)發(fā) - 推廣” 等具象化微交互。
    • 智能家居平臺則用卡片式布局,將設(shè)備控制、能源分析等功能清晰分區(qū)。
     
  3. 微交互與動效賦能
     
    細(xì)膩的動效反饋讓界面充滿生命力,提升用戶操作的愉悅感。
     
    • 例如,Lumio 平臺的空調(diào)溫度調(diào)節(jié),通過平滑的數(shù)值與指針動畫,賦予日常操作以儀式感。
    • Skillery 平臺的排行榜,通過成就徽章的彈出動畫,強化了用戶的成就感。
     
 

 

二、分案 UI 設(shè)計亮點拆解

 

1. Lumio

 
  • 色彩系統(tǒng):采用 “無色彩 + 低飽和” 配色方案,以米白為基底,淺灰做區(qū)分,避免色彩干擾居家環(huán)境,讓視覺焦點回歸功能本身。
  • 布局邏輯:左右分欄的 “品牌敘事 + 功能體驗” 雙動線設(shè)計,左側(cè)傳遞產(chǎn)品理念,右側(cè)直接展示操控界面,形成從認(rèn)知到體驗的完整閉環(huán)。
  • 控件設(shè)計:卡片式控件采用圓角 + 微妙陰影的組合,模擬真實家居設(shè)備的質(zhì)感,同時保持界面的呼吸感。
 

2. Skillery 在線教育平臺

  • 視覺層次:通過 “頂部激勵條 + 核心用戶卡片 + 完整榜單” 的三層結(jié)構(gòu),建立清晰的視覺層級,讓用戶第一眼就能抓住核心信息。
  • 游戲化設(shè)計:將學(xué)習(xí)數(shù)據(jù)轉(zhuǎn)化為 “積分、徽章、連續(xù)天數(shù)” 等游戲化元素,并配合 “你離 TOP 10 只差 9 分” 的精準(zhǔn)文案,將數(shù)據(jù)轉(zhuǎn)化為用戶行動的動力。
  • 導(dǎo)航系統(tǒng):側(cè)邊導(dǎo)航采用圖標(biāo) + 文字的極簡設(shè)計,在保證功能完整的同時,最大化釋放主內(nèi)容區(qū)的視覺空間。
 

3. AI 營銷工具系列

  • 材質(zhì)表達:大量運用半透明玻璃態(tài)卡片和柔和漸變,營造輕盈、智能的科技感,與 “AI 驅(qū)動” 的產(chǎn)品定位高度吻合。
  • 流動感布局:采用非對稱懸浮布局,模擬信息在虛擬空間中的流動,直觀體現(xiàn)產(chǎn)品的智能特性,讓抽象的 AI 功能變得可感知。
  • 功能具象化:將復(fù)雜的營銷功能轉(zhuǎn)化為 “Repost products”、“Promote viral advertising” 等直白的行動指令按鈕,降低用戶的理解成本。
 

 

三、對我們的啟發(fā)

 
這些案例印證了我們的設(shè)計理念:好的設(shè)計是商業(yè)目標(biāo)、用戶需求與視覺美感的完美平衡。在未來的項目中,我們將持續(xù)吸收這些優(yōu)秀實踐,為客戶創(chuàng)造更具競爭力的產(chǎn)品體驗。
 

蘭亭妙微(藍(lán)藍(lán)設(shè)計)m.wtxcl.cn 是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計B端界面設(shè)計桌面端界面設(shè)計APP界面設(shè)計圖標(biāo)定制用戶體驗設(shè)計交互設(shè)計UI咨詢高端網(wǎng)站設(shè)計平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。

 

image.png

錯誤時刻的用戶體驗重塑:從危機到信任的轉(zhuǎn)化之道

濤濤 交互設(shè)計及用戶體驗

在產(chǎn)品設(shè)計的語境中,用戶體驗的優(yōu)劣往往不僅取決于正常流程的順暢度,更體現(xiàn)在對 “出錯時刻” 的應(yīng)對能力。當(dāng)用戶遭遇操作失誤、系統(tǒng)故障或信息校驗失敗時,焦慮、無助甚至自責(zé)的情緒會瞬間滋生,這既是產(chǎn)品體驗的 “至暗時刻”,也是流失用戶的高危節(jié)點。然而,多數(shù)產(chǎn)品設(shè)計往往聚焦于優(yōu)化正常場景,卻忽略了這些潛藏的體驗漏洞。事實上,只要用對方法,錯誤時刻完全可以轉(zhuǎn)化為建立用戶信任、強化品牌好感的契機。

智能硬件品牌破局:以價值為核,重塑科技品牌新范式

濤濤

在數(shù)據(jù)呈指數(shù)級增長的智能時代,技術(shù)革新的浪潮正重塑著各行各業(yè)的發(fā)展軌跡。智能硬件作為連接數(shù)字世界與現(xiàn)實生活的關(guān)鍵載體,其品牌形象不僅是產(chǎn)品的視覺符號,更是與用戶建立情感共鳴、傳遞核心價值的重要橋梁。然而,傳統(tǒng)科技品牌往往陷入 “功能至上、風(fēng)格刻板” 的同質(zhì)化困境,如何突破固有范式,打造兼具辨識度與感染力的品牌形象,成為眾多創(chuàng)新企業(yè)的核心課題。Zettlab 的品牌重塑之路,為行業(yè)提供了極具價值的參考范本。

日歷

鏈接

個人資料

存檔