微信h5页面设计规范.docx

微信h5页面设计规范
篇一:微信H5页面的五大视觉体验原则[凡科微传单]
微信H5页面的五大视觉体验原则
在微信H5页面中,除了良好顺畅的互动体验之外,还需要一定的美感,也就是我们常说的视觉体验。今天,我们就来总结一下微信H5页面设计中的五大视觉指引原则,帮助大家协调互动与视觉之间的关系。
一、尊重视觉的主导地位
每个人首先都是视觉动物,然后才是行为动物,因此视觉才是H5页面设计的主导,它能在不知不觉中影响着交互。另外,好的视觉设计能够提升转化率,激发用户的购买欲。
二、提供清晰的操作指引
虽然对于一般的微信H5来说,每个页面的切换都会有一个清晰的箭头作为引导,但是如果是需要用户做出额外的点击、滑动才能跳到另一个页面的话,就必须给出一个清晰的操作指引,完善用户体验。
三、保证视觉统一
不只在视觉上,统一性在H5页面设计中非常重要,它体现了页面设计和排版的逻辑性,也体现了色彩、元素的协调性,这样都能让用户享受愉悦的视觉体验。
四、降低用户学****成本
如今用户对H5页面设计模式已经形成了一个熟悉的认知,比如中心排版、翻转动画、点击跳转等等,如果增加一些很陌生、***的设计,就会增加用户的学****成本,让用户的阅读变得吃力。
五、通过风格指南创造一致性
确定了H5页面的风格之后,那么页面中的元素、尺寸、字体、颜色等各个方面都可以先围绕这个风格进行设计,最后再使用拼凑手法来将他们组合、搭配在一起,这样可以保证页面风格的一致性。
文档来源:4996
篇二:微信H5页面的排版设计六大误区[凡科微传单]
微信H5页面的排版设计六大误区
排版是微信H5页面设计的重要组成部分,它不仅仅是文字与图片的简单拼接,所以要完成一个优秀的排版其实并不容易,一不小心,就有可能毁了整个作品。所以今天,我们就和大家分析一下,在微信H5页面中,常见的六个排版设计误区。
:文字拥挤是因为字间距过小,它会降低文字的可阅读性,而很多人在制作时都会忽略字间距这个细节。另外,有些字体本身比较稀疏或紧密,多需要我们去做适当的调整。
:段落密集是因为行间距过小导致的,会令用户难以识别各行文字,不过单纯地拉开行间距很难取得好的视觉效果,建议行间距为行高的二分之一左右。
:如果图片、文字不按照原始比例进行拉伸或压缩,就会造成不正常的扭曲和形变,影响视觉体验,我们在设计时要尽量避免这种情况,比如使用PS做图时,按住Shift键进行拉伸。
:在页面中,影响可读性的因素有很多,不过最基础的还是文字本身的清晰性。一般,页面文字不宜过小过细,这样会降低它的辨识度,而且色彩对比要明显,不能被背景或其他元素所掩盖。
:文字看得清了还不够,还应该让用户看得舒服。一般页面的标题、宣传语要用加粗加大、有美观性的字体文字,而正文则要简洁清晰,保证用户不会产生阅读疲劳,这样的阅读舒适度才会高。
:一般刚刚接触微信H5制作的用户都比较容易犯这个错误,认为字体多可以起到装饰的作用,其实相反。一个页面使用太多字体会导致可控性差、视觉干扰强,字体间不同的风格还会使页面整体不统一。建议页面字体有两种就够了。
这些误区都是大家比较容易犯的,希望大家认真学****不