AV免费播放一区二区三区_亚洲综合网第三页_日本一 中文字幕久久综合伊人_麻豆久久久9性大片_日韩av

首頁(yè)

《簡(jiǎn)約至上》 | 簡(jiǎn)化策略:移除、隱藏、組織、位移

杰睿 設(shè)計(jì)思維

  • 交互設(shè)計(jì)新人:幫助建立“做減法”的基本意識(shí)。
  • 產(chǎn)品經(jīng)理:學(xué)會(huì)功能取舍的策略,避免需求堆疊。
  • UI/UX 設(shè)計(jì)師:在簡(jiǎn)化視覺(jué)的同時(shí),理解背后的交互邏輯。
如果你在工作中經(jīng)常遇到“功能太多、界面復(fù)雜”的困境,這本書(shū)會(huì)提供一種務(wù)實(shí)而系統(tǒng)的解決思路。
images.jpeg
在交互設(shè)計(jì)領(lǐng)域,簡(jiǎn)潔與復(fù)雜之間的平衡一直是一個(gè)難題。功能堆疊往往帶來(lái)更多的學(xué)習(xí)成本,而極端“極簡(jiǎn)”又可能犧牲必要的功能完整性。Giles Colborne 在著作 《Simple and Usable: Web, Mobile, and Interaction Design》(中文常譯為《簡(jiǎn)單易用:Web、移動(dòng)與交互設(shè)計(jì)》)中,提出了系統(tǒng)性的解決思路:通過(guò) 移除(Remove)、隱藏(Hide)、組織(Organize)、位移(Displace) 四種策略來(lái)化解復(fù)雜性,讓產(chǎn)品既強(qiáng)大又易用。
這本書(shū)出版多年,卻依舊被推薦為交互設(shè)計(jì)的必讀經(jīng)典,它不僅僅提供方法論,更強(qiáng)調(diào)一種“以用戶(hù)為中心的簡(jiǎn)化哲學(xué)”。下面,我將從四大策略、實(shí)踐價(jià)值以及思維啟發(fā)三個(gè)角度,深入梳理書(shū)中的核心內(nèi)容。

四大簡(jiǎn)化策略

  1. 移除(Remove)
定義:徹底刪除不必要的功能、信息或操作。 價(jià)值:通過(guò)“砍掉”來(lái)減少選擇負(fù)擔(dān),使核心任務(wù)更突出。 案例:像極簡(jiǎn)寫(xiě)作軟件 iA Writer,僅保留文字輸入和導(dǎo)出功能,舍棄復(fù)雜的排版與編輯,使用戶(hù)完全沉浸在寫(xiě)作中。
  1. 隱藏(Hide)
定義:將低頻、復(fù)雜的功能折疊在二級(jí)界面或菜單中,而不是直接呈現(xiàn)。 價(jià)值:保留完整功能的同時(shí),降低初始界面復(fù)雜度。 案例:智能手機(jī)相機(jī)的“更多”模式,將常用功能(拍照、錄像)放在首頁(yè),將專(zhuān)業(yè)模式和濾鏡隱藏在次級(jí)入口。
  1. 組織(Organize)
定義:通過(guò)層級(jí)、分組、標(biāo)簽、視覺(jué)結(jié)構(gòu)來(lái)理清混亂的信息。 價(jià)值:良好的信息架構(gòu)讓用戶(hù)能夠逐步篩選,降低理解和搜索成本。 案例:電商網(wǎng)站的多層級(jí)分類(lèi)體系(如“服飾 > 女裝 > 連衣裙”),幫助用戶(hù)逐步縮小搜索范圍,快速定位目標(biāo)商品。
  1. 位移(Displace)
定義:將復(fù)雜步驟轉(zhuǎn)移到別的地方,甚至完全由系統(tǒng)自動(dòng)完成。 價(jià)值:通過(guò)“轉(zhuǎn)移責(zé)任”,讓用戶(hù)減少操作和決策。 案例:Google Docs 的自動(dòng)保存機(jī)制,把“保存”這個(gè)動(dòng)作移除用戶(hù)流程,讓他們更專(zhuān)注于內(nèi)容創(chuàng)作。
這四個(gè)策略構(gòu)成了一個(gè)完整的方法論:刪減冗余、折疊復(fù)雜、理清結(jié)構(gòu)、分擔(dān)負(fù)擔(dān)。

為什么“簡(jiǎn)單”并不容易?

Colborne 在書(shū)中強(qiáng)調(diào):“簡(jiǎn)單”不是功能少,而是讓用戶(hù)感到輕松。
  • 如果一個(gè)財(cái)務(wù)軟件缺乏報(bào)表功能,用戶(hù)會(huì)覺(jué)得“不完整”;但如果報(bào)表結(jié)構(gòu)清晰、入口合理,即便內(nèi)容復(fù)雜,依然能被感知為“簡(jiǎn)單”。
  • 相反,一個(gè)功能很少的工具,如果流程繁瑣或邏輯模糊,用戶(hù)會(huì)覺(jué)得“麻煩”,而非“簡(jiǎn)潔”。
因此,簡(jiǎn)化的關(guān)鍵不是“減少功能”,而是“降低用戶(hù)的認(rèn)知和操作負(fù)擔(dān)”。

