很多入行的设计师做了大量原型输出，但被问到 “什么是交互设计” 时，依旧很难给出清晰的解释。兰亭妙微在 B 端、移动端项目实践中发现，不少人把交互简单等同于画原型、画界面，这其实是一种认知误区。今天结合行业起源、权威定义与实战经验，梳理交互设计的真正内涵。

北京兰亭妙微 UI 设计公司，成立 16 年来，始终保持着对国内外优秀设计作品的学习与研究。我们持续追踪全球前沿的 UI/UX 设计趋势，从中提炼可落地的设计方法论，分享给同样热爱设计的你。

一、产品定位：先回答系统替谁解决什么问题

• 桌面端/平板端：承担全局洞察与复杂决策，如多航司对比、长航线规划与商务舱选座，主要面向高频差旅人士与追求效率的用户。
• 移动端：承接高频执行与即时反馈，如登机口变更通知、电子登机牌展示与快速改签，强调在移动场景下的单手操作便捷性。
• 核心价值：通过“Book. Fly. Repeat.”的极简理念，将繁琐的购票流程压缩为“3次点击”，解决传统航空应用中信息过载、决策链路长的问题。

二、信息架构：把功能转译为旅客的出行节奏

• 全局层：首页以巨大的出发地/目的地代码（如 JFK ⇌ MXP）为视觉锚点，确立行程的核心上下文；搜索栏置于顶部中央，支持快捷键（⌘ + Space），符合桌面端高效操作习惯。
• 执行层：将“Upcoming Flight”（即将开始的航班）卡片化，突出时间与舱位；“Hot Propositions”（热门推荐）则以列表形式展示，便于快速比价。
• 沉浸层：右侧或独立页面的“Select Seats”（选座）模块，将抽象的座位图转化为可视化的机舱模型，让用户在预订阶段就能预演飞行体验。

三、关键交互：从填写表单走向可视化决策

• 动态航路图：不仅仅是静态地图，而是通过光点移动、虚线轨迹和实时距离计算（Distance to arrival），让“正在飞行”的状态变得可感知。
• 即时反馈闭环：在选座环节，用户点击座位后，底部的结算栏（Checkout）实时更新价格与座位号，无需跳转页面即可完成确认，极大缩短了决策路径。
• 拟物化票据：电子登机牌采用了带有撕裂线设计的拟物风格，配合二维码与关键信息（Gate, Seat, Class），既保留了传统票据的仪式感，又具备数字化的便捷性。

四、视觉系统：品牌表达必须承担高端与科技感

• 色彩语义：深邃的墨绿色背景（#006A4F）奠定了高端、稳重的基调，象征夜空与深海；高饱和度的荧光绿（#8EFEEE）作为核心操作色，用于指引路径与选中状态；橙色（#FF6803）仅用于强调价格或紧急状态，形成强烈的视觉层级。
• 光影质感：界面大量运用了微弱的顶光与磨砂玻璃效果（Glassmorphism），模拟机舱内的氛围灯效，让数据卡片仿佛悬浮于深色背景之上，增强了界面的通透感与层次感。
• 字体排印：采用大字号的无衬线字体展示机场代码（如 CDG, HND），利用字重对比区分信息层级，确保用户在余光扫视时也能瞬间获取关键信息。

五、面向产品与设计团队的可复用价值

六、专业审视：仍需补齐的体验边界

结语：设计的最终判断标准是业务与使用价值

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

北京兰亭妙微 UI 设计公司，成立 16 年来，始终保持着对国内外优秀设计作品的学习与研究。我们持续追踪全球前沿的 UI/UX 设计趋势，从中提炼可落地的设计方法论，分享给同样热爱设计的你。

一、产品定位：先回答系统替谁解决什么问题

• 桌面端：承担全局洞察与深度数据分析，主要面向全科医生（GP）和专科医生，解决多源数据分散、难以快速掌握患者现状的痛点。
• 移动端：承接即时通知、快速查阅与远程监控，让医生在查房或移动场景下也能保持对患者状态的感知。
• 核心价值主张：“Designed for doctors. Loved by patients.”（为医生设计，受患者喜爱）。它试图通过“Technology that cares”（有温度的科技），将冰冷的医疗数据转化为可信赖的临床洞察，帮助医生在繁忙的日常中迅速 grasp（掌握）每位患者的状况。

