@设计之青 :最近设计群里经常有人问起小程序设计规范的问题,虽然官方有提供样式库的下载,但是停留在 16 年版,不是最新的。而设计经验这部分网络上也没有比较全面的分享,这促使我停下手上的计划,加快输出本篇文章。正好近期刚结束几个小程序项目,总结下经验,并结合微信小程序的官方设计指南,一起分享给大家,希望帮助大家更快速地上手。
为什么要构建 MIZ Design?1. 背景随着米庄 APP 用户的增长,以及 APP 不停的迭代,我们在设计上积累了越来越多的债务。越来越多的新页面,新功能,以及不同的组件,都是由不同的设计师来设计,前端也是由不同的开发来实现,这直接导致了整个 APP 越来越臃肿无序,视觉和交互体验不一致,且团队沟通成本高,重复劳动力大,输出效率低,迭代速度慢。
在《从零开始画图标系列:超全面的基础知识》中我们知道了,工具图标的三种设计类型,以及对应的不同风格。本篇文章,内容主要分为规范讲解和案例演示两个部分,规范是工具图标的重点。希望读者千万不要跳过这部分的知识讲解直接去看演示了。
文章从建立设计规范的原因、设计规范的适用范围,以及设计规范的制作流程,全方位解答UI设计规范的问题。这篇的基础部分我做的比较详细,组件部分写的有些概括,主要是因为组件部分不是通用的,要根据自己的稿子进行整理和归纳,归纳好之后做好标注和规范说明即可,这部分是一个罗列的内容,所以就不必展开了。当然还有很多内容没有展开说,比如在Sketch 里面把KIT 制作成Libraries 统一使用,但是我想作为一篇设计规范入...
文字是界面设计中最基本的构成之一,如何定义网页设计中的文字系统?可大体分为三步:系统全面地了解文字的基础知识、显示方式、影响因素及当前网页设计中适合的文字系统;梳理出自己团队所有产品文字使用情况;综合第1步、第2步总结出适合团队业务的文字系统。注:网页设计规范色彩篇马上会发布在优设V+会员专栏,想获得整个网页设计规范系列干货的同学,请右戳 → https://www.uisdc.com/uisdc-vip字符屏...
这是一篇 Sketch 进阶教程,让你学会利用 Symbol 建立一套设计规范组件库。文章目录写在前面基础规范图标规范组件规范写在后面为保证更好地理解文章内容,你需要对以下知识点有一定的了解(部分内容已附注释)。1. Text style ¹△ 图片来自Sketch手册在设计包含大量文本的界面时,许多图层拥有相同的文本属性。
橙子的橙子:什么样的规范是适合小公司的我们呢?又是什么样的规范能够真正节省团队时间、提高工作效率的呢?把自己踩过的坑总结记录一下,希望在写给自己的同时也能够帮助大家。
编者按:iPhone 设计规范是每个设计师都应该学会的基础知识,无论你是新手老手,看完本文一定能彻底理解iPhone 设计规范!一、iPhone的历史每次苹果发布会 UI设计师可能是最睡不着觉的人啦。每次发布会苹果推出全新 iPhone 时,我们在 iPhone 平台上的 APP应用程序必须跟随 iPhone 的尺寸、规范等特性调整设计稿。
首先需要了解交互稿和原型图的联系与区别:按照常规的工作流程,交互设计师最终交付的产物包括任务流程图、信息架构图、页面原型图、页面交互说明、页面流程图,这些都可以归纳到交互设计文档中。因此原型图只是交互稿的一部分,本文将铺开阐述设计规范的原型图应该注意哪些。原型图设计遵循的首要原则是:在满足将产品需求转化为界面功能需求的同时,尽可能的维持原型图的美观简洁,人类始终向往和追求一切美好的事物,即便是黑白的世界,一样会...
上篇《超全UI设计规范,带你了解规范设计全流程》分享了为什么需要设计语言以及设计语言包含了哪些内容。简单回顾下,为什么需要设计语言?对内,保证设计团队的一致性,给用户的体验一致性,提升设计效率;对外,统一品牌符号,有助于加深产品在用户心中的印象。
今天分享给大家的是如何定义一套设计语言。设计语言,貌似很火的一个词,无论是国内大的团队还是小的团队,都需要做设计规范,好像没有就不够专业,UED 的价值就不够高,关于设计语言的参考也特别多,最出名的莫过于苹果和谷歌,也是设计语言的鼻祖。一、为什么需要设计语言1. 对内上图,应该是很多设计团队都遇见的情况,一个按钮很多尺寸,颜色,大小,有时候我们已经有了规范,但是由于业务方各种要求,要个性化,要不一样,导致整个 ...
从一开始的立项到现在落地上线,可以说是从零开始进行 APP 全部细节的梳理并且规定规范,这一路走过来还是能总结出很多心得,本文将分为3个部分,阐述如何从0到1建立设计规范。目录如何确定内容,规范里要写什么如何写如何推动规范落地一、如何确定内容?这里我总结了三步:1. 确定目标用户、用户目标、设计目标根据不同的用途和目标,不同的团队对设计规范的制定是不一样。