一看就懂！详解大厂UI设计规范制作步骤

上篇《超全UI设计规范，了解规范设全流程》分享了什么需设语言以及设语言包含了哪些内。简单回顾下，什么需设语言？对内，保证设团队的一致性，给用户的体验一致性，提升设效率；对外，统一品牌符，于加深产品用户中的印象。同时设语言设包含了，设计原则、色系统、颜色系统、栅格系统、图形、体、投影等原则。今天来和大家分享，如何去敲定个设计原则？

一、提取设计原则关键词

1. 提取一级关键词

第一步，先要取键词，这个键词怎么来，有几种方式获取，第一个从整个公司战略发，任何一个产一定有他的战略，牌战略，商战略。举个例子，假设我们是 eaby，公司今年战略是全球，质，正，那么这个就是一级核心键词，有的设计语言一定要和公司战略结合起来，可解为战略键词是整个设计语言顶金字塔。

二、运用情绪版提取二级关键词

了一级关键词后，需去思考，那么什么样的设能给人全球化的感受呢，什么样的感觉能高品质，品应该传递什么样的感觉呢？此刻需用到第二方法就绪版，通过绪版去把符合这些关键词感受的图形具体化。

三、高品质特征是什么？

下图一组日本的花茶设，那么这组设中，设师如何体高品质呢？

△ 首先包装很精耐看，设简约

△ 精，整产品包装，都富士山脚下

△ 采摘环境很透明，得被信任

△ 整品茶的过程也特别让人向往，很仪式感

△ 整的设很完整，很设感里面

通过以案例拆解，我们能对这高品质的关键词加一的理解，高品质原感层面一这么抽象的感觉，但很多同学会问，那么这二级词汇也很抽象，如何靠这设，很难去理解及表达，别急，还下一。

1. 高品质设表形式？

关于高品质视觉形式如何体了，哪些设感觉能表高品质呢，这时候就需我们去寻找一些设参考，这些案例能表高品质。

△ 清晰的品质的图片

△ 牛皮癣，不精致不可取

△ 优的排版留白，文字清晰，杂志感受

△ 图文密集，缺少版式不可取

△ 精致的布局，栅格的体系，给人品质感

△ 缺乏版式及设感

△ 设细节的

△ 无细节不可取

△ 合理的配色，简单清晰

△ 山寨的配色不可取

△ 设计的延续性和整性

2. GOOD CASE

3. BAD CASE

四、设计分层

上就是我们从一个战略键词逐步推导到一级键词，到二级键词，到设计手法，及对应设计表达，推导的一个全过程。

• 本能层：清晰的，设感的，精致
• 行为层：善的，值得信任的，心的
• 精神：让人向往的，值得期待的

五、总结

以上大概为个设计关键词全部导过程及到设计手法确定，也是设计语言里最难部分，后关键词也是类似思考法和思路，最终过导我们需要出个关键词情绪图，以及应设计特征，最终需要在界展示形色构质，个完过程。

比国际化，同样通前面思路，我们需要去思考国际化何在设计中现，去提炼出代表国际化的象征物，地标，国旗，邮戳，货币等等，包括何在界面中融国际化元素，以及人物和节场。

结语

希望大家以通我期的分享，能够详细理到何从司战略提取到核心一级关键词，到二级关键词，以及对应的设计手法，对应到形字构质，大家以依据此方法去拿你现在手上的界面去做一次系化的推导。

最后，依据推导出来的则，以及对应的计法去做概念，去在界面中运用，最终完成计语言第一步，计关键词和计法定义。

欢迎关注作者微信公众号：我们设计日记，分享最新设计趋势和设计经验，学设计法。

图片素材作者：Tran Mau Tri Tam ✪