對(duì)實(shí)踐的啟發(fā)

結(jié)合實(shí)際設(shè)計(jì)工作,我總結(jié)了幾個(gè)應(yīng)用場(chǎng)景:
  • 流程設(shè)計(jì):在繪制交互流程圖時(shí),思考哪些步驟可以合并、刪除或轉(zhuǎn)移給系統(tǒng)。
  • 界面布局:核心操作是否在顯眼位置?次要功能是否合理隱藏?
  • 設(shè)計(jì)評(píng)審:不僅關(guān)注界面是否美觀(guān),更要問(wèn)“用戶(hù)在操作時(shí)是否感覺(jué)輕松”。
這些問(wèn)題背后,都對(duì)應(yīng)著書(shū)中提出的四種策略。它們提供了一種“檢視工具”,幫助設(shè)計(jì)師在復(fù)雜的需求中找到取舍的依據(jù)。
在你參與的設(shè)計(jì)或開(kāi)發(fā)中,最常見(jiàn)的“復(fù)雜性”挑戰(zhàn)來(lái)自哪里? 是需求太多?邏輯太亂?還是用戶(hù)群體差異過(guò)大?

蘭亭妙微(m.hglv.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)桌面端界面設(shè)計(jì)APP界面設(shè)計(jì)、圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢(xún)、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

審美積累 | 信息卡片設(shè)計(jì)

杰睿 平面設(shè)計(jì)

《簡(jiǎn)約至上》
核心策略:書(shū)中提出四種簡(jiǎn)化界面的策略:
Remove(移除)
Hide(隱藏)
Organize(組織)
Displace(位移)
在具體的卡片設(shè)計(jì)中如何應(yīng)用?
 
卡片設(shè)計(jì)的 6 個(gè)關(guān)鍵要點(diǎn)
在現(xiàn)代 Web 和移動(dòng)端界面中,卡片(Card UI) 是非常常見(jiàn)的設(shè)計(jì)模式。它能夠把內(nèi)容模塊化、結(jié)構(gòu)化,讓用戶(hù)在瀏覽時(shí)更快獲取關(guān)鍵信息。但卡片設(shè)計(jì)看似簡(jiǎn)單,真正要做得好,需要在細(xì)節(jié)上把握很多要點(diǎn)。
本文總結(jié)了卡片設(shè)計(jì)的六個(gè)關(guān)鍵方面,幫助設(shè)計(jì)師在實(shí)踐中少踩坑。
 
信息層級(jí)清晰
突出主信息:標(biāo)題、圖片或關(guān)鍵數(shù)據(jù)應(yīng)該一眼可見(jiàn)。
避免信息過(guò)載:不要在一張卡片里塞入過(guò)多文本或操作,保證“輕量可掃”。
合理留白:用分隔和留白來(lái)區(qū)分不同信息模塊,讓視覺(jué)呼吸更順暢。
 
視覺(jué)統(tǒng)一性
樣式一致:圓角大小、邊框線(xiàn)條、陰影樣式要統(tǒng)一,避免出現(xiàn)割裂感。
排版統(tǒng)一:在同一列表中保持卡片高度一致,即便內(nèi)容多少不同,也要在視覺(jué)上整齊。
圖片比例統(tǒng)一:統(tǒng)一圖片寬高比例,避免界面錯(cuò)落凌亂。
 
可交互性設(shè)計(jì)
點(diǎn)擊范圍明確:整卡可點(diǎn)還是只有按鈕可點(diǎn)?要有清晰規(guī)則。
交互反饋:點(diǎn)擊、懸浮、加載時(shí)要有視覺(jué)反饋(如陰影變化、顏色高亮)。
層級(jí)感:重要交互按鈕要突出,不應(yīng)被次要元素干擾。
 
響應(yīng)式與適配
自適應(yīng)布局:在不同屏幕尺寸下,卡片能自然換行或縮放。
網(wǎng)格系統(tǒng):通常結(jié)合 2/3/4 列布局,保持卡片整齊排列。
內(nèi)容裁切:注意標(biāo)題或圖片在多端適配時(shí)不會(huì)被裁掉關(guān)鍵信息。
 
強(qiáng)調(diào)可掃描性
模塊化信息:卡片承載的是信息塊,用戶(hù)往往是快速掃視而不是精讀。
視覺(jué)錨點(diǎn):圖片、標(biāo)題、按鈕等應(yīng)構(gòu)成自然的瀏覽動(dòng)線(xiàn)。
一致的閱讀節(jié)奏:避免內(nèi)容結(jié)構(gòu)混亂,破壞用戶(hù)的瀏覽流暢感。
 
性能與加載
懶加載:在電商、資訊流等場(chǎng)景下,大量卡片應(yīng)分批加載,避免一次性過(guò)重。
骨架屏:在加載時(shí)用骨架屏替代空白,提升用戶(hù)對(duì)速度的感知。
 
一張好的卡片應(yīng)該具備:
信息清晰 —— 一眼看到重點(diǎn)。
視覺(jué)統(tǒng)一 —— 風(fēng)格一致,整齊有序。
交互明確 —— 可點(diǎn)區(qū)域和反饋清晰。
適配靈活 —— 多端展示無(wú)壓力。
可快速瀏覽 —— 支持掃視而非精讀。
加載體驗(yàn)好 —— 在內(nèi)容量大時(shí)依然流暢。
? 卡片看似是“小組件”,但它承載的是用戶(hù)對(duì)信息的第一印象。做好卡片設(shè)計(jì),就是在為整體體驗(yàn)加分。