二、信息架构：把功能转译为医生的诊疗顺序

• 全局层（Dashboard）：首页不再是简单的列表，而是以“Blood sugar”（血糖）、“Sick leave”（病假/休假状态）、“Patient profiles”（患者画像）为核心的仪表盘。这种布局直接回应了医生“病人现在怎么样”的首要问题。
• 分析层：将复杂的生理指标（如心率、血糖）转化为可视化的趋势图，而非单纯的数字表格。
• 执行层：将“Make appointment”（预约）、“Auto Reminders”（自动提醒）等高频操作置于显眼位置，形成从“发现问题”到“解决问题”的短路径。

三、关键交互：从阅读病历走向即时洞察

• 数据可视化：血糖图表不仅仅是折线，还引入了“Range”（正常范围）的阴影区域和“7 Day Average”（7天平均值）参考线。这让医生一眼就能判断数值是否异常，无需心算。
• 卡片式叙事：每个指标（如 Sick leave, Heart Rate）都被封装在独立的卡片中，配合圆弧进度条和状态标签（如“Good”, “Improving”），将复杂的健康状况简化为可读性极强的图形语言。
• 无缝连接：User Flow 展示了从登录、绑定设备（Apple Health/Google Fit）到关联诊所（Link GP Clinic）的流畅过程，降低了技术门槛，确保数据能自动流入系统。

四、视觉系统：品牌表达必须承担信任语义

• 色彩心理学：主色调采用温暖的金黄色/橙色与冷静的深蓝色搭配。蓝色代表医疗的专业与科技（如 App Icon、图表线条），而大面积的暖色背景（如 Dashboard 头部、卡片背景）则打破了传统医疗软件的冰冷感，传递出“Cares”的品牌温度。
• 字体与排版：使用清晰无衬线字体，关键数据（如 92 mg/dL）加粗放大，次要信息弱化，层级分明。
• 拟人化元素：Logo 设计采用了类似人形的抽象符号，配合真实医生的摄影图片，强化了“以人为本”的视觉暗示。

五、面向产品与设计团队的可复用价值

• 对产品经理而言：最值得借鉴的是“挑战-解决方案”的设计推导过程。面对“等权重指标导致阅读困难”的挑战，团队没有堆砌功能，而是通过建立层级结构（Hierarchical structure）和优先级排序（Prioritized main trend graph）来解决。这证明了好的设计是做减法。
• 对设计团队而言：要重点维护数据的可解释性。Cinex 没有只展示一个总分，而是展示了分数的构成（如 +4 from yesterday），这种透明度是建立用户（尤其是专业人士）信任的关键。

六、专业审视：仍需补齐的体验边界

• 小屏风险：虽然移动端展示了核心卡片，但在手机窄屏上，复杂的血糖图表和多个卡片并列可能会导致横向滚动过多或内容拥挤。建议针对移动端进一步简化图表，仅保留异常警示和最新数值。
• 隐私与合规：作为医疗产品，界面上展示了大量敏感数据（如具体诊断 Mild Hypertension）。在实际落地中，需要增加更明显的隐私保护机制（如模糊预览、FaceID 解锁后才能查看明细），并在 UI 上给予用户足够的安全感暗示。
• 异常处理：目前的界面主要展示正常或轻微波动的数据，对于危急值（Critical Values）的视觉强提醒（如红色闪烁、弹窗）在现有截图中体现不足，这是医疗产品的安全底线。

结语：设计的最终判断标准是业务与使用价值

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

筛选是移动端产品里十分高频的交互控件。当页面数据量大、条目繁杂时，筛选功能可以帮助用户快速收缩范围，定位目标内容。兰亭妙微在电商、OTO、教育类项目实践中，梳理了市面上主流筛选控件类型，同时明确每种组件的适用边界，方便设计师做组件选型。

很多人都有这样的经历：睡前只想刷几条短视频，不知不觉就耗费一两个小时。为什么我们会难以自主停下浏览？兰亭妙微结合 C 端产品项目实践，剖析短视频、信息流产品背后的交互机制，同时探讨设计套路与良性体验之间的边界。

