导言
老生常谈，B端产品的设计原则是什么？
在TXD体验设计团队的业务中，我们的业务场景覆盖了TO G - TO B的全场景，为“建”-“管”-“用”这条完整的全链路业务场景提供着设计和研发服务。
在大量Paas~Saas层产品设计中，面临用户、端、产品复杂而多变的的情况下，我们逐渐摸索到了B端云计算产品的设计风格，随着大量业务产品设计的沉淀，我们利用这一套完整而细致的设计系统来支持产品设计，并提高研发效率。
并且定义这类产品的设计原则为：合理的功能与模块划分、严谨的业务流程设计、一致性的操作体验、干净自然的界面设计。
现在，我们将这些思考和沉淀，抽象成了一些稳定且高复用的内容，打磨出一套服务于混合云全域云服务的体验基建设计系统：Pixel。
除了支持好基准的体验之外，我们也在思考云产品的体验感观的提升，在互联网产品多年的「审美洗礼」与硬件设备的更新下，企业产品逐渐蜕去「花里胡哨」的设计风格，越来越「精致」，这样的「精致感」也逐渐影响着我们，于是在整体的设计中，从信息框架的处理到每一丝阴影的考量，我们准备了这样一个具备「精致感」的解决方案。
信息框架的处理
对信息的处理中更讲究层级的关系，对整体的信息进行归类、分析、定位。形成更适合用户操作体验的框架处理。
合理的功能与模块划分：
- 背景层：页面背景底色的打造
- 内容层：所有数据信息的展现
- 全局控制层：针对整体界面的切换或者操作信息（顶导、左导、底部操作区）
- 临时局：需要用户关注且处理的临时出现的信息。
质感的分层方式
当各种平台都在做一个标准通用所有产品的时候，我们基于更「自然」的原则，提供了多种展现方式。
在图形上，使用了2~8px的圆角，圆角的使用让整体平台看起来更具亲和力，让界面中的小组件之间的关系更柔和且精致。
同时也定义了4种阴影样式，从视觉上辅助区分模块层级，用户可以直接通过视觉层级的变化理解当前场景的信息优先级。
科学化的色彩系统
色彩与情感映射有着紧密的关联。而工作台的色彩需具备以下特点：
- 舒适度高：不能刺眼，满足客服用户长时间注视工作台的疲劳缓解；
- 情绪平稳：过于炫目的颜色会引起负面的紧张和焦虑，不利于日常工作处理。
在定义设计语言的色彩系统时，借鉴了色彩研究中对“视觉疲劳”和“情绪稳定”的色彩推荐值，并在使用了更科学的取色方式，满足W3C的AA、AAA原则，让用户才能更好的识别。 - 用色通识：提供色彩使用规则，解决前端与设计之间的理解gap，快速理解查找正确的色彩。
基于场景的特色模式
特色模式是对局部群体或功能的价值聚合，能更聚焦于某个价值点的打造。以下是对后台产品中特色模式的概念探索：
「暗色模式」：后台用户是高度的视疲劳工作者，暗色模式能满足用户的健康需求。
「最优信息密度」：在不同使用场景的页面提供“宽松”“舒适”“紧凑”多种密度模式。同时满足「阅读型」和「效率型」的页面场景需求。
明确的流程与复用
pixel明确了从项目启动到交付清晰各阶段中可控的流程，确保不同设计师的产出质量相近；
- 团队使用统一协作设计插件kitchen（此处感谢蚂蚁团队），确保文档间的兼容性、协作便利性，快速在线同步。所有在线组件均已symbol化。
- 团队所有资产，沉淀于pixel站点，包含基础组件、业务区块、功能模板、品牌资源等上百类设计相关资源。
- 包含从研究到上线多种设研一体工具。
若有收获，就点个赞吧
0 人点赞