0c57afabd6f4fdc67e272573eabd75ef.jpg

41b3e7c421c0b5163740d0796f95dfeb.jpg

53fab759c1bc3f1c65400c9c89e26f74.jpg

2045f2f982c19e66db6ebd40a8b84b3b.jpg

220565520b90b79a9161b4cf0e7358ed.jpg

a53bcc15a36936226ec0cfea03af3d36.jpg

e7a2886011b7ced85b4fc488d384fb55.jpg

蘭亭妙微(m.hglv.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)、圖標(biāo)定制用戶(hù)體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)UI咨詢(xún)、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

審美積累 | 磨砂藍(lán) | AirLume.Ai

杰睿 平面設(shè)計(jì)

imgi_619_f36c19233665905.68b443a7dc028.png

整體視覺(jué)很現(xiàn)代、科技感強(qiáng),屬于典型的 新一代 SaaS / AI 工具型著陸頁(yè)風(fēng)格
  1. 版式(Layout)
  • 整體結(jié)構(gòu):采用 縱向單頁(yè)滾動(dòng)式結(jié)構(gòu)(Landing Page 常見(jiàn)模式),用戶(hù)可以順序獲取產(chǎn)品賣(mài)點(diǎn)、功能點(diǎn)、用戶(hù)評(píng)價(jià)和轉(zhuǎn)化按鈕。
  • 模塊化清晰:首屏價(jià)值主張 → 功能介紹 → 積分體系 → 工作流程 → 用戶(hù)評(píng)價(jià) → CTA(再次引導(dǎo)轉(zhuǎn)化)。這是一條典型的 用戶(hù)認(rèn)知—說(shuō)服—轉(zhuǎn)化路徑。
  • 對(duì)齊方式:中軸對(duì)齊為主,輔以?xún)蓚?cè)分欄(如功能點(diǎn)卡片區(qū)),保證了頁(yè)面整體統(tǒng)一感和閱讀節(jié)奏。
  • 留白運(yùn)用:上下模塊之間保持了較大留白,避免信息堆疊,讓用戶(hù)滾動(dòng)時(shí)感到輕松、不壓迫。

  1. 色彩(Color Palette)
  • 主色:深藍(lán)到紫色的漸變,帶來(lái) 科技感、信賴(lài)感,也貼合 AI / 智能搜索的品牌定位。
  • 點(diǎn)綴色:白色(清爽背景)、亮藍(lán)色按鈕、淺灰輔助背景。整體配色清晰,層次分明。
  • 高亮元素:價(jià)格卡片、按鈕等采用明亮藍(lán)/紫光暈效果,突出“點(diǎn)擊感”和可交互性。
  • 氛圍感:漸變與光效(如首屏小火箭、發(fā)光邊框)讓頁(yè)面呈現(xiàn)未來(lái)感,但沒(méi)有過(guò)度炫技,保持了商業(yè)友好。

  1. 字體(Typography)
  • 字體風(fēng)格:無(wú)襯線(xiàn)體,簡(jiǎn)潔、現(xiàn)代,符合科技與 SaaS 產(chǎn)品調(diào)性。
  • 層級(jí)區(qū)分
    • 標(biāo)題(H1/H2)字重更粗,字號(hào)大,常用白色或深藍(lán)對(duì)比背景,突出信息重點(diǎn)。
    • 副標(biāo)題和描述文案字體偏細(xì),字號(hào)適中,保證信息量承載。
    • 按鈕和關(guān)鍵數(shù)字(如“13,200 points”)字體更大更顯眼,強(qiáng)調(diào)可操作性與利益點(diǎn)。
  • 可讀性:字距、行距控制合理,配合留白,整體閱讀體驗(yàn)流暢。

  1. 組塊(Content Blocks)
  • 首屏(Hero Section):大標(biāo)題(價(jià)值主張)+ 動(dòng)效圖標(biāo)(火箭)+ CTA 按鈕,立即傳達(dá)核心價(jià)值“Save Time & Money”。
  • 功能區(qū)(Features):采用 網(wǎng)格卡片布局(兩行四列),每張卡片有圖標(biāo)+標(biāo)題+簡(jiǎn)述,信息可快速掃描。
  • 積分體系(Loyalty Points):通過(guò)圖表、數(shù)字、視覺(jué)對(duì)比展示收益機(jī)制,強(qiáng)化“用得越多越省錢(qián)”的心理暗示。
  • 流程區(qū)(How it Works):采用 分步卡片(Step 01, Step 02…),降低用戶(hù)認(rèn)知負(fù)擔(dān)。
  • 用戶(hù)評(píng)價(jià)(Testimonials):引用式卡片+用戶(hù)頭像/星級(jí),增強(qiáng)信任感。
  • 尾部 CTA(Call-to-Action):再次強(qiáng)化“開(kāi)始 AI 搜索”的操作,典型轉(zhuǎn)化閉環(huán)設(shè)計(jì)。
  • 頁(yè)腳(Footer):品牌 Logo、導(dǎo)航菜單、社交媒體鏈接,保證完整性。

