全球领先的重直云计算大数据服务商海马云官方网站设计

交互设计 | 前端 | 图标 | 界面设计

北京海誉动想科技股份有限公司是国内专注于ARM架构云计算平台的公司,全球领先的垂直云计算和内容大数据服务提供商。公司拥有全球最大的ARM架构垂直云计算平台,总体物理部署规模超过7000台服务器。公司于2015年获国家高新技术企业认定,现有员工近300人,70%为产品研发人员,核心团队行业经验平均超过15年,提交申请及获得授权专利30余项。

本次蓝蓝设计主要负责海马云官网的视觉设计,页面开发开发设计。此次项目需要适配至PC端,pad端和手机端。蓝蓝设计人员经历了前期沟通,竞品分析,web端主视觉设计,pad端主视觉设计,手机端主视觉设计,banner设计,网站页面开发采用,测试后最终圆满完成该项目。

网页链接:http://www.haimacloud.com

首页web端和手机端

海马云官网是一个企业官网,其主要作用是对企业业务进行展示和引导客户填写资料,并回访联系。我们在充分了解现有网站基础上,针对目前网站存在的一些问题进行优化设计,最终产出如下效果图。

客户在新版页面还新增了几个模块:
  • 1.云节点全国示意图
  • 2.业务模块快速入口
  • 3.行业热点资讯
根据以上需求的修改,我们最终输出右侧视觉效果图。
网站改版前,存在以下几个问题:
  • 1.网站插画配色与banner等配色不搭,整体来看,显得较为突兀。
  • 2.网站主色调为青绿色,与logo等品牌色不统一,客户浏览网站时不容易产生品牌认同感。
  • 3.版面比例不协调,文字字号对比度过大,不利于用户浏览阅读。
针对以上问题,我们列出了如下改版思路:
  • 1 .减少banner,插画等的色差,尽量是二者保持统一,减少页面突兀感
  • 2.统一网站品牌主色调,从logo中提取网站主色调,增强用户浏览网页时的品牌认知度。
  • 3.调整版面比例,根据内容重新划分版面,同时加入部分操作动效,区分可操作版面和信息展示版面,使页面布局更加清晰,合理。
  • 4.考虑到适配手机端和pad端,页面元素尽可能地少,布局每个元素时,都要考虑到其他端显示效果。
海马云响应式网站设计

内容巡检页

海马云响应式网站设计

设计过程

在最初设计中,我们先设计了 几个不同风格的首页视觉稿,深色配色较为符合大数据行业专业,前沿科技,海量信息等特点,且界面较为整体,但是考虑到使用场景多为白天用户浏览使用,不太适合深色背景,因此放弃该版本,选择浅色背景版本。

海马云响应式网站设计

banner设计

在确定了整体风格之后,我们开始进行二级页面及banner设计,二级页面为公司业务说明页面,排版相对固定;为了突出客户产品专业,专注的产品特征,我们对页面banner,图标进行了专门绘制,在突出产品特点的基础上,强调页面的和谐统一。具体设计过程如下:

在banner设计过程中,我们进行了多次改版,最初提交客户的版本中,设计风格较为多样,不同板块有不同设计风格,较为杂乱,且颜色不统一。针对客户提出的问题,我们进行了修改,最终产出客户满意的banner。

修改前 修改后
海马云响应式网站banner设计

修改后部分Banner展示

列表页面设计

icon

在icon设计过程中,我们前期的思路是用不同颜色来营造多彩,灵动的氛围,但是这种中设计思路虽然能为页面增加设计感和氛围,但是并符合大数据行业专业,一丝不苟的特点,因此,我们准备重新开工,全部重新绘制符合行业要求的图标。

修改前 修改后
列表页面设计

其他内容展示

智能投研web端 智能投研手机端 其它设计稿页面01
其它页面 其它页面手机端 其它设计稿页面01

  返回