让健康服务的入口，清楚地出现在需要它的地方。

兰亭妙微专注 UI 与用户体验设计，持续关注国内外优秀作品，分享界面设计与交互思路，进行设计审美积累。今天分享 Docuverse，一组将医生发现、预约咨询与 AI 健康助手结合起来的服务设计。医生、内容和个人待办共同构成首页。
一、项目背景：为多种健康需求找到清楚入口
选择专科、查看医生、安排咨询与记录日常分别对应不同目的。Docuverse 通过分类与卡片整理这些服务，让用户先找到方向，再查看信息并进入下一步。     

图 1  服务首页与医生分类

医生分类、健康更新与预约信息在白色首页中各自成组，绿色卡片突出部分服务入口。内容虽然丰富，空间与分组仍然清楚，浏览方向从服务目录延伸到个人安排。

图 2  医生资料与预约入口

人物照片让医生有了清楚识别，姓名、价格与日程依次补充预约所需信息。资料与主要动作处在同一连续页面里，专业信息的阅读自然接向时间选择与联系。

二、设计策略：用亲和视觉组织多种服务
①信息架构：首页分配医生分类、预约与健康更新，详情页集中呈现医生资料，助手页承接具体任务。②视觉语言：白底、绿色强调与人物摄影共同建立亲近感，统一卡片维持页面秩序。

Docuverse AI Healthcare | 界面细节与设计启发     

图 3  健康助手与具体任务入口

助手页先呈现用药提醒、健身建议等任务卡片，再提供提问入口。白色空间与绿色强调延续首页语言，让 AI 助手与常规服务保持相近的使用语境。

图 4  结果展示与咨询衔接

人体示意、指标条与状态文字将结果排成可扫读的结构，下方联系医生的动作补上后续路径。这张设计示意值得观察的是图形与文字的层级，以及信息如何接向服务。

③场景化交互：医生资料靠近日程与预约动作，助手先给出用药提醒等任务入口，再承接提问；结果示意页补充联系医生的路径。界面围绕需求逐步展开，让服务之间有可理解的衔接。

三、设计启发：服务丰富时，清楚的分工也能带来安心感
分类帮助定位，人物资料补充认识，主按钮给出行动方向。做健康或其他专业服务产品时，值得积累的是这种把复杂服务转成易识别入口的组织方式。图中的健康指标属于界面示意，赏析重点在信息呈现。

如有医疗健康、在线预约类 App的 UI/UX 设计需求，欢迎联系兰亭妙微，交流产品场景与设计需求。

兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。

本篇聚焦设计规划：从需求到设计草图完整实操链路，讲解信息架构、导航、任务流程、原型输出、设计验证全套落地方法，兼顾理性架构规划与感性情感化设计。

本文从心态、工作方式、职业选择、个人成长角度，列出 UX 设计师应当舍弃的 13 种思维与行为习惯，不只讲专业技能，更多关注设计师职业心态与自我成长。

后台界面经常不是画完就结束。表格字段会调整，按钮的权限条件会变化，讨论过的取舍也可能隔几周又被重新问起。Figma在10月15日介绍了Specs，尝试把文字说明、画布上的设计和协作讨论放在一起。比起把它当成又一个写文档的入口，我们更在意设计决定怎样留在相关页面旁边。这篇借官方配图作为阅读入口，再用假设的设备管理后台聊聊说明与界面一起维护的方法。

设备界面在演示中运行得很顺，进入真实环境以后却可能遇到连接中断、任务暂停、参数尚未保存等变化。这些情况如果在交付时只靠一句口头说明，设计和实现就容易出现不同理解。Qt Group在10月23日的文章中讨论了明确规格与可检查结果的重要性。我们把这个话题延伸到Qt设备界面交付，用一套假设的实验室任务终端分享设计观察。配图全部是AI概念示意，不是Qt官方案例或已实现的产品。

仓储调度页面常常同时放着库存、订单、车辆和异常提醒，信息很多，使用者打开页面却未必知道先处理哪一项。10月6日，dpopstudio用WareApp设计套件介绍了仓储与发运界面的组织方式。这次借它的真实UI配图，分享我们对任务、状态和上下文的观察，并补充一张AI调度界面示意。文中的仓库任务均为说明设计判断而设想的场景，不是对这套模板或已上线系统的实测。

表格页面的难点，通常从放进真实内容以后才开始显现：名称有长有短，状态不止两种，筛选以后还要继续处理。dpopstudio在10月20日分享了Datchs后台的布局与状态设计，配图可以作为观察信息密度的入口。这里不沿用文中的效率数字或固定尺寸结论，而是结合假设的企业客户管理任务，分享几种值得带回设计评审的问题。其中的表格操作示意为另行生成的AI概念图。