很多交互设计师做完项目，交付完原型文档就算工作结束，忽略项目复盘环节。复盘是设计师实现能力迭代非常关键的手段，尤其新人设计师，大量细碎基础项目，如果缺少复盘沉淀，工作做完很难转化为个人经验。兰亭妙微团队在内部项目流程中，会要求设计师在项目收尾一周内完成复盘文档，把项目过程中的感触、问题、解决方案梳理沉淀下来。

B 端系统业务逻辑复杂，数据内容不可控，再加上浏览器窗口可以自由缩放，极限内容场景是设计师绕不开的难题。实际评审中，开发、测试经常会提出疑问：当文字、选项、数据超出预设版面，页面该如何表现。兰亭妙微在大量政企后台、管理系统项目中发现，多数设计只覆盖 80% 常规使用场景，常常忽略剩下 20% 的极限边界情况。一套完善的设计规则，必须提前定义各类内容溢出的处理方案。

北京兰亭妙微 UI 设计公司，成立 16 年来，始终保持着对国内外优秀设计作品的学习与研究。我们持续追踪全球前沿的 UI/UX 设计趋势，从中提炼可落地的设计方法论，分享给同样热爱设计的你。

一、产品定位：先回答系统替谁解决什么问题

• 移动端：作为核心载体，承接球场上的实时记录、GPS测距与赛后复盘，强调在户外强光下的可读性与操作的便捷性。
• 品牌层：通过高度抽象的符号系统，传递“精准、清晰、现代”的价值观，解决传统高尔夫应用界面老旧、数据杂乱的问题。
• 核心价值：将复杂的高尔夫运动数据转化为直观的表现洞察，帮助球员从“凭感觉打球”转向“数据驱动决策”。

二、信息架构：把功能转译为球员的击球顺序

• 启动层：App图标与启动页（Splash Screen）采用高饱和度的黄绿色调，在视觉上直接关联草地与活力，建立鲜明的品牌识别。
• 功能层：底部导航栏简洁明了，核心功能（如搜索球场、开始回合）被置于拇指热区；Dashboard（仪表盘）作为数据汇总页，承载了长期的表现趋势。
• 视觉层级：Logo设计采用几何化的三圆点结构，既像高尔夫球，又像挥杆的人体动态，这种极简的图形语言贯穿了整个UI界面，降低了认知负荷。

三、关键交互：从机械记录走向流畅体验

• 拟物与扁平的结合：启动页中的3D Logo质感细腻，具有实体球的光泽感，而进入界面后迅速转为扁平化设计，保证了信息读取的效率。
• 色彩心理学应用：大面积的绿色背景不仅仅是装饰，它模拟了真实球场的视觉环境，让用户在打开App的瞬间就能进入“打球”的心流状态。
• 符号化导航：底部的搜索与菜单按钮采用了圆润的胶囊形设计，配合高对比度的图标，确保用户在移动中或戴手套时也能准确点击。

四、视觉系统：品牌表达必须承担运动语义

• 色彩策略：主色调选用了接近果岭草皮的鲜绿色，搭配明亮的黄色作为点缀（如Logo中心、App图标背景），形成强烈的视觉冲击力，象征能量与专注。
• 字体与图形：Logo的几何构建过程（如第一张图所示的节点与连线）展示了设计的严谨性，这种“工程感”暗示了产品在数据分析方面的专业性。
• 跨端一致性：从手机桌面图标到App内部界面，再到品牌宣传物料，视觉语言高度统一，强化了“Smarter Golf Performance”的品牌承诺。

五、面向产品与设计团队的可复用价值

六、专业审视：仍需补齐的体验边界

结语：设计的最终判断标准是业务与使用价值

不少 UI 从业者会疑惑，UI 设计师是否需要掌握交互设计能力。答案是肯定的，只做视觉美化，不懂交互逻辑的 UI 并不完整。UI 设计不只是把需求转化为界面视觉，更要兼顾完整的用户体验，也就是用户和产品之间的整套交互行为。

“如无必要，勿增实体”，这句古老的哲学箴言，便是奥卡姆剃刀原理的核心内核，也印证了爱因斯坦的名言：“万事万物应当尽可能简洁，但不能过度简化”。在 UI 与交互设计实践当中，奥卡姆剃刀早已成为设计师做取舍的重要思想工具，帮助我们剥离冗余，打造高效友好的用户体验。