Star night
动效设计
Star night是什么？
Star night是一款主要以检测睡眠质量，辅助睡眠，睡眠音乐，通过呼吸训练调整情绪的一款健康睡眠软件，不仅拥有100+的入睡音乐和白噪音，而且能痛殴专业科学的检测用户睡眠状态，来评测用的睡眠习惯，并总结出最适合用户的睡眠报告，来提升用户的睡眠质量。
设计目标
睡眠类App的动效设计目标是创造一个舒适、安抚和个性化的用户体验，创造出一种深度的、令人放松的沉浸感，使用户感到仿佛置身于一个安静、宁静的环境中，帮助用户更轻松地进入睡眠状态和自然唤醒。
动效设计原则
在动效设计中，必须明确了解动效在系统中的作用。这包括确保页面过渡流畅、提供清晰的指示、展示元素层级关系以及传达产品品牌形象。设计时要注重操作符合用户预期，物体运动仿真真实世界，元素表现突显产品品牌与调性。
自然的
自然运动规律，保证视觉连贯，让用户感知到动作是成立的。
高效
界面元素运动尽可能少且简洁，减少路径及不必要的元素，快速的完成流程任务。
克制
做有意义的动效，不去做太多的修饰而干扰用户。
启动页动效
引导页动效
首页动效
转场动效
一镜到底转场
为用户提供一个更加沉浸、自然和放松的环境，通过共享元素（圆形）、共享容器、共享动势等方法来进行转场过渡，帮助用户理解界面以及元素之间的逻辑关系，有助于提升用户操作任务的效率，增强视觉的流畅感。
01
共享元素
在转场发生后希望用户关注到的焦点元素，增强了转场的连续感。
02
共享容器
容器通过大小、视差等方式进行补间过渡转换，容器内的元素可通过共享元素的手法进行过渡，从而降低转场后的割裂感。
03
共享动势
“>通过相同的进场出场的动势来实现平滑柔和的过度，并且使用相同的交互手势，这种交互的流畅性可以增加用户的沉浸感。
手势动效
标题联动
对象主内容区与标题区的联动设计，在主内容区到达顶部边界时继续进行拖拽操作，除了主内容区因过界显控比设计产生的阻尼感，上方的标题区与其产生不同阻尼感的联动设计，让过界拖拽体验更灵动并富有层次感。
卡片左右滑动
卡片横向滑动可扩展更多功能，显控比设计让横向拖拽手势在一定距离后产生阻尼感，提示并引导用户进行后续操作。
睡眠定时动效
睡眠数据页
设计过程
