联系我们 face+ 关于 服务 案例
首页 案例 服务 关于 face+

ui设计模板要规范,必须注意这几大要素

Time: 2021-01-18

要设计一款好的UI设计,不是凭空想象的,很多时候需要技巧和方法,也需要掌握一些原则。那大家看到网上有很多ui设计模板,想知道它们是怎么设计出来的吗?今天就让小编为大家介绍ui设计模板要规范,必须注意的几大要素。

  ui设计模板要规范,必须注意这几大要素

  UI设计模板要规范,就要看这几大分类组成要素。分别是:Logo、标准色、字号、段落设置、图标、图片、间距、圆角值、大小、阴影、组件等。无论是自己设计创作的阶段还是和程序员沟通推动产品开发阶段,你的设计规范是否完善,对产品的质量起着决定性的关键作用。

  1、Logo

  品牌印象的直接感受,根据页面不同背景所使用的Logo图也不同。将产品中所使用到的Logo统一分类,品牌LOGO可以选择由图形和文字组合而成,搭配不同的品牌色和不同色背景,这样的Logo设计出来效果更好。还有Logo的横竖向排版和单个Logo图形来分类更好。

  2、标准色

  颜色是设计最重要的部分,没有之一。细节决定品质,所以对颜色的运用格外细致,颜色的搭配直接决定产品的品质感。颜色大致可分为品牌色、文本颜色、背景色、线框色等。给颜色添加关键词,明确用于什么界面。每个颜色不仅标注了颜色值,而且给出了颜色使用的场景,这样,对不同状态显示的颜色感受更直观。

  3、字体

  字体是设计中必不可少的考虑因素,不同的字体气质不一样,并且不同场景下带给人的感受也不一样。所以需要在设计的时候考虑到字体的设计效果,然后在设计规范中注明。在定义字体名称的同时也定义了字体的风格,并且添加了不同字体风格的预览效果,常见的字体风格有:Light、Regular、Italic、Semibold、Bold。

ui设计模板

ui设计模板(图片来自网络)


  4、段落设置

  在实际的产品设计中,段落有很多种样式,不同场景下的段落要求也不一样。比如:阅读内容的段落要求文本可阅读性强,所以对字体、字号、颜色、行间距等要求简单易读。而带有装饰性的段落文本则不需要那么严谨,装饰性强就可以。需要注意的是:在定义段落默认字体的时候还需要定义一个后备字体,即默认字体不能正常显示情况下显示的字体。设计的水平层次就在于对细节的打磨,这也就是段落规范在设计中存在的意义。

  5、图标

  图标是重要的软件标识,在设计资源中是最重要的模块之一。在软件产品中甚至可能每个页面都存在图标,图标除了美化的作用以外,还有着明确指代含义的计算机图形。

  6、图片

  图片也是属于设计规范最重要的部分之一,按照用途分类整理图片资源,设计风格系统化。

  7、度量

  在设计的过程中,我们经常会使用一套规范的度量标准,来保持产品的一致性,分别为圆角值、间距、大小。对度量解释最好的是设计中经常使用到的栅格系统(Grid Systems),运用固定的格子设计版面布局,其风格工整简洁。这就是我们在网页和APP设计的过程中经常使用到栅格系统的原因。

  8、阴影

  阴影风格及参数也是设计规范中的一部分,在整理设计规范的时候,需要注意的是阴影的参数值是网页中控制阴影的参数值,而不是设计软件中的参数值。

  9、组件

  常用的UI组件(Component):Button控件、下拉框、选择框(单选\复选框)、时间选择器、输入框、搜索框、进度条、分页器、提示框、警告框、表格、弹出面板、数字步进器、选项卡等。

ui设计模板

ui设计模板(图片来自网络)


  做UI设计模板的规则有哪些

  1、图标文字规则

  图标是传达给用户的首个直观视觉感受,它可以体现产品的风格、功能、品质。由于APP界面受屏幕尺寸的局限性,在图形的选择上,首先是符合APP主题的图形,结合产品自身个性选择设计,保证图形传播的真实性;其次选择清晰度较高的图形,图形是具体的、直观的、形象的,让使用者在短时间获取更多的信息。

  文字的设计上,首先是字号、字体有效的区分出信息的重要级别;其次是行宽与行高的比例,遵循从左到右的原则,左对齐、居中对齐、两端对齐、减少不必要的文字对比反差,调整合理的字间距;最后是留白,适当的留白增加信息的易读性。

  2、布局规则

  Logo放置每页相同位置,数据内容按主次先后有序排列,重要信息放置主页及界面中等偏上的位置,遵循人们从上到下,从左到右的阅读习惯,主页长度适度,其他页面也不宜过长,页面尽量采用分页。

  明确每个页面需突出的重要信息,可以通过色彩颜色、图形、文字大小、间距、留白等进行对比区别,拉开层次,突出显示重要信息。

  导航尽量采用底部导航或一侧导航有利于用户引导和了解页面布局,不占左右空间。设计师在对APP布局前,对应用的功能需求有清晰的把握,在每一级别的页面,应该清楚知道整个应用的界面跳转和层级关系,明确每个页面的凸现信息。

  3、交互原则

  可靠性指用户在操作时软件的稳定性,不会出现闪退、延迟等基本错误。易用性指的操作简单化,让不同年龄段的用户都能快速上手,简单化清晰化的操作,可增加用户对产品的操作信心减少产品的使用差错率。

  可靠性和易用性是基础,趣味性就是核心,趣味性在用户使用APP操作中增加了人文关怀和情感注入,同时趣味性的元素的使用,让界面“活”起来。

  以上就是小编为大家介绍的关于ui设计模板的相关内容。对于很多新手来说,学习最快的途径


合作咨询

上海(总部)

上海市浦东新区郭守敬路498号22号楼
021-61057328
service@faceui.com

办公地址地图

北京

北京市东城区后永康17号A座
010-64015620
service@faceui.com

办公地址地图

成都

四川省成都市锦江区东大街牛王庙段100号
028-62790929
service@faceui.com

办公地址地图
首页 | 案例 | 服务 | 关于 | face+ | 智见

Copyright © 2009-2022 FaceUI design. All rights reserved


沪ICP备13044459号-5

上海办公地点地图
北京办公地点地图
深圳办公地点地图
在微信中搜索faceui
或保存二维码在微信中打开