蘭亭妙微(m.hglv.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)、圖標(biāo)定制用戶(hù)體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)UI咨詢(xún)高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

用戶(hù)體驗(yàn)設(shè)計(jì) | 醫(yī)療界面的可訪(fǎng)問(wèn)性與多用戶(hù)群體設(shè)計(jì)研究

杰睿 用戶(hù)研究

在數(shù)字化醫(yī)療飛速發(fā)展的當(dāng)下,醫(yī)療界面已成為醫(yī)患交互、健康數(shù)據(jù)管理的核心載體。然而,當(dāng)前許多醫(yī)療界面設(shè)計(jì)存在 “通用性缺失” 問(wèn)題,忽略了老年群體、殘障患者、基層醫(yī)護(hù)人員等不同用戶(hù)的特殊需求,導(dǎo)致可訪(fǎng)問(wèn)性不足,不僅影響用戶(hù)體驗(yàn),更可能延誤醫(yī)療服務(wù)效率與質(zhì)量。本文將從醫(yī)療界面可訪(fǎng)問(wèn)性的核心價(jià)值出發(fā),結(jié)合多用戶(hù)群體特征分析,探討設(shè)計(jì)原則、實(shí)踐案例與技術(shù)支撐,為醫(yī)療數(shù)字化產(chǎn)品開(kāi)發(fā)者提供參考。

一、醫(yī)療界面可訪(fǎng)問(wèn)性:不止于 “可用”,更要 “易用”

醫(yī)療界面的可訪(fǎng)問(wèn)性,并非簡(jiǎn)單滿(mǎn)足 “能打開(kāi)、能操作” 的基礎(chǔ)需求,而是要確保所有用戶(hù)(無(wú)論身體機(jī)能、技術(shù)水平如何)都能平等、高效地獲取醫(yī)療服務(wù)。根據(jù)世界衛(wèi)生組織統(tǒng)計(jì),全球約有 10 億殘障人士,且 60 歲以上老年人口占比持續(xù)上升,這類(lèi)群體在視力、聽(tīng)力、運(yùn)動(dòng)能力、認(rèn)知水平上的差異,對(duì)醫(yī)療界面提出了更高要求。
  1. 可訪(fǎng)問(wèn)性的核心痛點(diǎn)
  • 視力障礙用戶(hù):傳統(tǒng)醫(yī)療 APP 的小字體、低對(duì)比度界面,導(dǎo)致視障患者無(wú)法讀取檢查報(bào)告、用藥提醒;
  • 聽(tīng)力障礙用戶(hù):在線(xiàn)問(wèn)診時(shí)缺乏實(shí)時(shí)字幕功能,難以準(zhǔn)確理解醫(yī)生指導(dǎo);
  • 老年用戶(hù):復(fù)雜的操作流程(如多步注冊(cè)、隱藏式功能按鈕)、專(zhuān)業(yè)術(shù)語(yǔ)堆砌的界面,增加了使用門(mén)檻;
  • 基層醫(yī)護(hù)人員:在緊急場(chǎng)景下(如急救時(shí)調(diào)取患者病史),界面響應(yīng)延遲、信息層級(jí)混亂,可能影響救治效率。
  1. 可訪(fǎng)問(wèn)性的設(shè)計(jì)底線(xiàn)
依據(jù)《Web 內(nèi)容無(wú)障礙指南(WCAG)2.1》及醫(yī)療行業(yè)相關(guān)標(biāo)準(zhǔn),醫(yī)療界面需滿(mǎn)足以下基礎(chǔ)要求:
  • 感知性:支持字體放大(最大至默認(rèn)尺寸 200% 無(wú)錯(cuò)位)、高對(duì)比度模式(如黑底白字、黃底黑字),音頻內(nèi)容需配備字幕;
  • 可操作性:所有功能支持鍵盤(pán)導(dǎo)航(無(wú)鼠標(biāo)也能完成操作),按鈕尺寸不小于 44×44px(適配老年用戶(hù)或運(yùn)動(dòng)障礙用戶(hù)的精準(zhǔn)點(diǎn)擊);
  • 可理解性:界面術(shù)語(yǔ)需搭配通俗解釋?zhuān)ㄈ?“舒張壓” 后標(biāo)注 “低壓”),操作錯(cuò)誤時(shí)提供明確的糾錯(cuò)提示(如 “請(qǐng)輸入 11 位手機(jī)號(hào)” 而非 “格式錯(cuò)誤”);
  • 魯棒性:兼容主流輔助技術(shù)(如屏幕閱讀器 NVDA、語(yǔ)音輸入工具訊飛語(yǔ)記),避免因?yàn)g覽器或設(shè)備差異導(dǎo)致功能失效。

二、多用戶(hù)群體需求分析:從 “千人一面” 到 “千人千面”

醫(yī)療界面的用戶(hù)涵蓋患者(含特殊群體)、醫(yī)護(hù)人員、管理人員等,不同群體的使用場(chǎng)景與需求差異顯著,需通過(guò) “分層設(shè)計(jì)” 實(shí)現(xiàn)精準(zhǔn)適配。
  1. 患者群體:以 “便捷性” 和 “安全感” 為核心

