MR WHY

I am
WangHongyang

Wechat Official Account
Find fun things here!

智在家企业官网

智在家企业官网是我于智在家科技有限公司前端实习期间参与的项目之一。于2016.1.10完成并上线。它为客户提供了解公司智能硬件产品的渠道。

网址:www.autoinhome.com

官网提供链接到智能需求可视化问卷。官网+问卷⇒智能硬件解决方案。

官网介绍智能产品能够提供什么服务和效果,问卷根据客户想要什么样的效果给出应该用什么样的产品。两个反向互补的过程,让客户在了解什么是智能家居的情况下,解决该用什么产品和怎么用的问题。

因为面向的客户是第一批智能家居使用者,往往是高端用户,因此对平面设计和多端适用十分看重,在不破坏设计美感的前提下对多重分辨率设备提供响应式解决方案是前端工作的重点。

▽ 网站首页

▽ 家庭安防首页

前端页面布局方面
以全屏滚动为主,满足客户对产品展示网页的一贯印象。但同时穿插有少量页内滚动,打破浏览模式带来新鲜感,增加了内容展示区域面积,并带来更多的交互设计可能性。

▽ 符合客户对产品页面的惯性认知

▽ 打破惯性模式带来新鲜感,全屏滚动中包含自然滚动,滚动时,产品居于正中不动,最为醒目

前端响应式方面
通过更改排版结构来保持一致的设计美感。整块不透明色块有很强设计感,但会分割屏幕,因此小屏幕的移动端,减少整块色块的使用,保持完整背景不被分割。同时减少排版方式的复杂度,尽量不出现四层平面的遮挡和堆叠。

▽ 色块增强整体设计感,色彩可以分割信息范围,色块遮挡来暗示信息层级

▽ 上个页面在手机端的呈现,四层遮挡简化为三层

74

分享本文:

标签的世界
TOC