兰亭妙微移动端UI设计公司审美积累 | Wellness 长者关怀 UI/UX 设计

【鸿蒙专题与实战】测试体系:单元测试、组件测试与 UI 测试 本文系统讲解鸿蒙开发中的三层测试实践:底层单元测试(用Hypium框架,优先覆盖纯函数、边界与异常)、中层ViewModel逻辑、顶层仅测3-5条关键UI路径。强调测试应“越往下写得越多”,因单元测试快且成本低,而UI测试慢易出错。通过实例说明断言拆分提升定位效率,结合覆盖率报告(hvigorwtest --coverage)发现盲区,核心是“用覆盖率找漏测,而非追求数字”。附五步落地清单:建测试文件、按优先级补用例、精简UI测试、生成报告、定位未覆盖行。下一篇将开启实战项目:从需求到上架全流程。 阅读详情

让每天的小事,都能被温柔而清楚地提醒。

兰亭妙微专注 UI 与用户体验设计,持续关注国内外优秀作品,分享界面设计与交互思路,进行设计审美积累。今天分享 Wellness,一组围绕长者日常、用药提醒与情绪记录展开的关怀型 App 设计。任务、沟通和回顾被放进同一套柔和界面中。


一、项目背景:为不同日常任务建立熟悉感
查看今天的安排、确认用药、回顾心情,这些动作需要不同内容,也需要容易辨认的共同规则。Wellness 用重复的卡片与主动作,把分散事务串成连续的日常节奏。

图片25.png

图片26.png

  图 1  当日活动的任务卡片

时间、图标与活动名称集中在任务卡片中,前后排列呈现当天计划的节奏。紫色背景让白色卡片浮现,黄色按钮接住主要动作,轻柔配色也有清楚的任务焦点。

图 2  位置 用药与语音沟通

位置、用药与视频留言分别使用地图、提醒卡片和人物画面,同一套紫色与黄色贯穿其中。场景不断切换,圆角组件和按钮关系仍然熟悉,日常关怀因此保持连贯。

 

二、设计策略:用柔和底色与醒目动作保持亲和
①信息架构:当日任务、位置、沟通与记录各自成组,先呈现当前事项。②视觉语言:紫色空间容纳白色圆角卡片,黄色标出关键动作;图标、人物画面与较简短的说明共同营造照护氛围。

Wellness Aging Care Mood and Meds | 界面细节与设计启发    

图片27.png

图片28.png

图 3  一周心情与当天记录

一周心情以趋势线展开,当天记录通过白色卡片补充时间与文字。总体变化与具体心绪放在一起,让数据回顾保留个人生活的细节,画面也显得柔和、舒展。

图 4  心情 日历与提醒的一致布局

这组并列界面展示心情确认、日期选择与用药提醒。黄色动作、圆角卡片和顶部层级重复出现,共同支撑不同任务;同样的视觉规则让每天的操作逐渐形成熟悉感。

③场景化交互:任务卡片围绕时间展开,用药与沟通页面沿用相近的动作位置,心情页把周趋势与当天记录连接起来。不同事情拥有熟悉的页面节奏,也保留各自需要的图形与信息。

 

三、设计启发:关怀感也来自稳定、可辨认的重复
紫色与黄色提供情绪印象,持续出现的卡片、层级与动作则建立熟悉感。做长者服务或日常健康产品时,可以积累这种温和表达;真正落地还要把字号、对比度与触控范围放到实际使用中检验。

如有养老服务、日常健康管理类 App的 UI/UX 设计需求,欢迎联系兰亭妙微,交流产品场景与设计需求。

【鸿蒙专题与实战】服务卡片开发:桌面上的「信息窗口」 本文详解鸿蒙服务卡片开发,从独立运行体系、配置文件form_config.json到UI构建与数据刷新机制。通过实现“今日待办”卡片,展示其尺寸声明、静态布局及主动/被动更新策略。强调卡片限制:不可滚动、禁用音视频与网络图片,仅支持onClick跳转。下篇将聚焦音视频开发,持续更新中,欢迎留言互动。 阅读详情

相关推荐

[YIUI付费插件] 超级循环列表yiuisuperscroll

本文介绍基于YIUI框架实现循环列表(LoopListView2)的完整流程:在Scroll Rect上挂载LoopListView2并配置预制体,为Item添加Click同步事件;通过ServerListPanelComponent与ServerInfoItemComponent配合,使用YIUISuperScrollListRenderer和YIUISuperScrollListOnClick实现数据渲染与点击响应,支持动态刷新列表、选中状态管理及服务器信息绑定,高效构建可交互的滚动列表界面。

Danielli博客 20

