案例推荐!Behance上超火的大众官网重设计 - 优设网 - UISDC

案例推荐!Behance上超火的大众官网重设计

2014/01/07 37742评论区

在这个业余项目上埋头苦干了将近一个月,结果还算令人满意,现在我可以简短的向大家介绍一下此款设计练习。

在开始阅读之前,推荐看一下Behance(妹子们注意了,作者超帅的)上的相关图集,这样就能对我的作品有较为整体的了解。

回顾设计生涯,几乎和重设计紧密相关,4年前我完成了捷克沃达丰官网的重设计。那个项目算是一次设计定位。这几年我一直在想,要再积累点设计经验,有机会再进行一次重设计。

推荐阅读
要改版了吗?来看看这15例优秀的重设计
推荐!《暗影之剑》游戏官网设计经验分享
网页能有多酷?游戏官网告诉你!

如果你有充足的时间,放松的状态,那么非常适合在业余时间做一些项目练习。我一般做一些概念设计,或者重设计一些流行的网站作为个人练习。我曾经以Nokia.comTechCrunch 和Adobe.com为对象做过重设计练习。每一次开始练习之前,都力求充分展现个人的技巧、想法、观点。但说实话,最后的结果仅仅是小修小补,没有翻天覆地的变化。但是这次,大众官网的重设计练习,我打算设计的深入一点,力图将所有的概念整合到一起。

重设计这种项目,如果仅仅只重设计主页,那么收效不大。最好将你的理念体系化,可以做个视频,可以建立个Behance项目、资料页。

好了,废话不多说,现在开始隆重介绍大众官网重设计练习。这是我设计生涯以来水平最棒的项目。

我设计的这个官网和大众现在的官网完全不同。我重新设计了网站的导航以及各个页面。加入了很多动效以确保页面的趣味性。

简略的说一下这次重设计练习中,我比较注重的几个方面。

主页以及主导航

 

主页设计
主页的风格围绕一张精美的产品图片打造,干脆、整洁的标题,力求简短的描述。简约的页面,提供的信息量却很充足。其实很多大公司网站的问题就在于广告泛滥,长篇大论太多。最近非常流行使用视频作为主页面的背景。嗯,这个方法确实不错,我们也准备了视频作为备选方案。

主导航固定在底部,这样无论怎么滚动页面,导航都能一直相随。而且当你进入了页面,导航的内容也会随之改变,导航中的选项会根据页面而改变。但是不同页面中均可以通过点击“三直线图标”来回到主页

check the video

汽车模型选择

其实这个页面就是一个覆盖整页的下拉页面。VW的官网中忽略了重要的一点——信息的过滤。这里设计了信息过滤功能,通过信息过滤功能,可以通过车型、价格、马力来分类挑选。

产品细节页

 

大而美的照片,垂直视差滚动,充满了美感与细节。使用了合理的页面布局,加入了一些留白和动效。可以通过 Behance project 查看。

评价和企业荣誉页面

 

首先要解决的问题是,怎么转至评价和荣誉页面。这里使用了上拉式 成列的icon菜单,非常简洁。
值得一提的是评价页面,将用户的实际经历与产品结合,讲述出一个个妙趣横生的故事,起到了很好的引导作用。然后对评估页面、荣誉页面和“为何选择大众”这三个页面的布局做出了精心的调整。


 

 

试驾页面

我设身处地的将自己比作那些有购买汽车打算、想进一步试驾的用户。设计出了这个试驾页面。
试驾请求是设计的最后一个页面。在浏览“为何选择大众”和“汽车模型”页面时,如果你想亲身体验一下大众汽车,只需要点击一下此按钮,就能弹出一个地图。

浏览器会自动对你所在的未知进行定位,然后只需完成最后一步——移动大头针,选择提车的场地。然后填写联系信息,确定好试驾时间。

这个页面我作的非常简单,而且提供了非常便利用户的信息。首先,没人愿意跑大老远去试驾一辆车,如果附近就能提供试驾,那就再好不过了,这里就通过这个页面来告诉用户,最近哪里有试驾点。其次,联系信息做的简单,用户填写也快。从体验的角度来讲,试驾是一种享受,所以要让用户感受到方便,让用户感觉这车仿佛已经属于他了。这就是我想要表达的概念。

其他的细节和补充:

第一个阶段的工作收尾,算是完成了这个项目,虽然和以前的工作比已经非常棒了。但是我希望下一次做业余项目还能够有所提高。这一次我记录出了一些设计中的不足之处,以期下次改正。

  • 关于大众 ( 招聘, 领导层页面)
  • 大众新闻 页面
  • 用户俱乐部页面

除了爱好之外,做本项目的原因

不是为了在Dribbble,Behance和Twitter上吸粉,我很实际,更主要的是这个项目能够帮我吸引客户。

设计师太需要表达自我了,通过这个项目我表现了自己的能力,告诉客户我可以做到什么程度,会什么技能,擅长什么风格。不求出名,只求实际!本项目的设计过程中,我感受到了设计的乐趣,通过一系列的理念实践和设计方法,同时也强化了自身基础。

设计师:Aleš Nešetřil  于布拉格,捷克
 
原文地址:medium.com
Behance地址:behance.net
优设网翻译:@MartinRGB
本文由优设网原创翻译,转摘请注明优设网译文出处,谢谢各位小编。

 
================关于优设网================
“优设网uisdc.com“是一个分享网页设计、无线端设计以及PS教程的干货网站。
【特色推荐】
PS礼仪手册:网页设计师必须修炼的内功技法,更是不可或缺的WEB设计指南http://hao.uisdc.com/ps/
设计微博:拥有粉丝量61万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗?
添加 优秀网页设计 微信号:【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加:

youshege
 

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:https://www.uisdc.com/behance-volkswagen-redesign

发表评论 加载中....

评论加载中....

uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

设计圈干货 界面设计 排版布局 职场 版式设计 优设专访 优设大课堂 设计达人 设计师干货 web前端开发 配色 视觉设计 素材下载 AI教程 设计理论 设计流程 神器下载 字体下载 设计师专访 psd下载 海报设计 设计规范 设计趋势 用户体验设计 动效设计 logo设计 平面设计 图标设计 ICON 产品设计 神器推荐 App设计 字体设计 职场规划 酷站推荐 交互设计 ui设计 优秀网页设计 设计师职场 ps技巧 酷站 用户体验 PS教程 网页设计 经验分享

您还没有登录

优设启用更安全省心的 微信扫码登录

微信扫码

300万设计师聚集地!优设网是极具人气的设计师平台
2012年成立至今,一直专注于设计师的学习成长交流

把好文章收藏到微信

打开微信,扫码分享
学设计 优设网 在这里