“云加”万里信，共赴山海约，解密协同云官网设计之路

门户的设计改版是怎样的？本文从浪潮海岳云加案例出发，手把手带你认识完整系统的门户设计升级。

一、升级背景

1、云加官网作为云加产品对外唯一官方门户，承载整个云加业务售前及售中的核心渠道，是用户接触云加产品的重要渠道之一；

2、云加是浪潮集团结合人工智能、大数据等最新技术推出的一款协同办公产品，线上页面风格元素在快速更迭互联网背景下较落后，所以本次视觉设计重要使命之一是探索前沿的设计趋势，对云加品牌风格进行全新升级；

3、随着云加的不断发展，用户群体及业务的扩大，原有官网内容架构单一无法打动用户查看转化，根据用户浏览和阅读习惯对官网首页内容进行结构上的调整和更新。

二、设计分析

1、发现设计问题

首页信息量大，有首屏广告位、产品功能展示、产品特性亮点、服务案例、下载专区等，展示更多使其抓住用户感兴趣内容点，最终形成有效转化，但旧版官网除了首屏 Banner 区和产品功能介绍外，其它信息屏效较低，我们提供了这么多信息在首页是用户想看的吗？

2、明确改版目标

（1）框架层。重建全新的官网框架内容和设计，让用户更全面的了解产品，展现公司专业、安全、可靠形象，同时提供用户与企业的沟通平台，降低获客成本，提升潜在客户留存与转化率；
（2）内容层。使产品能够快速在线上曝光与迭代，提高公司产品热度，减少广告营销成本；帮助开发者方便高效的自主操作即时发布；
（3）视觉层。提高云加品牌辨识度，传递“以人为本、资源整合”的产品理念；建立品牌影响力，感知客户，服务客户，成就客户。

3、设计关键词提取
（1）头脑风暴 设计之前小组进行了几轮脑暴，结合自身品牌、用户分析、产品功能亮点等，抛出议题：“你认为的云加”应该有哪些关键词组成？

通过系列关键词和产品特性，从体量和角色分析总结出了“更好用”作为第一个关键词；基于产品的定位和愿景总结出了第二个关键词：更高效。
（2）收集情绪版 情绪版是辅助展现最终视觉表达效果，帮助设计师找到合适的视觉演进方向。

通过情绪版提取视觉应用部分，结合品牌调性，遵循格式塔原则（对齐、对比、亲密、重复）和视觉五要素（色彩、空间、字体、图标、图片），最终视觉风格基调为：轻盈、微质感的浅色科技风格；通过 3D 几何、发光弥散、透明空间进行多元组合。

三、升级设计

新版官网设计

（1）更好用 要让门户框架清晰合理就必须对用户角色进行分析：
第 1 类：潜在企业用户，到访目的是搜索、调研可靠长期的服务/产品；
第 2 类：售前用户，到访目的可能是搜索了解产品/下载产品个人测试使用；
第 3 类：开发者用户，到访目的是帮助开发者更准确、更快速的沟通和排查问题/快速定制开发使用； 在与产品确认内容版块，同时结合用户的需求，根据重要度、关系、次序进行信息的归纳与分析后，确认整个门户的信息架构。

对于首页，我们依据营销中的引入、成长、成熟、转化模型。首屏通过企业品牌slogan对用户视觉进行冲击，吸引用户继续浏览；再通过产品功能、特性亮点、应用场景和成功案例让用户对云加产品全面了解产生信任；通过前两步层层递进的宣导，使潜在客户产生初步合作意向后，最后自然给出联系及下载方式完成转化。
（2）更高效 我们对云加产品进行信息内容提炼，信息整合提炼优化，提升高价值信息的展示优先级，可视化产品亮点介绍，将繁杂的内容信息简洁化，实现高效信息传达。在官网的策划和设计上应该力求将繁杂的信息简洁化，将价值传递可视化，用更直观的形式呈现出品牌和产品价值。

（3）视觉设计 为了更直观传达品牌特性，视觉风格基调定为：轻盈、微质感的浅色科技风格，并且贯穿运用到门户模块、内容排版中，形成了页面整体的统一。
①统一色彩规范体系

②统一图形风格体系
重新设计了一整套更加符合云加产品的图标，不仅更能显出高级感，还能形成差异化，在官网的精致度上与其同行形成鲜明对比。

③统一图形氛围真实基调
整个门户的设计风格、色彩、排版均需要具备统一性，加强品牌符号形象。

采用精致极简、有层次和空间感的3D毛玻璃图形的设计手法，增强品牌科技质感和时尚感，契合云加产品智能化、品质强、可靠安全的特性，给用户传递科技感、未来感。通栏Banner，形成更大视觉冲击力；通过强化品牌化相关的视觉元素，激发用户对品牌认知感。
云加官网升级不仅呈现了产品核心价值，落地更是提高了用户体验，也提升了整体的品牌形象，其新官网彰显出云加强大的品牌行业影响力和竞争力。

点击访问→ 浪潮海岳云加