同一套医疗后台，资料整理人员在追补附件，审核人员在核对内容，管理员在处理权限。如果首页给所有人同样的菜单，重要任务就容易埋进许多入口里。Anna Nazarevska在11月2日的文章中，把角色差异放回责任和决定的后果来讨论。这个切入点值得分享。下面以一套假设的医院材料审核系统为例，聊聊我们的界面设计观察；配图为AI概念示意，不对应原作者项目，也不涉及诊疗判断。

一、什么是网页设计中的粗野主义？

兰亭妙微ui设计公司分享：粗野主义（Brutalism）起源于建筑领域，是一种崇尚原始粗粝、反传统审美的设计风格，优先强调功能价值，弱化装饰表达，常常运用极具张力的排版、非对称布局与高冲突对比色彩。

“Brutalism” 一词源自法语 béton brut，释义为裸露混凝土 / 清水混凝土，指代不加修饰、直接外露的混凝土材质表面。该概念最早用来描述 20 世纪 40‑50 年代兴起于英国的建筑流派。粗野主义建筑以裸露的混凝土结构、硬朗几何形体、保留材料原生质感为标志性特征，在 50 至 70 年代风靡全球。

粗野主义本身是偏向原始、极简的设计取向，重功能大于形式美感，在布局与 UI 处理上常常近乎极简。它是对视觉表达大胆又反常规的演绎，很难被条条框框完全定义 —— 它的内核本就是打破固有范式。

和很多设计潮流一样，粗野主义是对前代风格的反叛：意在挣脱过去繁复浮华的设计枷锁。

二、粗野主义为何会在网页设计领域兴起？

互联网早期网页优先满足基础功能与内容输出，简陋原生的 HTML 页面、90 年代大胆直白的网页审美，在精神内核上，恰好呼应粗野主义建筑暴露结构、追求实用的特质。

随着行业发展，现代主流网页大多走向布局规整、重视用户体验、考究色彩美学的成熟范式。但审美与需求本就多元，当主流设计占据主流，也为粗野主义的生长留出了空间。

有观点认为：主流网页精致顺滑的视觉体验，容易构建一层美化后的假象，掩盖网站背后潜在的立场与目的。粗野主义网页的流行，某种程度上寄托了大众对互联网透明化、表达直白化的期待。如同粗野主义建筑坦然展露建筑材料与社会思考，这类网站希望自身底层逻辑与真实意图可以被用户一眼看见。

三、粗野主义网页设计核心特征

1. 打破常规的色彩搭配

建筑领域的粗野主义偏爱灰、黑、棕这类冷静沉郁的色调；而网页端的粗野主义与之不同，敢于使用刺眼、相互碰撞的配色，刻意背离通用网页色彩理论与主流审美。

“我们不必强迫眼睛所见的一切都趋于完美。”

2. 反标准化导航与信息层级

常规 UI/UX 设计，会搭建清晰的信息层级、遵循通用导航逻辑，降低用户认知负担，提升浏览效率。粗野主义则反其道而行，采用非常规导航模式，以粗犷直白的方式呈现信息。

3. 回归原始粗粝的设计内核

从排版布局到色彩方案，粗野主义网页刻意保留未经打磨的原生质感。设计灵感溯源至中期粗野主义建筑：不刻意修饰，坦然展现混凝土原生肌理。

它复刻了互联网早期未经过度美化的网页样貌，是对当下主流网页审美取向的逆向表达：舍弃多余装饰，直面事物粗粝真实的本质。

4. 富有辨识度的重复图形与图案

粗野主义网页经常运用重复图形纹样，或是独特的二维、三维造型，塑造强烈辨识度。很多图形灵感直接取自粗野主义建筑，是对其标志性几何语言的继承与转译。

5. 强烈的视觉冲击与压迫感

经典粗野主义建筑体量庞大，裸露的清水混凝土、冷峻几何结构，带来巨兽般的压迫力量。这种感受被移植到网页当中，表现得更加自由奔放。对比主流网页追求温润舒适的体验，粗野主义网页自带叛逆、疏离的独特气质。

四、粗野主义网页参考灵感站点

1. Brutalist Websites（brutalistwebsites.com） 站点如其名，专门收录粗野主义网页案例，页面仅保留简短介绍与案例集合。

   

“粗野主义带着粗粝质感，不在意是否显得轻松舒适；它可以看作年轻一代，对当代网页设计轻薄、乐观、浮华风气的一种反抗。”——Brutalist Websites

2. Awwwards・brutalism 合集（Awwwards/collections/brutalism/） 知名网页奖项与灵感平台 Awwwards 专门整理的粗野主义专题合集，收录作品在设计完成度、交互动画上表现更为出彩。

   

总结

粗野主义网页不等于放弃设计，而是把网站的 “骨架” 直接袒露出来：使用基础原生的排版、按钮与链接，剥离冗余装饰。其初衷，是让用户直观读懂网站结构与目的，减少包装带来的误导，把重心归还到内容与功能本身。

这份 “粗糙” 是一种设计态度，承载着独特气质与反叛精神。它敢于对抗主流审美，接纳 “不完美”，借由原始感传递真实与自我表达。

