返回

零基础学UI设计

#C端UI设计
92%
进度
0/14
知识点
0
笔记
概述
移动端UI设计的基本认识
移动端UI设计的基本认识
UI 界面设计所需的技能解析
UI 设计的软件介绍
移动端的基础规范认识
移动端的规范认识
屏幕和分辨率的规范
设计的单位和格式
UI 中的字体与显示
UI 文字的属性设置
基本色彩模式的认识
UI 设计中的原子理论
iOS 的基本规范认识
iOS 的控件和组件认识
标准规范下的APP 设计演示
苹果音乐主页的设计
资料库页面的设计
专辑页面的设计
播放页面的设计
界面的合并和输出
移动端的基本控件和组件设计
UI 中的尺寸定义逻辑
按钮的设计逻辑
输入框的设计逻辑
列表行的设计逻辑
图标的尺寸定义
分页器控件的设计
轮播广告组件设计
快速入口的设计
瓷片区的设计
动态卡片的设计
商品卡片的设计
模态弹窗的设计
移动端页面设计的解析
登录页面的设计
综合型主页设计
动态列表页面设计
商品列表页面设计
电商详情页面设计
影音详情页设计
用户设置页面设计
表单页面设计
UI 中的视觉风格
夜间模式的设计
UI 中的投影应用
首页知识库C端UI设计零基础学UI设计

用户设置页面设计

酸梅干超人 编辑于 2023-12-1943人正在学
00

用户设置页面即用户进行个人账户、应用进行设置的页面,常见于应用底部导航中的最后一个选项。

用户设置页和用户个人主页不同,前者是设置型页面,而后者是社交展示型页面,它们经常被混为一谈,往往在设计的样式上也非常接近。主要的区分方法,就是该页面是否能被其它用户访问,能被访问的就是个人主页,不能被访问的才是用户设置页面。

用户设置页面的内容相对也比较固定,从上到下大多包含个人信息、快速入口、会员入口、设置列表等,都是用于进入更下级页面的按钮或选项。

因为都是入口,且部分应用中的入口数量非常多,所以往往要在结构上制造样式的差异,权重高的选项放在上方使用多列布局,权重低的则放在下方使用单列列表。

在完成视觉的设计中,头部个人信息部分可以使用纯色背景,也可以使用相对“花哨”的主色、毛玻璃背景、渐变、背景图等做法,来丰富页面的氛围效果。

如果包含会员卡片,则看是否需要将会员的卖点、优势表现出来,如果需要表现,则卡片独立显示且包含优势的说明、标签,如果只是简单的入口,则会做裁切和简化。

然后就是高权重的入口设计,最常见的就是使用快速入口的形式。但是,用户设置页的页面权重必然是低于首页的,所以页面中的快速入口图标“花哨”程度不能高于首页,要有所收敛。建议使用填充渐变色或添加纯色背景这类相对简单的样式即可。

最后就是底部的设置列表了,这就没有太多需要说明的,可以添加简单的线性图标提升视觉丰富性,也可以不放图标呈现更简约的风格

下面就是完成设计后的效果:

课后作业

想要掌握用户设置页面的设计,就可以根据在本节中学到的知识点,重新设计下面两个截图中的页面。

点赞
收藏
学会
17120043
下一篇: 表单页面设计
表单类页面,是用于向系统内输入信息、数据的填表型页面。比如注册页面本身就是表单页的一种,或者发布动态、信息认证等。 表单页由若干的表单控件组成,设计表单页面,就是根据数据填写的需要,选择合适的控件进行组装。表单类控件数量很多,但我们可以简单分成两个大类,输入型和选择型。 输入型即需要用户手动输入信息...
笔记 (4)
只看自己
logo
UX小学生 记录于 2024-06-21
用户设置页权重低于首页,所以不能比首页花哨,建议使用填充渐变色或添加纯色背景这类简单样式的icon
原文: 然后就是高权重的入口设计,最常见的就是使用快速入口的形式。但是,用户设置页的页面权重必然是低于首页的,所以页面中的快速入口图标“花哨”程度不能高于首页,要有所收敛。建议使用填充渐变色或添加纯色背景这类相对简单的样式即可。
凯尔队长 记录于 2024-03-05
在用户设置页面的快速入口「显眼」即可,不能能太花哨~~~
原文: 用户设置页的页面权重必然是低于首页的,所以页面中的快速入口图标“花哨”程度不能高于首页,要有所收敛。
© 2023 uxbaike.com All rights reserved
版权声明意见反馈联系我们
weixinlogo
mx-auto
TOP
mx-auto
笔记
mx-auto
点赞