事
在电商行业里从自学到现在发现,越是实践经验的内容越是容易忽略。
6年前,深入电商设计这个社交圈; 6年后,淡出电商设计这个圈子。
细想起,在电商行业里从自学到现在发现,越是基础的参考资料越是容易忽略。以下讲到的知识点,并不是一促而就的整理,而是在工作中从不懂到懂的点滴记录。
有一些下工夫点和要点,分几期整理后给大家。 也是给自己的总结,更是归零!
「文中所用案例均来自银泰网设计团队」 那好,我今天先从1个技法和3个技巧出发。
1、首屏重设计
这里说的首屏设计,指平台类的专题片专题头图或者店铺类的首屏。
什么是首屏?
首屏,隐约的视觉设计!
首屏,是不拖滚动条直接看到的位置; 首屏,是信息传达的起点;
首屏,是电商与平面设计所不同的地方之一;
首屏,精采是否精彩直接关系到用户停留多一秒。 问题来了:首屏设计怎么做?
2、关于首屏设计的规律
下面是我整理了5个关于首屏设计的规律:
(1)点出亮点【摆出好看】
首屏,既是开门见山的亮点表达,设计又是一个由点到整体的计算机系统设计;
对首屏的设计时长往往会休息时间占我们整体设计时间的40%左右,如果不能在第一眼抓住用户的眼球,给用户视觉打上一种某种记忆点的话,就会间接降低用户对活动,对店铺的印象;
个股表现亮点的方法有:
(2)点出卖点【说出折扣】
首屏,吸引用户的第二点:就是活动力度。
在早年间的电商活动策划中,重折扣,拼价格还是首位的。 首屏,主要功能就是把标题、折扣信息合理的放在固定减价的高度中,让用户打开专题或者店铺时候时第一眼看到信息。
表现卖点的方法有
(3)点出引导【提示向下】
只有首屏的视觉往往不够,之中在电商视觉中并不是做完首屏后整体设计工作就算完成了。
在常规的需求中,首屏下面往往是更为重要的单品罗列大型活动及重要的文娱活动呈现,如何利用首屏(第一眼)的优势抓住眼球,并且通过视觉,用户向下参与并且发现感兴趣的活动或商品,这样的首屏设计才会更有用。
表现引导的方法有
回顾一下首屏设计基本概念大体要点: 这一步很重要
(4)高的安全【首屏多大适合】
对于首屏高度的具体值并不是一成不变的,首屏的高度界定,只是是对主要信息画个安全框而已,用来保证用户在打开页面时第一眼看到的信息是完整的,和直接的。
首屏的高度值,用现有主流用户的电脑设备分辨率「减去」浏览器环境大小。
为此我特意百度查到一篇来自广告公司AdDuplex大数据统计,和百度流量研究院的分辨率使用情况。其中下图中(二个分辨率仍是现在主流)
(来自:广告公司AdDuplex大数据显示(最主流的PC屏幕分辨率仍然是1366×768,而Win10系统下依然有近34%的设备保持这个分辨率,只有27%以上的PC
①1920×1080分辨率 首屏垂直计算工式
②1366×768分辨率 首屏高度计算工式
最后得出的结论就是:首屏高度一定要控制在450-760内!
这一步很重要
(5)有用的宽 【安全区两侧】
上面说的是首屏高度对于主要信息的影响,下面我们再次再来说下首屏宽度对于设计宽度外的发挥余地。
这里引伸二个我一直以来对于首屏及整体专题内容区以外地方过度设计的疑问?
上图所示: 这一步很重要:
其中,以上所说的是对电商视觉中京东专刊或店铺类首页,首屏设计的特点和尺寸基础的总结,并没有深入介绍首屏设计怎么做这样的理论中去。
对于首屏设计的方法和理论,其实你单看首屏,可以把他理解成某个品类、活动的banner设计,那么可以参考一些banner图的设计方法。
那期许了一个基础技法后,我们再来分享几个做电商视觉常碰到的细节
1、“工具”重要
这里指的工具并不指你用的软件产品,我真的的的熟练程度和技巧是每个设计师都都应该去掌握软件硬实力。
而这里说的工具是软实力,是说在开始用Ps之前对资金需求的沟通—理解—和时间安排。
明确需求时间。
通过面对面的和运营运行沟通后才,了解大概融资需求和后才看到框架后,你只要对自己的工作量有一个了解。在电商行业中,3天做完一个中型或大型活动的事情是常有的需求,所以在规定的时间内,
如何准确的找准资金需求点,并且集中精力做好,虽说真的很锻炼人。
常用的技巧有: 这一步很重要。
它的重要性就是让你在特定时间内针对性的提高。当然,你对消费市场理解的越准确你就花费的时间也就越少。
明确用的时间并不是用来困住你,而是让你把问题解决的更高效,这个问题不仅是资金需求,也是指全神贯注指由的集中考虑。
2、长图要折分
做电商需求少则3000px以上,多则10000+高度是常有的事,对于一般或中等配置的电脑来说,回退或者保存不了、或者打开需要1分钟的现象是引人注目的问题之一。
如果再以分工协作的修改来说,一个平台型大活动页面的设计需求,分工协作是不可少的一种方式。
常用的技巧有: 这一步很重要。
折分文件并不意味着每个文件里的设计元素意味著和风格相互脱离,而是为了提高效率分工协作的一种工作技巧。如果资金需求是分配给不同的设计师去设计的话,那么在上层前期内部的风格设计,元
素设计上就要有规范,模版,就要有连结起来的元素,最后让相互分开的文件,合在一起也是个整体。
3、模拟上线效果
为了让需求方更好的设想出设计稿后期下线效果,包括它在应用软件中,界面中,不同设备中的假想,我们在已经完成设计后,有必要第三章去把做好的设计稿植入到整体环境中进行细节的调整。
举个例子:你做的是某研讨的弹出窗,如果你单独做,也没问题。但是你很有可能会和整体专题视觉有出入。这时就需要需把设计稿植入到整体中,进行统一。
常用的技巧有: 这一步很重要。
模拟上线是效果的为了让需求方更加清晰的设想到上线后的真实效果,同时也可以的进行设计的整体查看。
因篇幅问题不能全部显示,请点此查看更多更全内容