# WPF ComboBox 控件详解与使用 —WPF 中的控件(7)--下拉框选项列表控件( ComboBox)

ComboBox`(下拉框选项列表)是 WPF 中最常用的选择类控件之一,它在有限空间内提供下拉选项列表,支持**单选、可编辑输入、数据绑定、自定义项外观**等核心能力,继承自 `System.Windows.Controls.Primitives.Selector`。 本文将从基础属性、核心事件、基础用法、数据绑定、自定义模板、高级定制到最佳实践,逐一带代码注解进行讲解。

yunmaowu0917的博客 154

【鸿蒙开发进阶】第11篇:组件化开发:@Builder、@Component 与复用之道

组件化开发:@Builder、@Component 与复用之道

信息安全领域优质创作者|操作系统领域专家 296

从零搭建半导体设备上位机(五):三套 UI 库共存,HandyControl、MaterialDesign、Wu.Wpf 的样式基线

三套 UI 库共存:HandyControl、MaterialDesign、Wu.Wpf 的样式基线 这是「从零搭建半导体设备上位机」系列第5篇。一个 WPF 应用里同时装了 HandyControl、MaterialDesignThemes、Wu.Wpf 三套控件库。这篇讲它们为什么会打架、打架的具体机制是什么,以及怎么建立一套"谁也别想偷偷改我外观"的样式基线。 一个下拉框,白底白字 界面做完

samble的专栏 458

深入解析DDR5 SDRAM的ODT模式:时序图与状态表实战指南

本文深入解析了DDR5 SDRAM的ODT模式,详细阐述了其五种工作状态及其在读写操作中的动态切换逻辑。通过解读JESD79-5标准中的时序图与状态表,并结合模式寄存器配置实战,为硬件工程师和爱好者提供了优化信号完整性、提升系统稳定性的关键指南。

gpu4optimizer的博客 699

NX二次开发(python)-坯料尺寸(一)

一般在产品制造过程中,往往要判断一个模型在出模方向上的最小包容盒尺寸,在NX中可以用坯料尺寸命令实现,当然也有相应的代码实现,这或许可以帮助我们实现一些产品的坯料尺寸批量输出,节省人力。

dasfanfan的博客 816

【QT入门到晋级】用开源的自定义控件开发

直接点击mainwindow.ui文件是看不到quc控件的,关键步骤是右键点击mainwindow.ui,右键菜单选择【Qt Designer】,在UI设计器中才能找到“Quc Widget”。注意:以上是前端调用自定义控件的方式,需要编译动态库等操作,相对要麻烦一些。如果有自定义控件的源码.h和.cpp文件,直接加入到现有qt项目中,以后台方式直接调用即可,以下是我分享过一个手搓的自定义控件类【QT自定义2D控件】QGraphics绘制仪表盘_qt仪表盘控件-优快云博客。

ocy的博客 175

手把手教你用UNet实现轨道缺陷检测(附RSDDs数据集下载与完整代码)

本文详细介绍了如何使用UNet模型实现轨道缺陷检测,包括RSDDs数据集的下载与处理、UNet架构的改进与优化、训练策略设计以及模型部署的全流程。通过实战案例,展示了如何利用深度学习技术提升工业质检效率,特别适合从事工业缺陷检测和图像处理的开发者参考。

dapp9builder的博客 747

K210+STM32+LVGL:手搓边缘AI智能安防监控网关

在传统的物联网或嵌入式毕设中,“智能安防”往往沦为“温湿度+蜂鸣器”的简单堆砌。由于单片机(如STM32)算力有限,无法在本地运行复杂的视觉AI模型,导致很多项目只能在云端处理图像,带来高延迟和隐私风险。本文将分享一个真正的边缘计算安防网关项目。我们采用“K210视觉协处理 + STM32F407主控 + LVGL高颜值UI”的分布式架构,完美解决了单芯片算力不足的痛点。项目不仅实现了明火与陌生人脸识别,还加入了多源传感器融合、5秒智能防抖、以及硬件与UI的双向闭环控制,是一套工业级标准的开源方案。

186

TI DSP TMS320F280025 Note1:工程模板Template创建

该方法新建的工程支持寄存器开发,同时也支持库函数开发,新建后移动该工程也不需要重新修改路径,路径使用变量定义,使用方便、移植性能高

weixin_52849254的博客 2302

如何设计一个处理物联网设备数据流的后端系统。

设计一个处理物联网设备数据流的后端系统,需要综合考虑设备数据采集、传输、处理、存储等多个方面,保证系统能够处理海量数据,具备高可用性、扩展性和安全性。合理选择适当的技术架构和工具(如MQTT、Kafka、InfluxDB等),并确保系统能够灵活应对不断变化的业务需求和设备接入。

weixin_53227829的博客 839

React 错误边界 Error Boundary

用类组件 ErrorBoundary 隔离渲染错误,讲清能接住/接不住、重置策略与上报。

JudithHuang的博客 295

C#上位机3D可视化:HelixToolkit.Wpf集成点云/模型(机器人臂姿态实时监控)

核心控件是3D可视化的核心,需搭配和网格辅助定位;模型加载:按关节拆分机械臂模型,通过组合平移+旋转实现姿态控制;姿态更新:将机器人关节角度转换为3D模型的旋转变换,工业场景需从控制器实时获取角度;点云渲染:通过实现点云加载,需注意坐标系转换和性能优化。

这里只有干货:从 Modbus 通信到 MES 对接,从 YOLO 训练到工控机部署,带你搞定工业软件开发全流程。 714

【元宝搜索开发者征文大赛】用 Vue + Ele把元宝搜索的返回值做成“能点开检查的证据卡片”ment UI

本文提出将“用户信任AI结论”转化为前端组件问题:针对元宝搜索返回的嵌套JSON字符串型Pages,通过解析生成可标注可信度的证据卡片,实现“可信/存疑/过期”三态标记。前端负责证据可视化与用户交互,后端专注检索逻辑,代理层保障密钥安全。通过自定义时效分档、容错解析与可展开卡片设计,构建可验证的AI结论信任链,突破传统“输入框+结果列表”的局限。

weixin_43787161的博客 369

解锁RK3588多屏异显:MIPI+HDMI+EDP混合输出全攻略

本文详细介绍了RK3588处理器在MIPI+HDMI+EDP混合输出配置中的技术实现与应用。作为一款高性能处理器,RK3588凭借其强大的图形处理能力,支持多屏异显功能,可满足智能安防、工业控制等领域的多屏显示需求。文章从硬件连接、设备树配置、内核驱动设置到显示参数调整,系统阐述了配置流程,并针对信号不稳定、显示模式不匹配等常见问题提供了解决方案。通过智能安防监控案例,展示了该技术在提高监控效率方面的实际应用价值。随着技术进步,RK3588多屏异显技术将在更多领域发挥重要作用,为开发者提供灵活多样的显示方案

远程部署调试 运行安装 项目调试 二次开发 项目技术新 持续迭代 部分源码免费分享 2431

SAP Word 模板与 ABAP XML 数据流合并机制深度解析

Office Open XML 标准把一个.docx拆分成多个部件(document.xml、customXml\item1.xml 等),天然支持命名空间与 XPath;Word 在渲染时,会扫描<w:sdt>(结构化文档标签)与来确定绑定关系;在 ABAP 端,通过简单字符串替换与 XSLT 变换即可完成数据灌入,无需 COM Automation,安全且易于调试。

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 371

Android Message源码阅读

本文梳理了Android Handler机制中Message的核心设计:链表结构、消息复用池(sPool)及回收机制,重点解析了异步消息与同步屏障(SyncBarrier)的协同机制。当主线程需优先处理UI绘制等高优先级任务时,系统通过postSyncBarrier插入屏障,使Looper跳过普通同步消息,优先执行标记为异步的UI渲染任务,确保帧率流畅。该机制是保障Android界面响应性的关键技术之一。

u012116089的博客 189

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

算法与UI拆分中遇到的问题及解决方式

算法与UI界面拆分解耦,算法设计成windows服务来供客户端调用

冰凌的博客 186

老版QQ原生表情gif动态

这是老版的QQ表情,不过全是动态的的,Windows照片查看器是不会动的,可以右击用浏览器打开查看,再说一遍是老版的,只是分享给宁愿用老版也要动态的人。

Data-Structures-and-Algorithm-Analysis-in-Java.pdf

作者: Weiss, Mark A. 出版社: Addison Wesley Data Structures and Algorithm Analysis in Java is an “advanced algorithms” book that fits between traditional CS2 and Algorithms Analysis courses. In the old ACM Curriculum Guidelines, this course was known as CS7. This text is for readers who want to learn good programming and algorithm analysis skills simultaneously so that they can develop such programs with the maximum amo...

从 ArkUI V1 监听泥沼到 V2 精准更新的性能跳跃,重构状态数据流

起初以为只是简单的 API 替换,没想到在一次复杂表单交互中,整个页面出现了严重的掉帧与输入延迟。为了过渡,我试图在一个 V2 的父组件里,塞入一个原本用 V1 编写的子组件。这也是为什么在重构中,我强制团队在涉及数组更新时,必须通过封装好的工具方法来操作。必须精确到需要更新的最底层属性,如果只用在外层对象上,内层的频繁变动依然无法触发 UI 的刷新。变化时,框架能够直接定位到绑定该变量的 UI 节点进行刷新,完全没有多余的遍历。用性能分析工具跑一下,体会一下消除深度代理后,页面渲染性能的直线拉升。

2602_97267507的博客 284

NTscan扫描工具

ntscan是一个扫描器,可以扫描没有密码和弱密码的共享,先到配置文件中填写猜测的用户名和密码,扫描过程中右侧出现的是扫描日志。

DeepSeek Harness 创造模式完整教程:5 步创建插件、验证生效与保存专属模式

发布日期:2026-11-03 | 数据截至 2026-11-03,来源为各平台官网、中国信通院《大模型词元服务性能监测报告(2026年)》及公开研究资料2026年国内企业级大模型 API 服务商已分化为云厂商自营(阿里百炼、火山方舟、百度千帆、腾讯云 TokenHub)和独立聚合平台(七牛云 Token Plan、硅基流动)两大阵营,模型厂商直连(智谱 GLM、讯飞星火)则作为垂直场景补充。

aidoudoulong的博客 523

在Open-WebUI中提升向量化速度

让Open-WebUI AI聊天的向量化过程不超过10秒,而不是默认的20+分钟……

xyzzklk的博客 568

Qt_05基础界面组件

Qt 基础界面组件

u012660296的博客 252

LazyForEach 长列表滑动与渲染底层优化

当组件被复用时,系统会直接拿缓存里的组件,把新数据塞进去。这省去了组件实例化和布局计算的时间,是长列表丝滑的关键所在。条件切换,底层的 ArkUI 就会把前一个按钮销毁,重新创建另一个。对于几千条数据的列表,这会引发巨大的性能开销。里加一个复杂的数学计算,观察帧率瞬间掉到 30 以下的惨状,体会一下 UI 线程的脆弱。它的核心逻辑是:系统只渲染屏幕上看得见的节点,滑出屏幕外的节点会被回收进缓存池。'已选中' : '未选中'),层级达到了七八层,每次滑动系统都要重新计算所有子节点的尺寸,CPU 直接拉满。

2502_91284977的博客 186

UI 适配的暗礁,沉浸式状态栏、安全区与软键盘交互重构

仔细一看确实惨不忍睹:顶部的背景图被状态栏的电池电量遮挡,底部的输入框在弹出软键盘后被顶飞到了屏幕之外,还有侧边的返回手势和页面里的侧滑控件严重冲突。如果你的页面里恰好有一个从侧边滑出的抽屉菜单(Drawer),这两者会直接打架。如果你的页面里有一个长列表,整个列表会瞬间被压缩,体验极差。如果页面没有明显的抖动跳跃,说明你的避让逻辑完全达标了。极其容易忽略的警示:在折叠屏展开或者横竖屏切换时,安全区的高度是动态变化的。设置之后,键盘弹出只会压缩当前窗口的高度,而不会平移整个页面。

2502_91284977的博客 410

兰亭妙微ui设计公司分享:Qt桌面界面怎样把状态和操作设计清楚

左侧显示设备列表,中间展示当前设备的运行数据,右侧提供启动和暂停。列表刚切换,详情还没更新时,也要让等待状态足够明确,避免用户拿上一台设备的数据判断当前情况。视觉上可以用稳定的位置帮助确认对象身份,把设备名称、连接状态和更新时间放在容易找到的区域。界面方案刚开始时,可以挑一个范围明确的场景与开发一起验证,例如选择设备、修改一个参数、提交并看到结果。空间收窄时,次要面板是否可以折叠,工具栏是否可以分组,主操作是否仍有固定位置,都需要有清楚的取舍。只能查看的用户,和可以修改参数的用户,看到的入口可能不同。

lanlanwork12的博客 179

【鸿蒙心迹】折叠屏适配实战——展开/折叠状态下的 UI 重构(HarmonyOS 7.x)

折叠屏展开那一刻,布局不是"被放大",而是被重构——单栏切双栏、列表变分栏、顶部 Tab 变侧边导航。本文用邮件类应用适配折叠屏的真实过程为案例,讲清展开/折叠状态监听、双栏重构、半折叠悬停态处理,以及最容易被忽略的一件事:状态在布局重建后不能丢。附 5 个真实踩坑(现象→根因→解决→教训)与自查清单。

腾讯云创作之星、华为云云享专家,深耕电商全栈高并发系统实战,分享可商用商城项目源码。 363
上一篇: 兰亭妙微ui设计公司分享:Qt桌面界面怎样把状态和操作设计清楚
下一篇: 兰亭妙微ui设计公司分享:12 个原型规范化方法:做好原型,不止追求好看
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值