(1)老年患者與殘障患者

  • 需求重點(diǎn):簡(jiǎn)化操作、降低認(rèn)知負(fù)荷、信息可視化;
  • 設(shè)計(jì)方案
    • 首頁(yè)僅保留核心功能(如 “我的問(wèn)診”“用藥提醒”“在線(xiàn)掛號(hào)”),隱藏非高頻功能(如 “健康資訊”“積分商城”);
    • 用藥提醒采用 “文字 + 語(yǔ)音 + 圖標(biāo)” 三重提示(如 “每日 9 點(diǎn)服用降壓藥” 搭配鬧鐘圖標(biāo)與語(yǔ)音播報(bào));
    • 檢查報(bào)告用圖表替代純文字(如用折線(xiàn)圖展示血糖變化趨勢(shì),標(biāo)注 “正常范圍” 區(qū)間)。

(2)慢性病患者

  • 需求重點(diǎn):數(shù)據(jù)記錄便捷、長(zhǎng)期跟蹤、醫(yī)患互動(dòng)高效;
  • 設(shè)計(jì)方案
    • 支持語(yǔ)音輸入或拍照上傳數(shù)據(jù)(如拍攝血糖儀數(shù)值自動(dòng)識(shí)別并記錄);
    • 提供 “家庭共享” 功能(如子女可遠(yuǎn)程查看父母的用藥記錄,接收異常數(shù)據(jù)提醒);
    • 問(wèn)診時(shí)自動(dòng)同步歷史數(shù)據(jù)(如醫(yī)生可直接查看患者近 3 個(gè)月的血壓變化,無(wú)需手動(dòng)上傳)。
  1. 醫(yī)護(hù)人員群體:以 “高效性” 和 “準(zhǔn)確性” 為核心

(1)門(mén)診醫(yī)生

  • 需求重點(diǎn):快速調(diào)取患者信息、簡(jiǎn)化病歷錄入、減少重復(fù)操作;
  • 設(shè)計(jì)方案
    • 患者就診時(shí),界面自動(dòng)彈出歷史病歷、過(guò)敏史、用藥禁忌(無(wú)需多頁(yè)面切換);
    • 支持模板化病歷輸入(如選擇 “感冒” 模板,自動(dòng)填充常見(jiàn)癥狀與用藥建議,醫(yī)生僅需修改個(gè)性化內(nèi)容);
    • 處方開(kāi)具時(shí),系統(tǒng)自動(dòng)校驗(yàn)藥物相互作用(如提示 “阿司匹林與布洛芬不宜同服”)。

(2)急救醫(yī)護(hù)人員

  • 需求重點(diǎn):極速響應(yīng)、關(guān)鍵信息優(yōu)先展示;
  • 設(shè)計(jì)方案
    • 緊急模式下,界面自動(dòng)屏蔽非必要通知,僅保留 “患者定位”“病史調(diào)取”“急救指導(dǎo)” 功能;
    • 首頁(yè)突出顯示患者關(guān)鍵信息(如 “血型:A 型”“過(guò)敏史:青霉素”),字體放大至默認(rèn)尺寸 150%;
    • 支持離線(xiàn)緩存數(shù)據(jù)(避免網(wǎng)絡(luò)信號(hào)差時(shí)無(wú)法訪(fǎng)問(wèn)患者信息)。

三、實(shí)踐案例:可訪(fǎng)問(wèn)性設(shè)計(jì)如何落地?

以國(guó)內(nèi)某三甲醫(yī)院的 “智慧醫(yī)療 APP” 為例,其通過(guò)多輪用戶(hù)測(cè)試與迭代,實(shí)現(xiàn)了可訪(fǎng)問(wèn)性與多群體適配的平衡,上線(xiàn)后老年用戶(hù)使用率提升 40%,醫(yī)護(hù)人員病歷錄入效率提升 30%。
  1. 關(guān)鍵設(shè)計(jì)亮點(diǎn)
  • “長(zhǎng)輩模式” 專(zhuān)項(xiàng)優(yōu)化
    • 字體放大至默認(rèn)尺寸 180%,按鈕間距增加 50%;
    • 去除所有廣告彈窗與復(fù)雜動(dòng)畫(huà),界面響應(yīng)速度提升至 0.5 秒內(nèi);
    • 內(nèi)置 “語(yǔ)音助手”,支持 “打開(kāi)掛號(hào)頁(yè)面”“撥打醫(yī)生電話(huà)” 等語(yǔ)音指令。
  • 輔助功能適配
    • 兼容屏幕閱讀器,所有圖片均添加描述文本(如 “心電圖報(bào)告:心率 75 次 / 分,正常”);
    • 支持色盲模式(如紅綠色盲用戶(hù)可切換為 “藍(lán)黃色調(diào)”,避免因顏色標(biāo)識(shí)錯(cuò)誤導(dǎo)致用藥失誤)。
  • 醫(yī)護(hù)端 “場(chǎng)景化設(shè)計(jì)”
    • 門(mén)診醫(yī)生端:患者列表按 “就診順序” 排序,點(diǎn)擊患者姓名即可展開(kāi) “病歷 - 檢查 - 處方” 一體化視圖;
    • 急救端:通過(guò) NFC 技術(shù),手機(jī)貼近患者手環(huán)即可快速讀取病史(無(wú)需手動(dòng)輸入 ID)。
  1. 落地挑戰(zhàn)與解決方案
  • 挑戰(zhàn) 1:可訪(fǎng)問(wèn)性設(shè)計(jì)與界面美觀(guān)的平衡(如高對(duì)比度模式可能導(dǎo)致界面 “單調(diào)”);
    • 解決方案:提供 “多套主題”(如默認(rèn)主題、長(zhǎng)輩主題、高對(duì)比度主題),用戶(hù)可自主切換,同時(shí)確保所有主題的視覺(jué)風(fēng)格統(tǒng)一。
  • 挑戰(zhàn) 2:多群體需求沖突(如患者需要簡(jiǎn)化界面,而管理人員需要復(fù)雜的數(shù)據(jù)統(tǒng)計(jì)功能);
    • 解決方案:采用 “角色權(quán)限控制”,不同用戶(hù)登錄后展示對(duì)應(yīng)功能界面(如患者登錄看不到 “科室營(yíng)收統(tǒng)計(jì)”,管理人員登錄可查看全維度數(shù)據(jù))。

