网页设计完整流程 第1篇
用于向用户展示步骤的步数以及当前所处的进程。
角标
用于聚合型的消息提示，一般出现在通知图标或头像的右上角，通过醒目的视觉形式吸引用户眼球。
常用的UI组件（Component）：表格、对话框、提示条、气泡提示、日期选择器、多级选择器、标签输入框、组合框、上传等。
图片来源△Ant design 移动组件
在skecth中设计时，使用Symbol创建的组件，在后期整理时，可以节省许多的时间。
当然，Figma也同样具备这样的能力，你所创建的组件都存在于Assets中。
空状态页面：显示对应的页面空状态的图标，增加相应的引导按钮。
无网络状态：在没有连接到网络时的提示页面。
404&505页面：在发生未知错误时的页面。
了解规范的内容有哪些之后，我们需要确认的是规范优先级，规范内容庞大复杂，基础的、必要的、高性价比的放在第一个版本中，复杂的向后放，随着产品的迭代，规范才会越来越完整。
一个好的规范应该是高效的、简单易懂的，具体执行时，我们应该确保分类合理、规范本身保持一致、布局排版易读，来提升设计师查阅的效率；确保定义清晰、描述准确、场景完备，来帮助设计师理解和使用，但值得注意的是，设计规范并不是“圣经”，不要因为规范而限制了自己的思维，当发现规范有问题的时候，要及时去修正，而不是做了一次之后，一直沿用，永不修改。
网页设计完整流程 第2篇
行高可以理解为一个包裹在字体外面的无形的框，字体距框的上下空隙为半行距。
参考 W3C 原理，眼睛到屏幕的距离 25cm 为最佳阅读距离。
西文的基本行高通常是字号的 倍左右。而中文因为字符密实且高度一致，没有西文的上伸部和下延部来创造行间空隙，所以一般行高需要更大，根据不同人群的特点（儿童、年轻人、老年人）以及使用环境，可达到至2倍甚至更大。
关于文字版权问题：
设计中常用的图标，从使用的用途来说图标分为两种，功能性图标和展示性图标。
网页设计完整流程 第3篇
在figma里面，你可以无缝完成从设计到原型演示的切换，不需要反复同步设计图到第三方平台，并且可以利用Figma Mirror在手机上预览效果。单击播放图标将进入演示模式，可以在其中实时查看已完成的原型。
（2）实时协作+内置评论
在Figma里，设计和协作可以是同时进行的，任何人都可以在设计图的任何地方添加评论，你可以在评论中@其他人或将评论标记为已解决。
网页设计完整流程 第4篇
利用事物形成的故障，进行艺术加工。特点就在于图像失真、破碎、错位、变形，还有颜色的失真、错位，和一些条纹图形的辅助。
一、界面常用字体推荐
字体的选择是由产品属性或品牌特性的关键词而决定。
一般中文字体种类分为：黑体、宋体、仿宋、楷体等；
英文字体种类分为：无衬线体、衬线体、意大利斜体、手写体、黑字体等。
网页设计完整流程 第5篇
任何大系统中，大部分的效果仅有少数几项变量决定。
用户80%的时间花在了20%的功能上。
法则定律其实看起来有点枯燥，生搬硬套其实并不一定能套上去，列举以上的设计原则更多的是为设计做参考，结合设计原则，是提升设计说服力的有效方法。
一套完整且专业的原型图，除了按照需求文档设计出所有页面，串联页面以外，还包括一些让人容易疏忽的地方，因为原型图所交付的人并不只有需求方，还有设计师与开发人员。
1.原型图标注，画开发看得懂的图
原型图对于设计师来说，是为了查看产品功能页面与逻辑路径。对于开发人员来说，除了产品框架搭建，他们最关心的内容是产品使用中的边界条件、页面跳转关系。原型设计时需要画出功能的所有交互状态，因此原型图标注包括：
网页设计完整流程 第6篇
（1）扁平插画：简单来讲就是把复杂的关系简约化，让画面更加清爽整洁，也是现在比较常用的风格了，很多商务工具类的APP会选择使用这种风格。
（2）肌理插画：顾名思义就是给插画加上了些肌理质感（比如杂色）和光感，本质也和扁平插画差不多，一些想体现质感的页面会用到这种风格。
（3）手绘插画：需要设计师具备很强的绘画功底，也算是插画里面难度比较高的一种。手绘风格的插画运用的也比较广，常见的有一些插画绘本，故事场景设计等。
（4）MBE插画：dribbble的一位设计师创作了这种风格，它主要的特点就是圆润、可爱、呆萌、简洁。在APP中的引导页、启动页和缺省页运用也比较广泛。
（5）渐变插画：有点类似日本漫画场景的感觉，风格特别唯美浪漫。光感比较强，所以也称为微光插画。颜色一般采用相近色，颜色种类不要太多。
（6）插画：立体插画，也就是在二维的空间里表现三维的事物。大多设计师使用C4D设计，PS/AI也可以。
10.中国风
网页设计完整流程 第7篇
1. 完整组件方案：将组件视为一个独立的产品，从多维度，多场景输出组件的方案和组合标准。
2. 组件化思维：从需求出发，拆解页面表达结构和所需组件。
3. 通用页面规则：通用的页面与组件的栅格体系及替换规则。
产品发展日趋平稳时，产品定位和品牌形象已进入稳定状态，参与设计的人越来越多，设计的统一性和效率的问题也渐渐显现，因此，为了保证平台设计统一性，提升团队工作效率，打磨细节体验，这时候就需要我们定义和整理设计规范。
UI设计中，设计规范是一个关键步骤。知名大厂基本上都有一套自己的完整规范体系，在整理设计规范时，以大平台规范体系作为参考，针对产品自身情况增删，整理出我们自己所需要的规范内容，能有效的避免规范内容遗漏缺失。
颜色是设计中最重要的元素，颜色的运用与搭配决定设计的品质感。在UI设计中，颜色的使用规范主要在于：品牌主色、文本颜色、界面颜色（背景色、线框色）等。
不同的字体气质不一样，并且不同场景下带给人的感受也不一样。所以需要在设计的时候考虑到字体的设计效果，然后在设计规范中注明。
在UI界面中，具有标识性质的图形就是图标。作为UI设计中重要的设计木块，产品的每个页面中都有可能存在图标。设计规范中，图标一般按照用途分为两类：应用图标、功能图标。
网页设计完整流程 第8篇
很有名的原型设计工具，也算是日常工作中最常用的原型工具，成名很早，很多设计师、PM（产品经理）都有用它，它除了能够高效率制作产品原型，快速绘制线框图、流程图、网站架构图、示意图、HTML 模版外，还支持javascript交互的实现，并生成Web格式上传到Axure share分享浏览。
当然，目前市面上有很多种原型工具诞生，例如墨刀、摩客、ProtoPie等，都适合用于原型交互设计，当然选择哪个工具要看你自己，你的需求是什么，最适合自己工作流程的工具是哪种，有没有电脑系统的要求等等。