设计流程
Step 1: 了解客户改版需求及产品定位
从产品处了解到客户希望在旧版本功能不变更的基础上调整界面风格。
Step 2: 分析已存在的一期产品
Step 3: 从用户体验及界面美观上研究相似产品,进行分析
根据客户的推荐的偏爱的网站风格及搜集到相类似的网站进行分析。
研究总结及难点
- 客户只调整界面风格,不做开发框架调整,对设计的限制比较大,包括布局及交互效果;
- 由于客户说到品牌 Logo 后期会调整所以色调希望往金融、有科技感的方向;
- 时间节点也比较紧张,希望快速产出设计,可以设计雏形供客户选择。
Step 4: 提出初步设计建议及首页风格设计
V1 :科技感结合金融版本
- 用色:使用暗色调科技蓝,增强品质、专业感;
- 使用单屏切换,借助交互动效。
V2:以白色为背景,减弱科技感
- 用色:客户希望减弱科技感,使用白色背景,使用比较代表金融的暗色调金色。(备用绿色,客户要求);
- 整体易于老年用户群体使用,字体可尽量放大。
V3:更扁平风
- 用色:使用品牌色深绿色作为主色调,由于客户的品牌色为深绿色,且绿色作为军队的代表色,更有力量感;
- 风格:使用白色背景、扁平风简约的设计风格。轻量化办公产品;
- 视觉:图形使用更有亲和力的圆角及流行的扁平风。融入更适合职场及办公环境的情绪版插画风格。