四、技術(shù)支撐:讓可訪(fǎng)問(wèn)性設(shè)計(jì) “有據(jù)可依”

醫(yī)療界面的可訪(fǎng)問(wèn)性與多群體適配,需依托技術(shù)工具實(shí)現(xiàn) “設(shè)計(jì) - 測(cè)試 - 優(yōu)化” 的閉環(huán)。
  1. 設(shè)計(jì)階段:工具提升效率
  • Figma 插件:使用 “Accessibility Insights” 自動(dòng)檢測(cè)界面對(duì)比度是否達(dá)標(biāo)、按鈕尺寸是否符合要求;
  • 組件庫(kù)建設(shè):搭建 “醫(yī)療無(wú)障礙組件庫(kù)”,包含大尺寸按鈕、高對(duì)比度輸入框、語(yǔ)音提示組件等,確保各頁(yè)面設(shè)計(jì)一致性。
  1. 測(cè)試階段:覆蓋全用戶(hù)場(chǎng)景
  • 自動(dòng)化測(cè)試:使用 Selenium+Axe-core 框架,批量檢測(cè)界面是否支持鍵盤(pán)導(dǎo)航、輔助技術(shù)適配;
  • 用戶(hù)實(shí)測(cè):邀請(qǐng)老年用戶(hù)、殘障用戶(hù)、醫(yī)護(hù)人員參與測(cè)試,采用 “任務(wù)完成率”“操作時(shí)長(zhǎng)”“錯(cuò)誤次數(shù)” 等指標(biāo)評(píng)估設(shè)計(jì)效果(如要求老年用戶(hù)完成 “掛號(hào)” 任務(wù),記錄平均操作時(shí)長(zhǎng)與失敗原因)。
  1. 優(yōu)化階段:數(shù)據(jù)驅(qū)動(dòng)迭代
  • 埋點(diǎn)分析:在界面中埋點(diǎn)統(tǒng)計(jì) “功能點(diǎn)擊量”“頁(yè)面停留時(shí)間”“操作錯(cuò)誤率”,識(shí)別高頻使用功能與痛點(diǎn)功能(如某按鈕錯(cuò)誤點(diǎn)擊率高,可能是尺寸過(guò)小或位置不合理);
  • 版本迭代:根據(jù)測(cè)試數(shù)據(jù)與用戶(hù)反饋,每 2 周發(fā)布一次小版本更新,優(yōu)先優(yōu)化高優(yōu)先級(jí)問(wèn)題(如急救端數(shù)據(jù)加載延遲、視障用戶(hù)無(wú)法讀取報(bào)告)。

五、未來(lái)趨勢(shì):從 “無(wú)障礙” 到 “全包容”

隨著醫(yī)療數(shù)字化的深入,醫(yī)療界面設(shè)計(jì)將從 “滿(mǎn)足基礎(chǔ)可訪(fǎng)問(wèn)性” 向 “全包容設(shè)計(jì)” 演進(jìn):
  • AI 個(gè)性化適配:通過(guò) AI 分析用戶(hù)行為(如老年用戶(hù)常用語(yǔ)音輸入),自動(dòng)調(diào)整界面設(shè)置(如登錄后默認(rèn)切換至長(zhǎng)輩模式);
  • 跨設(shè)備協(xié)同:實(shí)現(xiàn) “手機(jī) - 平板 - 醫(yī)療設(shè)備” 的無(wú)縫銜接(如血糖儀數(shù)據(jù)自動(dòng)同步至手機(jī) APP,醫(yī)生在平板上可實(shí)時(shí)查看);
  • 倫理與隱私保障:在設(shè)計(jì)可訪(fǎng)問(wèn)性功能時(shí),需兼顧數(shù)據(jù)安全(如語(yǔ)音輸入的健康數(shù)據(jù)需加密存儲(chǔ),避免泄露)。
 
