这款情绪追踪App，直接被它的设计拿捏了。它不仅功能上细致入微，视觉上也超级有“高级感”，特别适合像我这样喜欢情绪整理、又是设计控的用户。今天我就从设计角度拆解一下，如何打造一款既有温度又有专业感的心理健康类App 一、色彩心理：温暖又克制的配色体系 BetterHope 用了暗黑底色+高饱和情绪色块的组合。背景是柔和哑光黑，主视觉配色则选用了情绪表达最强烈的颜色——明亮橙（活力）、柔和紫（幸福）、草木绿（平静）、深蓝（焦虑）等。情绪标签颜色和情绪本身有直觉对应，既能吸引用户视觉注意力，又不会让整体设计显得浮夸。 而Logo部分的黄色点缀，非常聪明——“Hope”这个词用明黄色强调，既符合品牌调性，又成为整个页面情绪的“灯塔” 二、信息层级清晰，界面非常“呼吸” 打开App，首先看到的是“本周情绪概览”，用两大卡片呈现“Monday: Calm / Happy”和“Tuesday: Sad / Upset”，卡片视觉有留白、有边距，文字居中排列，底部有情绪emoji，不仅利于快速识别，也增强了亲和力。 再往下滑是情绪日历视图——非常精妙的交互设计！用时间轴和情绪色块的组合，让用户能一眼看到自己一整天的情绪流动。比如“8AM Energetic, 11AM Calm, 2PM Happy”，既有数据沉淀，也有视觉节奏 三、插画和动效，赋予App灵魂 情绪是抽象的，但BetterHope在启动页和空状态页面加入了线稿插画（比如一个人左右有不同情绪的脑袋，中间是双手抱胸的平静形象），瞬间拉近了人与App的心理距离。 这种“具象化情绪”的方式，对心理健康类App来说特别重要。它让用户感受到“你不是孤单一个人”，而不是冰冷的数据记录工具。 四、Journal Prompts + 数据洞察，功能和陪伴感兼具 除了记录情绪，它还提供每日引导问题（比如“今天什么让你笑了？”），非常有仪式感。而“Weekly Mood Insights”模块会总结你哪天最快乐、哪段时间最焦虑，设计语言上也避免了生硬的数据展示，用了轻语式提示（比如“You felt happiest on weekends”），有种被温柔关注的感觉。 五、底部导航设计：极简不失功能性 底部导航用五个图标表达“主页、日记、日历、报告、设置”，配色一致性强，悬浮式设计搭配阴影处理，让整个界面更有空间感和现代感摘要：这款情绪追踪App，直接被它的设计拿捏了。它不仅功能上细致入微，视觉上也超级有“高级感”，特别适合像我这样喜欢情绪整理、又是设计控的用户。今天我就从设计角度拆解一下，如何打造一款既有温度又有专业感的心理健康类App 一、色彩心理：温暖又克制的配色体系 Bett
来源：吴天琪
