分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
汉字的黑体是依据西文无衬线体特点所创造，黑体起初只有一种笔画粗细度，由于汉字笔划多，这会导致小字清晰度较差，所以一开始主要用于标题设计。
随着制字技术的精进，黑体具有了不同字重和宽窄的字形，让黑体应用领域更为广泛，无论标题、内文还是注释都可以胜任。
尤其是随着20世纪末电脑和互联网的普及，黑体字的价值得到了进一步体现，它简洁的笔画特征与屏显介质特性相符，从而成为了当今各种屏幕媒介中最有发展前景的字体。
黑体高度的统一性，可以让字体本身对眼睛刺激降到最低，而把更多的注意力放在文字表达的内容上，特别适合段落性文字的编排，成为正文使用的首选字体。因为正文强调的是字体“读”的功能性，为正文选择黑体可以让读者轻松舒适地进行阅读，专注于文字所表达的内容。
各大字库也开发有各有特点的黑体，其中免费商用的有：思源黑体、阿里巴巴普惠体、OPPOSans、鸿蒙字体。
在黑体基础上又衍生出很多字体，这里推荐的是部分可以免费商用的黑体：
简洁和规矩的黑体在气质上没有太大的个性，它适用的范围比较大，可塑性很强，通过字形的变化，可以表现出不同的气质。
现代、科技
黑体简洁干练和几何化结构的笔画特征，呈现出强烈的现代感，适合表现科技、未来感相关的情景。（如电子、科技、互联网等行业）
正式、严谨
黑体是极具理性风格的字形，没有明显情绪导向也让黑体给人一种中立客观的印象，适用运用在各种正式、严谨和体现安全信赖感的场景。（如政府、企业、医疗行业等）
醒目、冲击力
较粗的黑体强壮有力显得十分醒目，还具有很强的视觉冲击力，常用于促销页面，口号式的标题配上粗黑体才够力道。
浑厚、力量
粗黑体浑厚稳重，具有力量感，适合运用在运动、工业等设计领域。还有着有男性倾向，常用在体现男性产品的设计中。
高雅、精致
笔画较细的黑体结构清晰，没有过多的装饰，显得简约、高雅而精致，有着女性特点，适合运用在服装、化妆品等行业。
案例一
使字体搭配协调的一个基本原则就是选择风格相近的字体。使用同一字族里的字体进行搭配，是最简单、安全的搭配方法。本次案例使用思源黑体进行搭配示范。通过字体的大小、粗细形成阅读的层次感。
西文选择与黑体风格统一的无衬线体“Univers”，粗细尽量和中文相一致。
编排效果：
案例二
第二个案例进行一个运动文案的编排示范。带有强烈动感的书法体，搭配具有力量感的黑体，非常适合运用在一些要体现激情活力的运动、游戏、舞蹈等设计主题，硬朗的黑体与柔和的书法体能够产生强烈的对比效果。
西文则选择与黑体风格统一的无衬线体。注意根据书法字的结构和笔势进行排版，通过对文字大小、位置的调整，让文字看起来更紧密也更有节奏感。
也可以选用与书法体风格匹配的西文手写体进行搭配：
案例三
第三个案例进行一个时尚女装文案的设计示范。本案例选择较细的黑体和宋体进行搭配，字形形成了微妙的对比，两款字体都有着高雅、精致的气质，运用在具有女性时尚特征的设计中相得益彰。
西文则选择和黑体相对应的无衬线体、宋体相对应的衬线体进行搭配。
编排效果：
如果感觉排版太过于规矩，可以尝试加入手写体加强字形对比，打破呆板感，营造更强烈的动感。
黑体无论是识别性、适用面、视觉效果都非常好，新手使用也不容易犯错，缺点是个性不足，用得不好会显得平庸。用好黑体是现代设计师必须具备的基本功，需要大家不断练习来掌握黑体字的使用技巧。
原文地址：艺海拾贝Design（公众号）
作者：邓海贝
转载请注明：学UI网》每天都在用的“黑体”，原来这么排版才好看！
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
但真的是相差很远诶！
我再仔细问了一下，终于知道原因了……
他确实是按照方案做的，但是所采用的，都是宽度和高度，而不是间距。
我说：
『 界面布局的关键不是宽高，而是间距 』
看他相当地不以为然，于是我只好这样从头开始解释：
对于前端来说，界面是一个盒子一个盒子套起来的，而不是像画图工具那样一个图层一个图层叠加起来的。
如果把界面看作一个大盒子，那么里面的模块就是小盒子。小盒子里面会装有文字、图片或者更小的盒子
由于现在很多网站都是响应式的，所以这些盒子一般没有固定的宽度，而是根据固定的边距，来自由伸缩。
Sketch 和 Figma 等 UI 绘图工具，都提供了固定边距的自动布局功能，用的就是这个原理。
上图截自：Sketch
但是因为这些绘图工具的画板里用的是图层结构，所以只能固定元素相对于画板的边距，而不能固定元素相对于模块的边距，除非使用组件。
前面提到了一个很关键的点，那就是「盒子」，或者说框架宽度不固定（响应式页面）。
既然宽度，那么框架的高度也同样是不固定的。
因为页面包含大量固定字数的文字或者固定比例的图片，在宽度不固定的情况下，高度自然也没法固定了。
那么既然页面内的元素无法固定高宽，那么什么才是固定的呢？
答案是：
你可以想象一下栅格伸缩的情景，原理一样，只是真实页面上栅格替换成了各不相同的边距。
也就是说，设计师最好是一开始和前端交付时，就明确设计稿上各元素之间的边距，而不是高宽：
这一点，不但一些设计师不清楚，很多前端也不清楚。只是设计师不清楚是因为不知道前端原理；而前端不清楚，是因为他们不在意相应布局的视觉效果。
不过，虽然框架不固定高宽，但是按钮、图标、LOGO 等小元素，通常还是固定高宽的。
一些设计师向前端提供文字参数时，只提供字体和字号，结果出来的效果还是相差很远。
通常来说，最容易产生问题的参数就是「行高」了，因为浏览器的默认行高是 100%，而很多系统平台都有自己的默认行高。
所以说，行高一定要明确才能确保效果，而且最好是提供百分比而不是数字，这样就能够跟随字体尺寸按比例变化了。
除此之外，还有「段落间距」和「字间距」可以注意一下，不过使用率较低就不多说了。
我知道现在有很多工具可以查看设计稿的尺寸，但是如果前端是新手，也会 get 不到你的设计规范。
标注的时候，就可以只挑关键参数，即：字体、字号、行高、边距、色彩。
其实，如果你知道哪些是关键的，需要标注的东西也没有特别多，比以后东拉西扯地沟通细节高效多了。
很多设计师看了上图的标注，也许会惊呼“没必要”吧！
这说明你的前端同事很优秀，不需要解释太多。
可即便前端同事再优秀，按钮是否要自动灵活伸缩？按照文字内容还是按照界面宽度伸缩？这些东西，也还是要他们自己来“猜”。
像我这样对自适应方案想得比较多的，就更加倾向于标注清楚些。
如果你有一名优秀而细心的前端同事，那么以上都不是问题，可能你根本不需要知道也能好好合作。
但是设计师的工作生涯中难免遇上几个难对付的前端，多点沟通技巧，也可以让自己心情愉快些。
原文地址：体验进阶（公众号）
作者：设计师ZoeYZ
转载请注明：学UI网》前端保证一比一按源文件做，结果又是惨不忍睹
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
设计行业每天发生着翻天覆地的变化，随着专业的发展，我们也在不断的学习新的技巧和趋势，但同时我们也要明白，设计中那些基础的UI准则，才是好的趋势和风格建立的基础。今天我们就一起来聊聊做好设计最重要的能力之一：区分视觉层次。
视觉层次不仅仅包含文字有关，它还包含我们的图片，视频按钮以及文字以外的视觉元素。所以当你设计一个网页时候，除了网站整体的颜色，排版，图片也能够影响视觉层次。那么如何让设计的层次更清晰，常用方法有哪些，今天我们一起来聊聊关于设计层次，希望可以帮助到你。
▲如上图插画的比重很大，在设计这种大的元素时，你的每个元素比例和细节处理都被同时放大了，我们可以看见这副插画四周还运用了很多元素，让页面达到平衡，同时这个画面和旁边的文字场景也很好融合在一起。一个好的设计一定是通过视觉手段让用户理解信息更加准确，在看完页面文字和图片后，很自然的引导到底部的按钮，这才能算是一个很引人注目的设计。
更多设计文章，设计交流，欢迎添加 | 微信ddm7212
关注#公众号：SKY盖哥 ，第一时间获得设计干货和分享内容。
▲设计师熟悉的medium官方App设计，在正文阅读时，同样采用不同的视觉重点来突出重要信息，比如左边通过字重以及文字背景绿色底色和正文对比，非常醒目。右侧通过浅绿色作为背景强调突出。
▲同样在一些重要位置，Medium也是运用视觉重量处理，如左图通过顶部提示条提示可以通过语音播放，在右侧付费文章通过行动按钮引导用户升级付费。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
文章来源：站酷 作者：我们的设计日记
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
首先定义下所谓行业。美柚是一个工具，但也不仅仅只是一个工具。我们致力于为女性提供一种新的生活方式，提供包含健康管理、问题解决、娱乐交流、电商购物等服务。
从功能上进行拆解，把美柚可以划分为工具、社交、电商、母婴四个大类。
在这四大领域中，我们从易观千帆、艾瑞指数、七麦数据、蝉大师等相关指数平台，筛选相关行业的主流应用进行分析，总结出2021年美柚相关行业设计趋势。
所选应用应该也是我们日常生活中大家比较常用的，工具类所含的「健康医美」也是近年来比较受关注的一点。
整体分析将从视觉表现以及人文关怀两方面展开。7:3的内容比例，以下分析案例包含但不仅限于上述20个应用。
互联网行业发展日趋成熟，早已进入争夺用户时间的阶段。不计其数的应用，多元的信息，都在促使我们需要一开始就吸引用户。
对于品牌色的选择，并不只取决于应用本身，还有「竞争」，如何在成山成海的应用列表中一开始吸引用户，给用户留下深刻的印象，是定义品牌色时需要思考的。
这几年，有许多应用对其品牌色进行调整。强如国民级应用-「支付宝」和「淘宝」，也需要在被追赶的压力下不断调整策略。大多调整方式，是轻微变动其色相外，提升色彩的饱和度与明度，让产品本身更跳跃。
将拾色器划分为9宫格，通过对所选应用主色在拾色器中的观察，可以发现大部分APP主色的趋势为：高明度、高饱和度的色彩。即拾色器的右上角区域。
母婴孕育类产品的主色选择则更偏向中度饱和。颜色饱和度更多偏向中右区域，这与品类本身柔和的气质息息相关。
从趋势上来说，更加明亮饱和的色彩能在一定程度上更加吸引用户的注意力。当然，并非一味的高明度、高饱和度色彩就是最好的，仍然需要根据产品特性及方向进行正确的决策。
日常生活中，如果一件物体过于锋利，就显得不够安全，比如我们常见的锤子，剪刀，给人的感觉都很尖锐。圆角矩形在生活中也是非常常见的，如电脑、平板、桌子等等。巴罗神经学研究所关于“角”的研究发现：角的突显性感知与角的度数的线性变化，锐角比钝角产生更强的虚幻的突显性，因而圆角的设计比直角更具有温度感。
苹果新系统（Big Sur），窗口四角从以前的10px增加到20px，控制中心也沿用了ios14的卡片设计风格和布局。微软win10的概念稿中也出现了圆角。我们可以确信，圆角矩形将会在未来一段时间内继续风行。
· 边距卡片布局
卡片设计的本质是将信息整合，建立更清晰的页面结构，同时拥有更强的交互能力。 从以下截图中可以看到不论什么行业，卡片布局对于框架结构的承载都是极其优秀的。
· 悬浮卡片
iOS 13开始，模态面板采用新的卡片形式。模态面板在操作时会有一个纵深的效果，适用于单手操作。在Apple自带应用中，模态面板得到了广泛应用。
悬浮卡片在各大应用中的运用率极高，不止在于模态面板，也可以作为模块区分。模态面板一般悬浮卡片有吸顶操作，而仅作模块区分的悬浮卡片会跟随内容移动。
· 大圆角
既然这个趋势点命名为「大圆角卡片」，那么大圆角是必不可少的。
基于移动端屏幕质量的进化，能更好的呈现圆角的质感，圆角开始被广泛使用。从苹果手机的进化，我们也能明显感受到其圆角的变化。随着全面屏时代的来临，圆角的弧度也越来越大。
可以感知到现在各大应用中的圆角相较于以往都是成倍数的增长。
圆角卡片会成为一个趋势，主要在于两点：一个是技术升级，现在的设备都能更好的对圆角进行渲染；
二是我们视网膜中视觉最敏锐的区域叫中央凹，它在处理运行时最快，圆角矩形在视觉识别过程更容易。
过渡柔和的轻量渐变越来越受欢迎，其简约兼顾美感的同时，也可以创造轻松、温暖的氛围。回顾过去一年，关于色彩的运用，在渐变色的使用上越来越理性和克制。
观赏下追波上几个轻量渐变的作品，可以在展示时作为背景使用，也可以在页面背景上直接使用，都拥有不错的视觉效果。
实际案例中，考拉、淘宝和小红书的几个页面背景都使用的轻量渐变的效果。我们常常使用的视频软件 腾讯和优酷 也开始在页面背景中使用轻量渐变进行氛围烘托。
除了页面背景，在单独卡片背景我们也可以看到越来愈多使用轻量渐变的效果。这个位置渐变的使用会更加克制一些。
磨砂玻璃主要基于「背景模糊」的效果。与过去的毛玻璃有所不同的是，磨砂玻璃模拟现实玻璃的效果，具有更强的通透感和层次感，带有柔光的感觉。
一样磨砂玻璃的技法，不同的色彩与透明度，所表现的效果是有区别的。
实际运用中，图标和图片都可以做磨砂效果。
玻璃效果的图标层次感更好，有效提升视觉表现力。不过如果大片运用的话可能会引起视觉疲劳，能否成为一个成量级使用的趋势还有待时间的考证。
彩色背景或图像经过玻璃效果的叠加显示更加柔和，同时不影响前置文本的可读性。这一点我觉得未来可能会运用的更多。
这里需要着重强调下「系列」，是一整组的彩色图标。
过度的使用高饱和色彩会引起视觉疲劳，在同一场景下，一整套多彩图标偏向使用更加温和的彩能传递平静且更加柔软的情绪。
大部分彩色系图标处理方式有这几种方式：
它们的统一特性就是成系列的彩色图标，饱和低不高，视觉感受轻松柔和。
手机屏幕进入高分辨率时代，屏幕色彩也更加的准确，现代的前端框架可以承载更加精细的画面以及减少页面的加载时长。三维可以创造更多元的设计感官，在UI中开始变得越来越受欢迎。毋庸置疑，3D在2021年会变的更加流行。
3D可以塑造更强的空间感。在UI运用中的3D效果不追求过分逼真和完全拟物的光泽感，以简约的造型和丰富明快的颜色提升设计感。
视觉三维化以更加立体、更具视觉冲击力的形象强化用户对内容的感知。IP形象三维化可以给用户建立更加立体的品牌认知。也可以运用在运营图中增加图片的冲击感。
图标三维化，在立体感上可以再稍微弱化。Big Sur系统采用拟态图标，既是一个新尝试也是开始。我们可以大胆预测，未来将会在更多设计中看到轻拟物图标。我们可以大胆预测，未来将会在更多设计中看到轻拟物图标。
在时刻需要掠夺用户注意力的时代，极简扁平的视觉已到了极限。但全局拟物的设计势必影响信息获取效率，因而轻拟物图标一般运用在关键功能入口上，不适宜大面积使用。
大数据时代，数据的展示是必不可少的，借助图形化手段，更加清晰有效的传达信息。让美学和功能齐头并进，整合稀疏而又复杂的数据集，这就是我们常说的数据可视化。
也可以理解为我们常说的图表，看下实际案例中，不同行业有关数据的展示都进行了可视化表达。
大数据时代加快科技、社会发展的速度，同时也让网络时代下隐私保护的伦理问题进一步演化。互联网便利的同时也滋生科技隐私的信任危机。
隐私保护技术不完善、法律不健全、意识不充分；国内尚在制定中的《个人信息保护法》无一不在提示我们应当关注隐私保护。
投射到应用中，我们如何能做的让用户感知自己隐私得到保护呢？
在互联网、大数据的支持下，应当具有满足人的各种需求的属性。一般来说，智能化我们都在说某一个系统或者设备，其实APP应用也可以通过细枝末节的展示给予用户智能化的感觉。
· 记住用户的选择
饿了么提交订单页面，当你选择以后都需要餐具，后续每一次订单都会默认「需要餐具」。记住用户的选择，不要让用户总是重复同一个选择，提升操作效率。
· 告知用户进度
keep进入「我学过的课程」会显示上次学习时间，在相关课程详情页帮助用户记录训练次数。告知用户进度，不会疑惑当前事项是否曾经操作过。
我们说了很多年的情感化设计，今天来说说更加生活的情感化，我在这里称它为「生活化」。在更加浮躁的网络时代，以更加生活化的情感来贴近用户，引起共鸣。
薄荷健康首页每天都会出现不同的壁纸，上面都附有很诗意的句子，如“你做三四月的事，在八九月自有答案”，“要有大大小小的期待，生活才不会百无聊赖”。看着是鸡汤了一点，但是感觉阳光灿烂的一点呢。
丁香医生下拉刷新随机出现的文案也是非常生活化，“耳屎不用掏的太干净”“口水消毒不靠谱”“脚臭的不一定有脚气”，诸如此类，既贴近生活又带点小科普，非常符合健康应用的调性。
趋势具有周期性且永不止息。我们无法预知未来什么样的设计会脱引而出引领潮流。我们能做的是先行感知可能成为趋势的设计，在变革到来之前拥抱变化。
流行是量级，趋势是方向，一个流行的设计是否成为趋势要在一个周期内的量来判断。苹果作为硬件乃至互联网行业的先驱者，他们的每一次设计变革较大概率上都预示着视觉的革新。
原文地址：站酷
作者：草莓设计说
团队：美柚用户体验设计中心
转载请注明：学UI网》实例解析2021年UI设计流行趋势 — 美柚UED
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
近几年随着IP越来越火，很多小伙伴们都开始尝试做IP衍生周边开发，那么面对众多IP我们动漫的IP该如何去做商业化开发呢？经过摸索和尝试，这里总结了一些经验跟大家简单的分享一下。
本篇主要内容分为两个模块：
一.IP种类的浅析及两者的差异点
二.内容型IP如何做长线设计规划思路
IP这个词每个人都有不同的的见解，网上可以搜索到各种专家的解释，这里就不做过多的说明。但是结合过往的项目经验需要小伙伴知道的是IP其实可以统分两大类：
（图片来源于网络，侵删）
内容型IP就是类似狐妖小红娘、一人之下、火影忍者、漫威系列、迪士尼公主系列等有一定的世界观、历史、人文、故事等内容为基础构建的世界；
形象型IP就是类似kakao、熊本熊、Molly、BT21等由一些通信、艺术家或者明星等为基础演化出具有独特性的品牌形象。
虽然故事型IP和形象型IP在商业化时都可以进行漫画、动画、游戏、周边等内容的开发，但是实际接触下来，我个人认为故事型IP要比形象型IP更难开发，原因如下：
（图片来源于网络，侵删）
那么，像我们几万部动漫基本全是故事型IP，在商业授权设计中我们又是如何辅助业务去做商业开发的呢？接下来就给大家简单介绍一下，我们是如何做长线设计规划的。
流程如下：
【Step 1-认识自己】
这个就跟上战场前先检查自己的装备一样，才能明确的利用现有的优劣势及时调整作战计划，一般从以下几个方面着手：
优势：我们拥有很多优质且知名的IP，通过平台的运营IP的生命周期都不短，很合适做商业化开发，也有一定的粉丝量积累
劣势：关于作品前期内容设定是缺失的，这意味着后期我们需要花费很多时间和精力做内容整合，来统一标准规范
优势：拥有互联网相关的运营、UI、品牌等维度的设计资源
劣势：缺乏对IP商品化相关的设计及生产工艺等内容的设计资源，等于是一穷二白从零开始搭建团队
【Step 2-认识行业市场背景】
【Step 3-明确的授权设计流程】
设计是服务业务的，最终结果都是以业务目标为导向的，所以我们一定要清晰的知道业务的商业授权路径是什么，才能有针对性的知道设计流程是什么。
完整的商业开发流程，从最开始的内容整合到落地成商品，需要经历多个环节和不同团队的协作完成，而商业授权设计在整个链路上都需要前置参与并从中获取关键点：
【Step 4-人员配置设计】
【Step 5-系统的设计方案及执行】
那么针对设计流程如何规划设计方案呢？我们拿《狐妖小红娘》来举个栗子：
1-前期资产整合，由于IP商品化是部门新拓展的业务，整块内容处于零基础阶段，所以我们首先需要快速学会走起来，一步是整合内容，一步是基础规范搭建，来形成统一的对外标准规范，让整块机制运作起来。
2-中期补齐模块，在核心内容搭建完毕后，这时我们需要结合业务细分模块诉求找到快速推进SKU增长的方法，学会稳健前进，以下是目前我们常用的4种设计策略：
2.1 贴图设计
2.2 定制设计
2.3 功能设计
这类商品设计更加考验设计师对商品工艺以及其他领域的知识积累，因为需要打破壁垒做双向结合设计，比方说现在的暖手宝和小手办的结合，不仅可以暖手还可以随时替换小手办，赋予了新的功能，多方位满足用户使用和观赏的体验，这类设计不仅开发周期长，需要储备的知识量也很大，也很消耗资源，但是能够在具备“颜值”的情况下增加更多趣味性，助力业务扩展更多商机。目前市面上这类产品也不是太多，
（图片来源于网络，侵删）
2.4 品牌设计
以上的几种设计思路，多数针对大IP商业化年度项目规划，即保证了IP整年度商品运营规划，还可加强品牌效应。像我们的《狐妖小红娘》着重抓情人节来做品牌，其他定制设计会跟随电商重要营销时间上，贴图设计就可以填补全年空缺满足日常消费
3-后期下沉市场，我们除了服务IP粉丝外，业务的最终目标是进军大众消费市场，那么就会涉及到更多产品的垂直开发以及不同消费人群的定位，这就更加需要设计从消费者的角度考量商品本身的材质、卖点、功能等内容做深入研究
以上内容基本是动漫IP商品化的一些思路分享，希望这些浅薄的经验可以帮助到正在做IP商业化的小伙伴，如果想要进一步深入了解相关内容欢迎一起相互探讨和学习。
原文地址：TCD设计中心（公众号）
作者：Limit钱
转载请注明：学UI网》浅谈动漫IP商品化设计思路
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
最近我们产品做了一次全新改版的项目。作为此次项目的设计师，从项目的前期分析、设计、交付开发、验收上线，整个流程，在项目走查验收阶段我们设计师投入了30人/天！在我们觉得应该设计投入最少的阶段，却占了我们大量的工作 且最后还原度也远不达预期。
在这个项目中我遇到了哪些问题：
还原问题不单单是设计师把设计稿做的多精准，标注的多仔细，这么简单就能解决的。是设计和开发，团队之间的合作共识问题。我把整个和开发对接工作分为前中后三个阶段，在这里从头来梳理一下，聊一聊设计师和开发如何高效对接，也是对自己的一次复盘总结。
在评审环节，设计师本人一定要将自己的设计稿进行宣讲、帮助开发理解。注意给技术讲述一些适配要求、设计规范、交互状态及动效等，同时解答技术同学的一些疑问，这样就能将一些可预见的问题解决掉，解决后期的沟通成本。
有一些地方有多种实现方式，如果前期没有跟开发沟通清楚，就会导致最终实现的效果存在误差，比如：下方这个tab项，单给一张图，开发根本不知道设计师想要的实现方式是什么，固定间距还是固定菜单宽度，还是每项平分宽度，最后很大可能就会按照自己的理解去做了，导致出现重复返工的现象。
再比如一些点击热区，如果不手动标明，有可能就做的很小
下图是我们手动标注的热区
每个开发负责的具体页面模块不一样，别人对具体了解程度也不会不一致，所以在评审会议上，一定要具体开发者在场，如果对应开发没有发表意见，设计师可询问，确保他已经理解需求。
设计师在讲解自己的要求后，开发也要及时反馈是否有还原困难，如：是否有技术限制？是否有组件改动困难（牵一发而动全身）？实现成本过高（投入产出的性价比不够）？等意见和原因，设计师也可抛出之前是否遇到过类似的阻碍，帮助开发去了解。
评审过程的问题和重要讲解点，一定要记录下来，会议中开发提出的一些问题及解决方案、或者没有达成共识的地方，记录下来等领导决策，在会议结束后以邮件形式、或wiki文档发送前端们，抄送产品，确保会议内容的传达到位。后面也好跟踪。
还有一点就是，我们之前遇到的情况，在宣讲会上 讲解的一些要求，开发在做的时候可能就忘记了，让开发改他认为设计没有明确要求、会有点难推动，就会搞得双方都有抱怨。有会议记录也可避免此类情况发生
在前面我们做了详尽的沟通和评审，但有时也避免不了在开发过程有些问题才发现暴露。这个就需要开发同学能重视还原问题，积极沟通反馈，和设计确认商议 是否有其它可替代方案，切勿自己发挥，等到后期验收的时候才说出问题可能会影响进度
开发者在完成自己负责的模块界面时，可自己对齐设计稿自查一遍，参考【3.1验收标准】的表格，可帮助判断问题，在此阶段也可发给设计者确认效果。
这里可以提前在项目排期阶段，设计师将所需的验收工时同步给技术和测试，将验收时间考虑进去
为什么要求测试同学保证还原度至少在70%呢？
因为如果不要求测试走查还原度，设计验收的时候就会有大量的问题，最后变成设计在测试界面而不是验收。设计师不像测试对整个流程的测试配置那么熟悉方便，反复验收需要测试和设计不断配合，双方的工作量都会加大。
理想的状态应该是测试整个流程走通，视觉和交互还原问题也要着重测试，设计和产品在测试没什么大问题后再进行验收。
参考【验收标准】的表格，可帮助判断还原问题
最好是提前知道模块的开发者，这样验收的时候一对一进行模块的打版验收效率更高
技术对功能上的BUG，可以自己很好的判断哪些是严重的紧急的，但对于视觉和交互层面的感知就比较低。在提问题单的时候，我们可以帮他标注出优先级，告知开发哪些是比较严重的需要优先修改的，不然 开发自己很难判断，可能就会挑一些比较好改的先改了，重要的问题反而被搁置了。尤其在项目时间比较紧张的时候，有优先级标注 开发能够看出哪些是可以为项目进度做出妥协的，哪些是必须要修改的。
设计提BUG单的不能简单的说这里出错了，请参考设计标注重新调整。要直接给出正确的尺寸、增多少、减多少、这样可帮助技术提高更高效率，也能避免开发自己去看又出现误差、又要返工修改。
设计师在验收过程中容易遇到的一个比较头疼的问题就是，技术和产品小伙伴可能因为项目上线时间紧，觉得视觉还原和页面交互体验上的问题不重要不给予修改，优先保障功能上线。
除了这些原因，设计侧也在检讨总结，自己有哪些做的不足的地方，所以 以上文档也是对接下来工作的优化方案。设计还原度也是日常考核之一，需要大家重视，好的产品要严格把控精心打磨，希望这次的总结、相关流程和经验，在接下来工作中能够提升设计验收效率和还原度。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
文章来源：站酷 作者：飞行的考拉
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
带有错误提示的图标有助于用户更快地识别错误的位置。输入信息时，在有限的空间内，错误提示往往被设计的非常有限。
常见的错误提示的结构是文字+颜色：告知用户错误的原因并改变输入框的颜色状态。在这个基础上，再添加错误图标，构成文字+颜色+图标的提示结构，可以让整个提示状态更全面，用户也能快速明确地感知到问题的所在。
常见的错误提示只是单纯地告知用户做错了什么，并不能告知用户应该怎么做才正确，这也是令很多用户头疼的地方。
在设置密码时通常对密码有一定的要求，例如至少8位数、包含大小写字母、包含特殊符号等，这些复杂的提示往往会让用户摸不着头脑，不能做到第一时间了解情况，造成密码创建失败。
当用户创建密码失败后，如果只告诉用户密码创建失败这样一个结果会让用户感到很疑惑。比起结果，用户更想知道的是应该怎么创建才是正确的，通过给出明确的引导，让用户知道应该输入什么才是应该重点考虑的地方。
左侧页面的背景为纯灰色(242，242，242)，右侧背景色为蓝灰色(228、235、242)。
通过对比能够发现，蓝灰色调对我们的眼睛来说更自然。在设计中，尽可能让页面背景的灰色偏冷或偏暖，而不是使用纯灰色，这样设计的页面看起来会更舒服。
复选框(Checkboxes)通常有一个或者多个选项供用户选择，用户可以选择一个也可以选择多个。
这里需要注意的细节是选项有全选中和未全选中两个状态：
如果里面的选项没有被全选中，复选框需要有一个和选项不同的状态提示，告知用户框内有未选择的选项；当选项全被选中时，可以用统一的标识来告知用户。
搜索是产品必备功能之一，功能强大且方便。
当我们输入内容进行搜索时，搜索框会联想一些关联的关键词供我们参考和使用，这样的提示可以提升用户的搜索效率，节省输入时间。
在关键词联想的基础上，我们可以把搜索体验做的更好！在联想关键词的同时，突出显示输入的内容，这样就可以快速识别提示的其他内容，既突出重点又节省时间。
出现空状态时，没有要求页面必须是空白的。可以适当添加一些元素，如插画、动效等，让用户感觉更舒服。
如果想让空状态变得更好，可以给出具体的操作提示，告知用户如何进行下一步，尝试引导用户到正确的地方。
上图两个弹窗看起来很相似，唯一的区别是状态图标的不同。左边的图标是通用性的，右边的更符合当前的状态。
交流和沟通不仅仅只通过文字。图像、图标或插图都有助于用户识别所执行操作的状态。
这个方法常用于一些特定的解决方案上。通过在面包屑导航上添加颜色，可以告知用户可点击的导航类别，并提示用户具体的位置，更加方便操作。
很多设计软件中预设的默认阴影看起来都不是很舒服，需要我们自己来设计一些柔和的阴影效果。
要始终秉持对设计作品负责的态度，不能为了方便而使用了糟糕的阴影效果，这样带来的后果可能是整个作品的不规范，得不偿失。
中性色有助于在页面中建立平衡，更具有吸引力，然而使用太多的灰色调却很容易破坏页面的这种和谐。
在整个设计中保持相同色调的中性色，可以将颜色选择器切换到HSB模式，通过改变数值能很方便地调节颜色关系。
通过这些实用性的设计细节，希望能对你的工作带来切实的帮助。在设计中想的更多、更全面一点，不仅能提升自己思考的维度和深度，还可能让产品和体验上升层次。
原文地址：CLIP设计夹（公众号）
作者：Clippp
转载请注明：学UI网》细节见真章！有效提升设计体验的10个细节
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
除了刚刚有说到的资本慢慢向B端市场的蓝海转移，还有一点就是中国互联网环境的迅速发展，智能手机的大范围普及，工作人群的年轻化，使得人们已经熟练的掌握了各种软件的使用，并且在快速迭代的产品中慢慢变得挑剔、谨慎。
并且不断优化迭代的互联网软件产品也在无形中为用户完成了底层认知的搭建，一些功能、操作、交互逻辑已经深入人心，用户也已经被教育成了”高玩”。
所以如今一些新型B端产品的设计理所应当的在用户体验五要素中最贴近用户的结构层、框架层 和表现层中与一些C端产品在一定程度保持了一致，这种设计理念其实也很好的解决了传统软件的复杂、门槛高、难用等痛点，很大程度降低了用户的认知成本和学习成本，把高效、简单、易用的工具带到大家的日常工作中。
对这个概念的理解我认为是：”B端产品在使用体验和视觉感受这两个方面和C端产品接近”。这是我们设计师需要特别关注的，传统的思维中，大多数设计师会认为B端是给公司内部人员或者商家使用的，只是一个管理系统，并不需要太过于精细，至于体验也是停留在“能用就行”的程度。但是在我看来不管是C端还是B端，其实它的使用对象都是“人”，应该要遵循人们对于事物的认知和一系列复杂的人体工程学操作习惯。两者都需要关注用户在使用时的体验感受，顺畅的使用流程、清晰的信息展示和高效的行为效率，以及有效的引导都能够快速的帮助用户完成目标任务。无论是C端设计还是B端设计，满足这些条件无疑可以给用户带来更好的体验。
但是也不能以偏概全的认为C端的设计思维可以完全复用过来。B端产品的场景其实比C端产品还是要复杂的多，应该说是各有各的侧重点，思维和设计模式上不能完全照搬，下面我就先说说它们各自的不同处，再举例带你看看B端产品在哪些方面可以向C端产品借鉴学习。
1.使用者不同
B端使用者多是同一个组织集体，以群体为单位进行协同。比如：老板、部门主管、员工或商户。而C端使用者相对比较单一，目标用户群体即是主要使用人群，使用目标、偏好、个性比较明确。
2.业务不同：
B端业务大多数会存在多重维度、场景，使用场景跟业务紧密相关，同一个系统不同角色使用时的业务处理和所关注的数据信息，侧重点会有很大的不同，需要全局考虑。不同角色使用产品的流程差异大，需要不同业务上更专业的解决方案。而C端业务一般维度比较单一，业务逻辑相对固定，任务路径和展示内容比较单一。
3.价值主张不同：
B端注重效率、成本、管控、数据分析等。追求产品的稳定性、业务的增长性，保证产品性能和技术上的安全性。而C端注重用户的体验、使用简单、有乐趣。
4.产品思维不同：
B端产品多数基于服务思维，工具化思维，更加理性；更多的是帮助B端用户提高效率，完成业务目标。而C端多数为产品化思维，游戏化思维，更感性，更多的是娱乐和情感的满足。
5.产品形态不同：
B端产品注重业务的梳理，多数会用到图表、表格、模型，多数产品形态偏向更垂直行业或更专业的面板形态。而C端更注重用户的感受，会用到很多夸张的动效，炫彩的颜色。
1.结构层
结构层确定各个将要呈现给用户的选项的模式和顺序。结构层是用来设计用户如何到达某个页面，并且要考虑他们完成事情之后能够去哪里。
具体在B端产品的表单交付场景下可以体现出，以前的B端表单往往过于冗长，借鉴C端一些注册场景的设计，把表单拆分成3步内的行为步骤，减少用户的疲惫感提升体验。
2.框架层
产品的框架层包括：按钮、控件、照片、文本区域的位置。框架层是用于优化页面设计布局的。
具体在B端产品的列表页可以体现出，列表页中整体的按钮、文本区域的位置、搜索和筛选的布局设计其实与C端产品中的商品详情页是类似的，遵循用户的阅读顺序和视觉焦点来进行设计。
3.表现层
视觉、听觉、（触觉）的体验设计。多体现在一些情感化的设计也被运用在了B端产品中。
反观现在C端产品的一些设计风格和流行趋势，有哪些可以运用在B端产品的设计中呢？
1.3D化
B端因为对数据的展示有较强的需求，用户在使用过程中提高效率的判断纬度也包括信息数据的获取效率，而3D的视觉在数据可视化层面有着天然的优势，可以帮助用户更快速的理解数据维度所表达的核心价值。近年来网速等硬件设施的升级也为3D化视觉带来可落地的基础，设计师也尝试在产品设计中融入更多的3D化元素。
2.情感化
人们对传统B端产品的印象往往是觉得它们比较枯燥、呆板的，如今一些新型的B端产品的设计理念也试图在抛开用户对于产品的这种既定印象，所以很多产品在往一些娱乐化、IP化的方向尝试，并且都达到了一些比较好的效果，未来在这方面的思考和尝试只会越来越多。
3.个性化
B端产品的同质化严重，所以B端产品也需要从一些产品定位去定制更加富有个性的品牌基因，可以让用户产生对产品的感情，达到从同类产品中能够脱颖而出的目标。
不管是B端还是C端，目的都是为了解决业务场景中遇到的问题，使用对象都是人，都应该站在“人性”的角度考虑问题，有人说B端产品一般都不注重设计，C端产品的设计更能满足设计师对美的追求，我只能说它们的侧重点不同，C端更注重视觉感受，要做到在视觉表现的感性层面吸引用户，而B端其实更为复杂，需要做到底层的强大数据处理能力，产品的专业性包括交互、视觉的吸引力，这样才能从众多产品中得到用户的认可并脱颖而出。设计师还需要不断打磨细节和优化体验来吸引和留住用户。
所以说“B端C端化”也只是在某些方面通用，但核心侧重点不同，不能以偏概全、一概而论，但可以借鉴与参考，B端产品也可以做的很精彩。
原文链接：酷家乐用户体验设计（公众号）
作者：方也
转载请注明：学UI网》一篇文章带你深入了解”B端C化”的设计理念
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
编辑导读：随着产品的迭代升级，增加越多功能，设计相对地也会越复杂，用户需要花费更多的精力来理解产品逻辑和使用具体功能。因此对产品进行简约有效设计是十分有必要的。本文作者对此进行了分析，与你分享。
产品是一个功能集合体，随着迭代优化，会变得越来越复杂，这也意味着用户需要花费更多的精力来理解产品逻辑和使用具体功能。因此对产品进行简约有效设计是十分有必要的。简约有效原则跟一致性原则比较类似，本身的含义比较广泛，此文中，对简约有效的原则作如下约定：
“简约有效设计指的是设计方案在满足用户和产品需求的前提下，应该最大程度的降低产品复杂度和用户使用成本，以保证用户使用产品的体验和效率，最终达到为用户和产品提供更多价值的目的。”
简约有效的设计最大特点是“简约”和“有效”。
简约——能降低产品的复杂度
“简约”指的是在满足需求的前提下最大程度的降低产品复杂度。从普遍的角度来讲，一个简约的设计一定能够极大的提升用户的使用体验和产品的使用效率。
有效——能满足用户和产品的需求
“有效”指的是设计方案必须能够满足用户和产品的需求，这是设计最为基础的要求，如果设计方案不能满足用户或产品的需求，那什么样的设计都是没有意义和价值的。
在设计中，遵循简约有效原则不仅可以保证设计方案的合理性，还可以为用户和产品提供更多的价值和服务。
简约有效设计对用户的价值主要体现在提升用户体验方面。
1）降低用户使用的成本，提升产品使用效率
简约有效的设计可以降低产品逻辑结构 、页面布局、交互操作等的复杂度，从而减少用户的认知和使用成本以及提升产品的使用效率。
2）更好的情感设计化
从心理学角度来讲，越简单的东西会越符合用户预期，也越容易获得用户的信赖和好感，而简约有效的设计可以降低产品的复杂度，降低用户的而使用和认知成本，因此简约有效的设计可以有效地提升产品的情感化设计，为用户提供更好的使用体验。
简约有效的设计对产品的价值主要体现在保证产品的健壮性和可发展性。
1）减少产品逻辑的复杂度和耦合度，保证产品的健壮性
产品功能的复杂和逻辑耦合是一个无法避免的问题，越是复杂的逻辑其犯错的可能性越大，其普适性也越差，但利用简约有效的设计可以降低产品功的复杂度，去除不合理的设计，减少各个功能模块之间的耦合度，从而保证保证产品结构的的合理性和健壮性。
2）为产品预留更多的拓展空间，保证产品的可发展性
从设计经验上来讲，产品做减法的成本远远大于做加法。利用简约有效的设计在一定程度上是可以避免产品“过度”发展的问题，因为其目的就是降低产品的复杂度，这也意味着为产品预留更多的拓展空间，保证了产品的可发展性。
简约有效设计的内涵是非常广的，不是简单的删减功能或者减少页面的中元素就是简约有效的设计，其最基本的原则是“先有效，再简约”，即在保证设计“有效性”的基础上，再进行“简约性”设计，“有效”比“简约”的优先级高且重要。设计中，可以从以下几个方面和角度进行简约有效的思考和设计。
设计中的任何逻辑或元素都必须要有明确的目的和价值，如果设计的目的性和价值性不明确或者达不到预期，那么这样的设计是不合格的。设计的目的性和价值性可以说是所有设计的基本原则和要求，同样也是是简约有效设计的重要评估标准和指导原则之一。
简约有效原则本质上就是对设计进行“简化”设计，但不能为了单纯的简化而无限制的“删减”设计，其中重要的一点就是需要保证设计的特征性。设计的特征性能够表明设计的特点，用户通过这些特点性，以快速的辨别，理解和使用产品。例如在剪切板图标中，其剪切的含义就是其非常重要的特征，一般来说就是剪刀元素，而这个设计特征是不能被删除简化的，需要在设计中进行有效地表达。
产品功能结构层次是产品的主要框架，决定了用户的主要体验路径，其设计的好快直接影响了用户体验的好坏。利用简约有效原则不仅可以合理规划产品功能结构层次，还可以降低产品结构层次的“复杂度”，提升用户的使用体验。设计中，可以从以下几个方面考虑产品结构层次的“简约有效”设计。
1）合理的横向和纵向结构层级数
产品结构层级设计中既不能让横向结构层次过于扁平，也不能让竖向结构层次过于纵深，前者容易导致产品功能结构分散和用户认知混乱，后者容易导致用户操作路径过长，操作成本过高。
2）同级结构层次之间的独立性
简约有效的设计可以让产品同级结构层次之间保持相对独立，这样不仅可以减少结构层次之间的交叉和耦合，减少后续产品迭代优化时的“耦合障碍”，还可以保证层级结构本身逻辑的“简约性”。
3）父子结构层级之间的关联性和逻辑性
简约有效的设计可以让产品父子层级之间有含义明确的逻辑性和关联性，从而减少用户的理解认知和操作使用成本。一般来说，父级层次结构趋向于展示概括信息和重点信息，子级层级结构展示详细信息和次要信息，从而使产品结构层级更加符合用户的认知和习惯，提升产品的使用效率和使用体验。
产品中用户的操作任务是相对是确定的，但同一个任务，可以通过不同的方式和路径来完成，其成本和体验也是不同的。利用简约有效的设计原则可以让产品的操作路径更加合理有效，降低不必要的操作和路径，提升用户的操作效率和使用体验。
1）用户路径长度的合理性和逻辑性
用户的操作路径的总长度应该相对较短且合理，一般来说不建议超过5个环节，否则用户任务完成率和体验会有断崖式的下降。此外，用户的操作路径中上下文前后操作节点应该有着合理的逻辑性和关联性，以便保证用户对整个操作路径的理解。
2）单个操作环节的目的性
每一个操作环节应该有着明确的目的和主题，即操作环节需要让用户集中精力处理一个重要的操作任务，不能让没有意义的任务和信息分散用户注意力。
3）单个操作环节内容的有限性
每一个操作环节中，用户需要处理的任务以及信息应该是有限的，不能让用户同时处理过多的信息或者过于复杂的任务，否则会极大地增加用户的负面体验。如果单个任务环节中包含的信息较多或操作任务较为复杂，可以考虑拆分任务和适当的增加用户操作路径的长度。
4）线性的操作路径
不要为用户操作路径设置过多的分支路径或选择，而是应该让用户操作路径趋向于串联且线性的，这样不仅可以降低产品的复杂度，还可以可以降低用户的理解和使用成本，从而提升用户体验和操作效率。
简单有效的页面布局不仅可以更好的帮助产品达到预期目标，还可以极大的提升用户体验。设计中，可以从以下几个方面考虑页面布局的“简约有效”设计。
1）页面布局符合用户认知和习惯
页面的布局一定要符合用户的认知和习惯，否则再怎么“简单”的页面，用户理解起来也会费劲或者产生理解歧义。例如中文用户的阅读习惯都是从左到右和从上到下，用户的操作习惯大多是先阅读信息再进行操作，因此常见的布局都是将操作按钮布局在页面右侧或者底部。
2）页面布局的信息是有价值且有效的
页面中布局展示的信息一定要对用户或产品有价值，如果对用户和产品都没有价值的信息，那页面中就不需要这个信息，这是简约有效设计的基本准则之一。此外页面布局中的信息一定要是有效的，不能让用户产生歧义，从而达到降低用户使用成本和提升使用体验的目的。
3）页面信息布局的规律有序
页面中布局的信息一定要规律有序，其主要目的是方便用户阅读以及理解，从而提升用户的使用效率和体验。让页面中的信息规律有序，最常见最简单的方法就是将信息分类成组后再在页面中展示。
4）避免页面信息过载
页面中的信息密度必须适中，不能信息过载，否则就会导致用户浏览效率低，理解成本高以及操体验差的后果。简约有效原则是避免页面信息过载的基本方法之一，其原则就是重点信息优先展示，删除不必要信息或者隐藏次要的信息，利用不同的页面和层级结构将信息的“复杂度”转移分摊出去，从而保证用户当前操作页面信息密度的合适。
5）页面应该聚焦用户当前任务
页面布局的信息应该与用户当前正在处理的任务紧密关联，不让无关的信息分散用户注意力以及干扰用户当前的任务流程。如在自有账号登录页面中，忘记密码，注册以及第三方登录等次要信息的布局和样式就不能过分显眼，否则就会影响登录页面主要任务的完成——输入账号和密码。
UI设计是产品功能逻辑的视觉化表现，其直接影响了产品的使用体验。与其他设计原则一样，简约有效原则也是UI设计的重要的标准之一，设计中，可以从以下几个方面思考和衡量简约有效的UI设计。
1）一致的设计语言和风格
一致的设计语言和风格可以确保产品在视觉上的统一性和规范性，进而降低用户认知和使用成本，即从视觉形式上和用户认知层面，降低了产品的复杂度，提升了用户信息浏览、理解以及操作的效率和体验。
2）正确无误的信息传递和表达
UI是各种产品信息的视觉载体，因此其一定要能够准确无误的传递和表达出信息的真实含义，不能因为UI设计而导致用户对信息产生误解或者歧义，这也是“简约有效”的UI设计中“有效性”的重要组成部分之一。
3）重要信息重点表达
UI设计需要做到信息表达准确且层次分明，即重要信息重点表达，次要信息次级表达。这样设计的目的就是利用UI设计增强重要信息表达和传递的“简约性”和“有效性”，即从信息层面上降低了页面的复杂度。重点信息重点表达的最基本的方法就是在视觉上让重要信息和次要信息形成较为明显的对比，如常见的文本加粗，使用高亮颜色（彩色）等。
4）清晰正确的逻辑表达
UI也是功能逻辑的可视化载体，因此UI设计一定要保证产品功能逻辑表达的清晰和准确，不能因为UI设计而导致用户对功能逻辑的错误理解。如账户模块中，账号密码的校验过程 和出错提示等逻辑必须能够通过UI清晰正确的表达出来，保证用户在登录过程中，能够通过UI理解这些逻辑，且不会产生任何歧义。
产品功能逻辑设计是产品和用户交互的直接决定因素，可以说，功能逻辑设计的好坏直接决定了产品体验的好坏。简单有效的逻辑设计不仅可以降低功能逻辑的复杂度，还可降低产品的迭代开发的成本和用户使用成本。设计中，可以从以下几个方面考虑“简单有效”的逻辑设计。
1）在保证逻辑完整性的基础上，尽量降低功能逻辑的复杂度
在设计中，保证产品功能逻辑的完整性是基础的且必要的条件，在此基础上，再考虑降低功能逻辑的复杂度，不能为了简约而简约。
2）功能逻辑的独立性
在功能逻辑设计中，应该尽量保证功能逻辑的独立性，减少功能逻辑之间的耦合性和依赖性。因为功能逻辑的耦合性和依赖性必然会导致对逻辑本身和用户产生更多的限制性和要求。此外，功能逻辑之间的耦合性和依赖性不仅会提升产品的复杂度，还会影响产品的健壮性、后续的拓展性以及造成迭代成本的提升。
3）为用户设计，转移逻辑设计的复杂度
产品功能逻辑的复杂度是可以降低的，但是不可能无限制的降低。当无法降低功能逻辑的复杂度时，可以使用其他方法来降低功能逻辑的“复杂度”，最常见的就是“转移复杂”，即不改变逻辑的设计，而是改变这些逻辑的表现形式和方式，将逻辑的“复杂度”转移到不同的功能模块中或者不同的形式上。例如在线请求数据的异常逻辑有很多种，这些异常对于逻辑设计和产品优化是有很大价值的，但对用户来说这些异常可能是难以理解或者是没有价值的，可以将这些异常逻辑进行归类分组，同一组的异常使用相同的提示设计，如网络故障相关的异常，都可以提示用户去检查手机中的网络设置，而不用每一中网络故障的异常都单独设计一个异常提示。
4）提供合理的参数值和默认项
功能逻辑设计中涉及到大量的设置项和参数，为这些设置项和参数提供合理的数值和默认项，可以极大降低的用户的理解和使用成本。例如在地图导航软件中，用户选择导航线路时，需要确定起点位置和终点位置，常见的起点位置默认参数就是当前用户的位置，这种设计逻辑可以满足绝大部分用户在绝大部分场景下的导航需求，减少用户起点位置的输入。
5）更少的操作和选择
在设计中，任何的操作和选择对用户来说都是一种负担，所以应该避免为用户设计过多的操作和选择，较少的操作和选择就是降低产品功能逻辑的复杂度。如果无法减少功能的操作和选择，那么应该优化页面信息层次、操作路径和具体的页面布局来使逻辑操作和选择更加合理，使用成本更低，使用体验更好。
6）为绝大部分场景和用户设计
逻辑完整性是设计的基本要求，但在实际中经常会碰到低频场景、小部分用户群体需求或者大部分用户群体的低频需求等“异常条件”，这些都可能对产品的功能逻辑设计带来影响，但是绝对不能因为这些“异常条件”去更改主体设计方案，即在任何时候，都应该为绝大部分场景和绝大数用户设计，按照经验来讲，是不可能有满足100%需求的设计方案。类似的，我们应该更多的考虑产品的正向使用场景，不要让负向场景过多的影响功能逻辑的设计方案，即这些非正向场景可以为设计提供参考，但不能决定设计方案。
简约有效是一个非常普适性的设计原则，其可以为产品和用户带来非常多的好处，其具体内涵是非常广泛的，其中有些内容不仅仅是简约有效原则独有的，可能与其他设计原则有着较强的关联性和交叉性，如“一致的设计语言和风格”，虽然是一致性设计原则的内容，但却可以让设计很好的表达出“简约有效”。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
文章来源：人人都是产品经理 作者：小乞丐
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
蓝蓝设计的小编 http://www.lanlanwork.com