【产品设计】58的系统性设计，让我收获不小

2021-04-22

4252

什么是系统性设计？

初级设计师做页面设计，虽然单页看起来都很好，但是不同页面之间缺乏统一性，一到开发就有很多问题要解决。

中级设计师做组件设计，保证一个组件可以在各个页面调用，既有统一性，又减轻了开发成本。

高级设计师做模块设计，从一套模版中，可以出现各种衍生样式，以不变应万变。

而设计复杂产品的系统性设计，就是需要更多地使用模块设计，而不是组件、页面设计。

当然，系统性设计不是单纯的模块化这么简单，但这么解释方便理解。

系统性设计的统一感

统一性是用户体验最基本的原则之一。

一款产品不论设计得有多惊艳，如果信息布局和操作方式五花八门七零八落，就一定不会好用。

这就好比一栋大楼里的电梯在每一层的按键区都应该长一样那么理所当然。

对于一个可以无限拓展的系统来说，要维持统一性肯定是有挑战的。

例如一个租房页面吸底栏，对于不同的用户和经纪人的展示不同，有的可以在线聊，有的又不能…而且你永远不能预料以后是不是还会出现其它状态。

而 58 的解决方法不错，新方案让不同类型的房源和不同用户视角的吸底栏都具有很高的统一性。

这样的框架想必可以容纳很多的可能性，除非特别必要，以后不需要频繁重新构思样式。

在一个庞大的系统中，统一性不但能够方便用户习惯使用，也能够方便我们设计和开发人员进行维护。

然而有些地方，却要在统一的基础上强调差异感，以方便用户辨识。

系统性设计的差异感

要在系统性设计中表达差异感，颜色是趁手的武器。

很多大企业，例如 Adobe，都喜欢用形态类似但颜色不同的图标，来表示自己的产品：

这样，既可以让人感觉这些图标都是同一个系列，又能一眼看出并记住他们之间的差异。

但是，使用颜色来强调差异感有一个非常大的限制，那就是人眼能够识别的颜色非常有限！

红橙黄绿蓝青蓝紫，这就已经差不多了。实在不行，勉强把黑白灰紫红加上，就已经负担很大了。

所以说，颜色只能用来区分主要的大类。而要增加更多细分类别，还是得辅助图形和文字。

58 原来的提醒模块，原本没有做任何类别区分，除了文字之外长得差不多。

经过改版之后，用三种颜色区分三大类别，让用户能够快速辨识。

而且在统一的信息布局下，让房源提醒展示房源图片，用户相关提醒展示用户头像，多名用户相关提醒展示多名用户头像…差异性更加自然，切中要害。

系统性设计的等级感

任何一个有人存在的庞大系统，都肯定有等级体系。

因为等级体系可以帮助内部更好的优化提升，帮助外部快速筛选出可信赖的信息。

例如 VIP 用户的相框就是和普通用户不一样，这样才能够体现出等级感。

58 这次改版也在等级感上下了功夫，主要是针对不同房源设计了一套既统一又能体现等级感的分享图。

三个等级的信息布局相差无几，却通过颜色、描述和奖章来体现出不同的信赖/尊贵程度。

总结

不得不说，58 这次改版，真的有明显进步，为他们点赞 👍

你对系统性设计有什么想法？欢迎留言交流～

转载声明：文章来源于网络，不作任何商业用途！

免责声明：本文内部分内容来自网络，所涉绘画作品及文字版权与著作权归原作者，若有侵权或异议请联系我们处理。

全部评论

您还没登录

暂无留言，赶紧抢占沙发

【产品设计】58的系统性设计，让我收获不小

全部评论

热门资讯

视觉设计和交互设计两者区别是什么？

ui设计培训四个月骗局大爆料，你听过吗？

UI设计丨从修改密码需求看「实现模型」与「心理模型」的差别...

【配色技巧】渐变色的配色技法！

如何设计出一个LOGO？

基本形的群化是什么？

ue交互设计师要掌握什么技能吗？

深圳平面摄影培训班一般多少钱？

设计中关于左右滑动的思考

交互设计与体验设计有怎样区别？

热门标签词