UI设计素材干货模板|手机app夜间模式相关素材
夜间模式最大的作用就是在夜晚长期使用手机时保护眼睛、减少用眼疲劳。
也就是说如果该项目的产品，用户大多有夜晚使用的需求，那么就要为其增加夜间模式。
常见的有资讯类、阅读类、音乐播放类产品。
夜间模式的切换方式
为了区分日间与夜间模式，一般会添加夜间模式与日间模式的切换，常见的切换方式有列表开关、图标切换以及自动切换与提示。
01.列表开关
列表开关切换主要放置在个人中心列表页或是设置列表页中，日间夜间的切换方式使用开关组件，默认夜间模式关闭，点击即可打开。
02.图标切换
图标切换常见的有四种不同的放置位置，分别是宫格布局功能图标、顶部导航栏图标、内容详情页图标、侧边栏底部图标。
03.自动切换与提示
自动切换与提示夜间模式是更智能的一种方式，产品会设置一个默认时间段（多为夜间十点到次日早晨六七点），在固定时间段内，会自动进入夜间模式或是打开APP时弹窗询问用户是否开启夜间模式。
夜间模式的设计要点
夜间模式一般有两种处理方式，第一种很简单，只需在界面上覆盖一层40%~70%透明度的黑色遮罩层以此达到降低亮度的作用即可。这种方式虽效果不太理想，但更加节约开发及设计成本。比如以图片阅读为主的漫画类APP就比较适合这种方式。
文字颜色
根据腾讯ISUX的研究，深色界面下的夜间模式要保证文字与背景色的对比度在3:1-4.5:1范围内，这样既能保证文字对比不会过于强烈，也可看清楚文字内容。尤其不要使用纯白的文字色彩，对比过于强烈，夜晚长时期的观看可能会出现白色眩光感。
夜间模式作为一种辅助需求并不是所有产品都要必备的，但如果该产品用户大多有夜晚使用的习惯，那么就要为其增加夜间模式，以此提高用户体验度。
在设计夜间模式时根据产品需求考虑夜间模式的切换方式，通多对背景色、文字颜色、图片、图标等的处理降低页面的亮度与对比度，从而缓解夜间使用手机时的用眼疲劳。
如果您想了解更多数据UI设计的内容，到 搜UI (SOOUI) 为UI设计师提供了优秀作品，可供临摹学习 ！