我来做淘宝商城的首页设计

今天">淘宝首页的导航又改版了,和上一次淘宝商城改版一样,微博上的朋友七嘴八舌给了不少意见,粗粗看来大多是负面的意见。我一向认为负面意见大家都会提,重要的是能提出有建设性的意见。刚好现在已经离开淘宝,反倒可以公开地说说我的意见,对错都请大家多指教了。

这两次改版,从交互上来说没有大的问题。大首页中规中矩,横向Tab为主导航、左侧纵向Tab为辅导航(非二级导航,如为二级,最好还是横的),把 淘宝目前的“主业”、“辅业”说得非常清楚了。

商城首页交互更有“出彩”的地方,就是左上角的“所有商品分类”。这个交互在搜索结果页面可以体现出它的优势来,算是一个很好的借鉴(应该来自 amazon )。

但是,从视觉设计上来讲,两个页面都有一些问题。特别是大首页的视觉设计,可以算得上是重大失误。

我们说“设计=解决问题”,而视觉设计,就是“用视觉语言去解决逻辑问题”。 举一个很简单的例 子,如果一个东西重要,我们会让它居中、留白、加大、加粗等等。居中(位置)、留白(色彩)这些都是视觉语言,我们用它来解决一个逻辑问题——“重要”。

视觉设计师在做设计的时候,一定要牢牢记住这句话。打开PS之前心里应该很明白:我要解决的逻辑问题是什么?然后再打开PS,开始选择你掌握的视觉 语言。

在这里我只以商城首页为例来具体讲讲它的问题。只说商城首页是因为我知道它的设计师是我曾经的徒弟飞飞,她是淘宝最出色的10243.html">视觉设计师之一,也是我带 过的视觉设计师中最有灵气的一位。

这是目前的商城首页(点击放大):

这个页面视觉冲击力强,主次分明,品牌形象表达极富张力。特别是顶部的大色块,用得非常大胆,而且效果出色(无论下面的banner怎么花哨,都不 会抢过它了)。

但此页面有两个致命伤:

搜索框不明显,有“被淹没”的感觉;左侧的分类菜单,起的是导航的作用,但没有与“主导航”产生任何的视觉关联。

这两个致命伤,严重地削弱了商城首页最主要的功能:引导流量。

所有电子商务网站首页,对流量的引导功能,都少不了这三样:搜索、分类、推荐。搜索和分类是用户主动自我引导,是精准流量。如果对这部分流量不能很 好地把握,一定会从最终的销售数字上看到后果。

接下来我们分别分析这两个问题产生的原因。

先看这个搜索框的局部:

发现问题了么?还没有?^_^ 这样看应该非常明显了。这里有两个白色长条,一个是非常有用的搜索框,另一个是无乎无用的留白。它们在这么近的距离上同时出现(间隔太近),两侧又都是这 么重、这么花哨的色彩,我们的眼睛和大脑,铁定会把它们归为一组。注意我的说法是——“归为一组”,也就是在逻辑上把 它们归作了一类,这还能不出问题么?当然被淹了。

要解决这个问题也不难,同样是运用视觉语言来解决。比如让它们在空间上分开一点、让其中一个条换个颜色等等。

再来看菜单的局部:

我们用同样的思路来看,这里面哪些东西是一组的? 很明显“淘品牌”和“所有商品分类”是一组,下面的菜单是另一组。从逻辑的角度来看它,问题是不是显而易见?

另一个问题就不是那么明显了,这要在搜索结果页面才能看到,也就是我上面提到“出彩的交互”。当用户鼠标hover在“所有商品分类”按钮上的时 候。下面灰色的分类菜单会以Dropdown Menu的形式向下展开。所以这里还有一个隐含的逻辑问题需要解决,就是“按钮”与“下拉菜单”是一组。

这是我改的效果图(点击放大),看看是不是好了些:

一共有四处小改动:

加了个渐变背景;把搜索框向上移了一点,与第1点配合,它就不会被淹了;菜单的图标改成了红色,与顶上的导航呼应,形成一组;把菜单向上移了十来个像素,冲进了大色块,并加了一点点投影,体现出它的“下拉菜单”特性。

所以视觉设计实际上在解决的还是交互问题——或者极端一点说——是逻辑问题。

某些设计师做了几年甚至十几年网页设计,却仍然认为网页设计是一个艺术问题,这是大错特错的。

淘宝大首页的问题就不说了,大家有兴趣的话可以跟着讨论讨论,也希望看到它尽快的完善。

淘宝的设计师已经是行业中千挑万选的精英,实际经验丰富,如果整个团队的“设计理念”和“设计哲学”的大方向正确,一定能继续保持领头羊的地位。

来源;http://blog.sharkui.com/2010/05/05/design-of-taobao-mall/

时间: 2024-12-09 12:29:49

我来做淘宝商城的首页设计的相关文章

业界在线:淘宝商城首页改版

网上"奥特莱斯"悄然上线 淘宝商城首页改版 推网上品牌特卖场 8月29日,淘宝商城新版首页全新改版,与此同时华丽登场的还有淘宝商城子频道品牌特卖平台.据称,品牌特卖平台将提供最齐全的品牌折扣商品销售,在为品牌商家开辟"清货"专场的同时,让消费者可以在特卖场里以较低的折扣价淘到品牌货. 特卖品分为三类,分别为品牌体验款.应季库存品和零码清仓款.体验款来自于商家专为网络渠道设计.生产或定价的商品,这类商品可以帮助商家更好了解市场,开拓新客户:库存商品为当年或者历年的应季

