实用的app设计规范总结

用户头像
长春/UI设计师/5年前/1069浏览
实用的app设计规范总结
用户头像
丹仔123

app页面组件规范详解

为什么要做设计规范:

我们在设计的过程中,要注意设计的【秩序】,规范整洁的排列能让我们的设计看起来更加的美观和舒适,同样的也能节省后期的制作时间。


设计的规范不仅能避免出现常规的错误,也能提高我们的工作效率。



我们在设计中有一些需要掌握的设计规范,掌握一些主流的屏幕【尺寸】能让我们的工作更加的高效快捷。




了解【字体】的一些常用大小和颜色可以让页面看起来非常的和谐舒适,根据不同的情况选择不同的字体、颜色和大小能达到更好的效果。


【图标尺寸】熟练地掌握不同机型的图标尺寸能让我们的设计过程更加的流畅,大多数尺寸都是遵循4的倍数。

比如48px图标  通常图标大小设计为44px   四周留白增大用户点击区域


【按钮】按钮可以分为四个状态,不同的情况会有不同的展现形态


【命名】对图标的命名是一个细节上的操作,要非常的注意。


【标签】的设计可以分为【空心标签】和【实心标签】,通过标签来提炼出要表达的主要内容,这里是一些标签的经验数值【如图所示】。保持标签与正文文字大小整体上平衡感  所以标签字体较小加上边框 因为字体小看不清楚  使用中粗体 


【兜底加载】是指在某些特殊的状态下页面所要显示出的内容,例如APP在没有网络的状态下应该展示出什么样的内容,这里给大家列举出了一部分【兜底加载】的使用场景。【兜底加载】适用于【图片+图标】的方式,主要是缓解用户焦虑,提前预知加载内容,避免客户进行关闭或者卸载等危险操作。


【特殊字体】在合适的环境下使用一些特殊字体,可以让客户有更好的使用体验,也可以让页面看起来更加的有趣和丰富。 根据情绪做文字调整


【分割线】根据页面的内容做出合理的分割线,可以让页面看起来更加的和谐,内容区分更加明显。

什么时候用线  什么时候用面做分割?比如属于同一板块中  区分文字和图标不同的样式分区  可采用线

如果完全属于两种不同的版块功能时  就会用到面分割


【列表规范】我们在设计的时候要注意列表内容的主次分明,把要表达出的内容着重强调出来。



7
举报
|
13
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
加载中
推荐素材
科技医疗透明柜UI界面设计
【新年UI图标】30个图标
【新年UI图标】游戏/娱乐icon
3D渐变流体抽象矢量UI背景图
【新年UI图标】钱包icon
盲盒APP UI设计
【新年UI图标】优惠券icon
手表表盘UI系列
【新年UI图标】银行卡icon
抽象液态渐变UI背景模版
高级表盘系列UI源文件
高级感金属拟物 UI设计组件库
【新年UI图标】珠宝icon
3D卡通UI界面图标可爱插画免扣素
UI界面 组件
Security Camera UI kit
UI 登录界面设计模板包
拟物风质感写实UI卡片合集源文件
钱包ui模板
我的钱包-UI界面设计-app
【新年UI图标】汽车icon
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
智能家居中心 简约 UI设计组件库
你可能喜欢
相关收藏夹
大家都在看
登录注册