醫(yī)療界面的可訪(fǎng)問(wèn)性與多用戶(hù)群體設(shè)計(jì),不僅是技術(shù)問(wèn)題,更是 “以人為本” 的醫(yī)療服務(wù)理念的體現(xiàn)。對(duì)于開(kāi)發(fā)者而言,需跳出 “以健康人群為中心” 的固有思維,充分考慮不同用戶(hù)的生理、心理與場(chǎng)景差異,通過(guò) “需求分層、設(shè)計(jì)適配、技術(shù)支撐”,讓每一位用戶(hù)都能平等享受數(shù)字化醫(yī)療的便利。未來(lái),隨著技術(shù)的進(jìn)步與標(biāo)準(zhǔn)的完善,“全包容” 的醫(yī)療界面將成為行業(yè)常態(tài),為構(gòu)建更公平、高效的醫(yī)療體系奠定基礎(chǔ)。
 

蘭亭妙微(m.hglv.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢(xún)、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

AI 時(shí)代的用戶(hù)體驗(yàn)設(shè)計(jì):設(shè)計(jì)師會(huì)被替代,還是更值錢(qián)?

杰睿 行業(yè)趨勢(shì)

近兩年,生成式 AI 席卷了整個(gè)設(shè)計(jì)圈。有人感到興奮:再也不用從 0 開(kāi)始畫(huà)界面了;有人則擔(dān)憂(yōu):設(shè)計(jì)師是不是遲早會(huì)被替代? 尤其是做用戶(hù)體驗(yàn)設(shè)計(jì)(UX Design)的同學(xué),經(jīng)常會(huì)問(wèn)自己:AI 會(huì)讓我們失業(yè),還是會(huì)讓我們更值錢(qián)?
今天我嘗試從三個(gè)角度聊聊這個(gè)問(wèn)題:AI 在設(shè)計(jì)環(huán)節(jié)的作用、用戶(hù)體驗(yàn)設(shè)計(jì)的本質(zhì)、以及設(shè)計(jì)師的價(jià)值升級(jí)。

一、AI 到底能取代哪些工作?

我們先承認(rèn)一個(gè)現(xiàn)實(shí):AI 確實(shí)能做掉一部分重復(fù)性、低門(mén)檻的設(shè)計(jì)工作。
視覺(jué)稿:輸入一句話(huà),AI 就能給你 10 套界面方案。
流程優(yōu)化:AI 可以根據(jù)常見(jiàn)模式,自動(dòng)生成標(biāo)準(zhǔn)化流程。
測(cè)試反饋:AI 可以模擬用戶(hù)點(diǎn)擊,快速發(fā)現(xiàn)流程瓶頸。
這些工作過(guò)去可能要一個(gè)新人花兩三天,現(xiàn)在 AI 幾分鐘就能完成。
所以,如果一個(gè)設(shè)計(jì)師的工作主要停留在“工具層面”,那確實(shí)危險(xiǎn)。

二、用戶(hù)體驗(yàn)設(shè)計(jì)的本質(zhì)是什么?

但問(wèn)題來(lái)了,UX 設(shè)計(jì)的核心價(jià)值從來(lái)不是“畫(huà)界面”。 它更接近三個(gè)關(guān)鍵詞:
理解用戶(hù):洞察真實(shí)的痛點(diǎn),而不是想當(dāng)然地堆功能。
設(shè)計(jì)邏輯:通過(guò)信息架構(gòu)、交互流程,讓產(chǎn)品自然可用。
場(chǎng)景整合:把體驗(yàn)放到完整的用戶(hù)旅程里,而不是某一屏。
AI 再聰明,也需要人類(lèi)告訴它:
哪些問(wèn)題值得解決?
哪些體驗(yàn)更貼近用戶(hù)心智?
哪些約束(商業(yè)、技術(shù)、倫理)是必須考慮的?
這就像自動(dòng)駕駛:AI 可以幫你控制方向盤(pán),但“去哪兒”還是要人來(lái)決定。

三、設(shè)計(jì)師會(huì)更值錢(qián)的三個(gè)方向

那么,在 AI 時(shí)代,什么樣的 UX 設(shè)計(jì)師反而會(huì)更有價(jià)值?我總結(jié)了三點(diǎn):
更懂業(yè)務(wù)
  1.   不只是畫(huà)好看、好用的界面,而是能和產(chǎn)品經(jīng)理、運(yùn)營(yíng)、市場(chǎng)一起思考: 這個(gè)功能能不能提升轉(zhuǎn)化?這個(gè)流程能不能降低成本?
  1.   能把體驗(yàn)和商業(yè)目標(biāo)結(jié)合的人,AI 很難取代。
更懂用戶(hù)
  1.   會(huì)做用戶(hù)研究,會(huì)用數(shù)據(jù)和洞察驅(qū)動(dòng)設(shè)計(jì)決策。
  1.   AI 可以生成方案,但無(wú)法真正“共情”用戶(hù)。
更懂系統(tǒng)
  1.   能構(gòu)建設(shè)計(jì)系統(tǒng)、制定規(guī)范,指導(dǎo)團(tuán)隊(duì)和 AI 工具一起產(chǎn)出。
  1.   未來(lái)的設(shè)計(jì)師更像“體驗(yàn)架構(gòu)師”,而不是“美工”。

蘭亭妙微(m.hglv.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)交互設(shè)計(jì)、UI咨詢(xún)高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

原創(chuàng)案例分享 | B端界面設(shè)計(jì) | 教育類(lèi)個(gè)人報(bào)告

杰睿 B端ui設(shè)計(jì)文章及欣賞

113.png

113備份 2.png

113備份.png

這是一款專(zhuān)注于為高中生提供精準(zhǔn)、高效、個(gè)性化選科決策輔助的在線(xiàn)系統(tǒng)。通過(guò)整合多維度數(shù)據(jù)資源和運(yùn)用智能算法,將復(fù)雜的選科信息以直觀(guān)、簡(jiǎn)潔、易懂的交互界面呈現(xiàn)給用戶(hù)。
采用模塊化的布局方式,將不同的功能區(qū)域進(jìn)行明確劃分,如柱狀圖、餅圖、折線(xiàn)圖等。這些圖形圖表以淺藍(lán)色為主色調(diào)進(jìn)行設(shè)計(jì),并搭配適當(dāng)?shù)念伾珜?duì)比和標(biāo)注,使數(shù)據(jù)更加直觀(guān)、形象、易于理解,幫助用戶(hù)快速洞察數(shù)據(jù)背后的信息和趨勢(shì),為選科決策提供有力的數(shù)據(jù)支持。
 