四种方法打造成功的淘宝商城经营推广

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 淘宝网最起码能够解决超过60万人的就业问题,这已经是非常庞大的数据了,而且很多人因此成为百万富翁,千万富翁,赚钱的效应是可想而知的,笔者正是看到电子商务所具备的巨大潜力,所以也加入了淘宝大军,成为淘宝商城上的一员,经过我的苦心经营,目前也基本上获得了盈利,下面我就把我成功的经验写出来跟大家分享一下! 一:以质量征服用户 网络购物最担心的内容是

淘宝商城实习三月记:产品经理做什么

工作之前角色 转变从程序员开始 大二起,发现自己在信息技术方向上的兴趣,更多地偏向互联网.说干就干.初中有用 FrontPage 和 Dreamweaver 自制网页的小经验,便到图书馆拿 HTML 和 CSS 方面的书读起来.一天时间通读,就手工写出了 Div+CSS 的代码,整齐美观,颇为自豪.快速学习的能力是一方面,最重要的地方在于,这份网页不再是通过 Dw 点来点去.画表格或者使用层东拼西凑,而是纯手工且符合万维网联盟(W3C)标准.这意味着我写的东西不再是玩具:它们进入了可应用的行列:

圣诞礼品市场内外遇冷“中国制造”转战淘宝商城做品质

欧洲债务危机之下,欧洲民众纷纷准备"勒紧裤腰带"过一个没有圣诞礼物的圣诞节,这导致不少中国制造商的玩具和圣诞装饰品在仓库里堆积如山,卖不出去."一年不如一年,货还是之前那些货,量也跟之前差不多,价格比之前便宜,但货还是卖不出去."义务小商品市场某礼品店老板小陈面对着去年的积压的圣诞商品一筹莫展.圣诞节到来,原来应该属于"中国制造"商们的欢乐盛宴在近年却显得异常冷清.转战内销借助网络市场,成为诸多玩具.装饰品.礼品厂商们的不二之选.但是,外贸商品网

不管淘宝商城还是C店,淘宝卖家做起来的原因可能有千万种

不管淘宝商城还是C店,淘宝卖家做起来的原因可能有千万种,但是淘宝运营崩溃却往往只需致命的一击--尤其那些没有雄厚资金撑着.并不断去试错.试错了又不能立即总结.并又幻想着"最好的业绩在下一个月"的卖家. 亏一元是亏,亏一万也是亏,亏十几万也是亏.所谓大亏,取后面的数目,销售额约140万,30%毛利.坛子里有无数教人成功的经验,就是没有人谈谈失败的教训.所以楼主拟就自己一年多所见所闻所经历的不光荣史,逐条总结出来. 成功的经验未必能学到,不然<我的成功可以复制>大卖之后社会上有

从淘宝商城更名天猫 看淘宝客营销策略

近日淘宝商城正式更名为天猫,在网上掀起了不小的波澜.天猫名字的由来是Tmall的谐音,而淘宝商城此次更名也能看出淘宝商城急于和淘宝撇清干系,走高品质路线.在大多数人只是关注这一事件的同时,有很多淘宝客已经行动起来,利用这次热点做起了淘宝客营销.接下来我们就通过几个案例来看下淘宝商城更名事件带来的商机. 案例一:天猫商城如雨后春笋般冒出 如今在百度搜索"天猫",除了一些新闻和百度自身产品,基本上前几页都被各种"天猫商城"所占据.通过对这些网站的分析,笔者发现这些网站有

从淘宝商城更名为天猫来看百度与google

2012年的一月是互联网多事之秋,刚刚还是用户的刚性需求战胜用户体验的12306.cn号称全国最强的电商网站,引发了屁民的种种置疑.终于在1月11号这天停下了暂时停下了讨论转移到了"天猫"上.偶尔一看,天猫是什么东西,怎么与互联网挂勾了,但是阿里巴巴旗下的产品:"淘宝商城"在今天正式更名叫天猫了,那这个不知名的物种就与互联网关系大了. 2012年1月11日,阿里巴巴集团旗下B2C平台淘宝商城宣布更名为天猫(Tmall.com),网购世界一个全新的品牌由此诞生,未来全

淘宝商城单款制胜

淘宝商城单款制胜--通过了解买家需求点,专门为目标顾客打造合适的爆款,再通过利用自身条件或外部的各种资源来让爆款轰动,并对已有顾客进行很好的维护,从而让自己在激励的电商竞争中崭露头角,取得巨大的胜利. 目前,淘宝的大势可以一分为二:品牌为先和卖货为先.观察淘宝发展至今,前者的可操作性已经变得越来越严格,适合大部分小卖家的出路--卖货为先. 资金.人员.供应链等等一系列问题,让中小卖家起步非常困难.为了避免库存的压力以及资金链的紧张,以硬广形式全店出击的形式并不适合这些卖家,逐个击破,依靠单款取胜

看淘宝商城如何过光棍节?

做电商不可一日无活动,光棍节则是各大电商企业最为重视的节日之一.从光棍节(11.11)算起,电商行业的年终促销大戏将正式拉开帷幕.在接下来的2个月中,光棍节.圣诞.元旦.春节将接踵而至,各路商家摩拳擦掌,都准备大干一场. 淘宝商城在去年光棍节中取得了骄人的战绩,单日销售过千万的卖家不在少数,单日销售过百万的卖家比比皆是,这一切都给了淘宝商城再来一次的理由. 淘宝商城今年的双十一(光棍节)活动,可谓是空前的热闹.我经过一周的观测和分析,发现这完全是一个教科书式的电商推广方案,值得我们揣摩和围观.