项目背景
构家网是一个为用户提供整体家装的互联网公司，换句话说就是在付完定金60~70天之后，用户可以直接拎包入住。由于许多来自公司内部的反馈：官网的视觉设计不符合公司走的中高端的品牌形象。基于这个需求，我们开启了新官网改版计划。
PS(在此之前我从未写过项目记录，由于苦于每次与他人聊起项目设计的过程，经常会忘记自己设计或者修改设计的初衷。于是决定开始记录自己参与项目设计的过程。【构家网】是我第一个网页设计的项目，在此之前一直都是负责移动端的设计。)
当前版本存在的问题
- 现有的设计风格是否符合品牌定位；
- 物料图片存在风格不统一、大小不一致、清晰度低等问题；
- 设计栅格化，信息的层划分是否合理；
- 动效设计的优化、内容丰富度、图标的形体设计是否规范、配图的质量、等都有优化的空间。
项目描述
构家官网 改版项目于 2016-11-07 日开始至 2016-12-24 日结束。项目历时44天。是一次大范围的改版，重新制定了新的设计规范，增加交互动画。项目的目的是为了提高品牌形象，为2017年产品包调高售价做准备。
而我在此次项目中负责全站的设计规范制定，交互动画设计，首页、整家方案、构家整家标准、服务与保障、等花开 等模块设计。
首页模块
banner切换效果
现官网上的轮播图切换效果与我设计不同，我参考了 apple官网 轮播切换效果设计了轮播切换，效果如下图所示。
这种轮播切换效果是在下一个banner进入时上一个banner变小向左位移，banner切换有Z轴移动有厚度，显得更有空间感，但不是那种很强调的效果，而是有种精致感。但是前端在实现上出现了问题，后来放弃了这种设计。而采用了下面这个切换效果。
构家标准动画
- 设计标准
- 施工标准
- 采购标准
这三块内容比较抽象，对于这类内容我一向的处理方式是把比较抽象化内容具象化。
施工动画是请教了公司的工程督导-俭戈 关于【墙体的施工工艺】之后设计的。将墙体的施工步骤剖析开来，体现构家的施工标准化。
此处的动画为原型动画
等花开模块
等花开页面结构调整
navigation_top
精简了 navigation_top 使页面看起来更加一致协调，弱化顶部导航栏对页面内容元素的影响。
banner
增大了banner的展示区域。等花开是一个以展示内容为准，走文艺和中高端路线的模块。所以第一屏的banner需要完整的一屏来展示内容以及品牌定位。
after
左侧导航栏→二级导航
之前设计的二级导航栏是为了将来可能出现很多的产品包做准备的，但实际上我们的产品包数量只有15个。所以将二级导航替代左侧的导航栏。
模块信息展示调整
- 基于该模块的主要功能是以展示为主，所以放大了图片显示区域；
-
出于产品包单价较高，希望用户在了解产品之后再得到价格的信息。而不是一开始就被价格影响。修改之后效果如下：