蘭亭妙微(m.hglv.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)交互設(shè)計(jì)、UI咨詢(xún)高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

審美積累 | 金融類(lèi) SaaS 產(chǎn)品落地頁(yè)設(shè)計(jì)

杰睿 行業(yè)趨勢(shì)

視覺(jué)風(fēng)格

imgi_149_54479b227260621.683d51861bbda.png

imgi_1146_b66b9d227260621.683d51861c35a.png

imgi_1148_7a2611227260621.683d51861b045.png

imgi_1150_813cf9227260621.683d51861cd40.png

imgi_1151_7d5e0a227260621.683d51861b4ab.png

色彩系統(tǒng)
  1.   主色調(diào):藍(lán)色(#2563eb 左右)→ 傳遞專(zhuān)業(yè)、信任、安全感。
  1.   輔助色:綠色(成功/正向)、紫色(現(xiàn)代科技感)、黃色(提醒)。
  1.   大面積留白 → 保持呼吸感和簡(jiǎn)潔度,讓信息有清晰的層次。
  1.   漸變色塊(藍(lán)紫漸變、綠色漸變) → 增強(qiáng)科技感和未來(lái)感。
排版
  1.   標(biāo)題:黑色/深灰 + 關(guān)鍵詞高亮藍(lán)色(“Financial”)→ 強(qiáng)調(diào)重點(diǎn),視覺(jué)節(jié)奏感強(qiáng)。
  1.   字體:無(wú)襯線(xiàn),圓潤(rùn)現(xiàn)代 → 親和但保持專(zhuān)業(yè)感。
  1.   字重層級(jí)明顯(粗體標(biāo)題 + 中等正文),增強(qiáng)信息層次。
圖形語(yǔ)言
  1.   卡片式布局 → 每個(gè)功能點(diǎn)都以卡片承載,模塊化、清晰可點(diǎn)擊。
  1.   圓角極大化(按鈕、卡片、圖表) → 減少金融產(chǎn)品的“冷感”,更易親近。
  1.   圖標(biāo)/插畫(huà) → 輕量、簡(jiǎn)潔,帶點(diǎn)擬物投影(增強(qiáng)真實(shí)感)。

交互與信息結(jié)構(gòu)
模塊化區(qū)塊
  1.   Hero 區(qū):大標(biāo)題 + 產(chǎn)品截圖 → 直接傳達(dá)核心價(jià)值(Maximize your financial potential)。
  1.   信任背書(shū):評(píng)分展示 → 快速建立信任感。
  1.   功能介紹:圖文搭配(Analytics、Expense、Send Money)→ 以可視化方式分塊展示。
  1.   行動(dòng)召喚(CTA) → “Get Started”“Watch a Demo” 多次重復(fù),降低用戶(hù)流失。
視覺(jué)引導(dǎo)
  1.   關(guān)鍵詞藍(lán)色高亮 → 引導(dǎo)閱讀路徑。
  1.   圖表與數(shù)據(jù)示例 → 讓金融工具更具象,降低抽象感。
  1.   卡片顏色差異(紫色、綠色、深藍(lán)) → 形成節(jié)奏和重點(diǎn)感。

設(shè)計(jì)語(yǔ)言關(guān)鍵詞
現(xiàn)代(Modern):極簡(jiǎn)無(wú)襯線(xiàn)字體 + 大面積留白 + 漸變色塊。
可信(Trustworthy):藍(lán)色為主色調(diào) + 用戶(hù)評(píng)分背書(shū)。
友好(Friendly):圓角 + 卡片化設(shè)計(jì) + 簡(jiǎn)潔插畫(huà)。
科技感(Tech-savvy):漸變、數(shù)據(jù)可視化、模塊化信息層次。
行動(dòng)驅(qū)動(dòng)(Conversion-driven):多個(gè) CTA 按鈕(Get Started、Watch a Demo),顏色對(duì)比強(qiáng)烈。

蘭亭妙微(m.hglv.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)、圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)交互設(shè)計(jì)、UI咨詢(xún)高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。我們建立了一個(gè)微信群,每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì),有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng),咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

日歷

鏈接

個(gè)人資料

存檔