设计风潮本就是周而复始的循环。粗野主义发展至今，不断结合时代文化催生出新变体，例如新粗野主义、后现代粗野主义、工业粗野主义、赛博粗野主义等。它们承袭粗野主义重视原始力量与功能优先的内核，再融合其他审美诉求，演化出丰富多元的分支风格。后续我们会继续展开聊聊这些衍生流派。

转载：优设

兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。

兰亭妙微ui设计公司分享：退票、扣款、售后协商这类涉及金钱损益的页面，很容易出现用户误判金额，造成不必要损失的问题。结合真实机票退票事故案例，拆解金额敏感场景的交互设计思路，总结 5 条可复用设计原则，帮用户在执行操作前，清晰看懂金钱变化与潜在后果。

案例背景：一次引发争议的机票退票事件

曾有一则新闻：用户完成机票退订后，发现实际仅到账四百余元，才知晓退票被扣除了上万元票款。用户原本把页面展示的退款金额，错当成退票手续费，完全没有意识到这是自己最终到手的全部钱款。

事后平台为用户做了补偿，同时迭代产品，新增退款金额过低场景的二次确认弹窗。但这件事暴露出金额类界面普遍存在的设计痛点： 很多界面只是机械罗列规则条文，却没能让用户在短暂浏览中快速读懂金钱损益；不能简单把问题归咎于 “用户没仔细读条款”，设计师要思考，如何通过界面表达，降低用户误操作风险。

核心设计方法：5 条金额敏感界面设计准则

1. 匹配用户心智：区分损失心智与收益心智

金额信息存在两种表达方式：展示最终到手（收益心智）、展示将要扣除（损失心智）。 当操作会带来大额损失时，用户的关注点是 “我会亏掉多少钱”，也就是损失心智。如果界面只强调能退回多少，就极易产生认知偏差。

设计做法：

• 退票、扣费类高损失风险场景，优先突出扣除金额，而不是只展示最终退款；
• 在购票阶段就直白写明退票扣款数额，不要只用模糊描述如 “仅部分税费可退”；
• 抓住用户毫秒级的注意力窗口，把对决策最重要的信息做成认知钩子，避免被当成无效信息忽略。

示例优化：把订票页模糊提示「仅部分税费可退」，改写为明确金额提示「退票将扣除 XX 元」；退票申请页面视觉重点从 “预计退款” 切换到 “需扣款项”。

2. 高损失风险操作，提交前做有效的二次风险确认

弹窗不能滥用，但涉及用户财产损失时，二次确认是防范误操作的关键，要注意 3 个要点：

1. 标题中立具象，拒绝模糊主观判断 不要使用 “退款金额较少” 这类主观定性话术，直接写明会扣除 / 收取的具体金额，界面只提供客观信息，把判断权交还用户。
2. 削减信息噪音，只保留当前决策必要内容 弹窗属于侵入式交互，信息冗余、术语冗长会让用户产生厌烦，习惯性直接点确认，弹窗就彻底失去风险拦截作用。

• 非必要信息不要塞进弹窗；
• 复杂内容做格式化、分段处理；
• 条件化展示提示：只给使用了对应服务的用户弹出相关提醒，不要对全体用户展示无关文本。

3. 按钮文案写清行为，摒弃 “确认 / 继续” 这类模糊词汇 按钮要描述点击之后会发生什么，例如：「确认退票（到账 ¥430）」「暂不退票」，而不是笼统的确认、继续，降低误点概率。

3. 减少信息噪音，分层披露信息

不要一股脑堆砌全部规则。标题、正文只保留会影响当下决策的关键信息；复杂条款折叠、分层展示，不要干扰核心金额阅读。

4. 文案保持中立客观，少做主观判断

避免 “金额较小” 等主观评价，只陈述客观数字事实，由用户自己权衡要不要继续操作。

5. 按钮文案改写，清晰描述操作结果

规避 “确认”“继续” 等语义模糊按钮，使用结果导向的操作文案，明确告诉用户点击按钮会触发的行为。

核心设计理念：优秀的金额敏感界面，目标不是让用户通读全部规则，而是让用户在点击操作前，看懂金额变化与操作后果。

业务优化实证：售后退款协商页面改造

业务中有一类场景：商家和用户协商调低退款金额。旧版本弹窗只简单提示 “同意后将退款 XX 元”，大量用户因为没有感知到退款被缩减，误点击同意，相关客诉长期位居售后前十。

优化方案：弹窗完整说明变更逻辑，点明 “无需退回货品，但退款将降低至 XX 元，原金额 XXX 元”。改版后该类误操作投诉基本消失，验证了明确金额表达对体验的正向价值。

延伸思考

这套设计逻辑不局限于退款、扣费的金融场景。但凡需要用户做出重要决策的界面，都可以复用这套思路：对齐用户当下心智、精简干扰信息、客观呈现关键后果、操作按钮表意明确，以此减少用户理解偏差与误操作。

转载：优设

兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。