微信h5页面设计规范

《微信h5页面设计规范》由会员上传分享，免费在线阅读，更多相关内容在学术论文-天天文库。

1、微信h5页面设计规范　　篇一：微信H5页面的五大视觉体验原则[凡科微传单]　　微信H5页面的五大视觉体验原则　　在微信H5页面中，除了良好顺畅的互动体验之外，还需要一定的美感，也就是我们常说的视觉体验。今天，我们就来总结一下微信H5页面设计中的五大视觉指引原则，帮助大家协调互动与视觉之间的关系。　　一、尊重视觉的主导地位　　每个人首先都是视觉动物，然后才是行为动物，因此视觉才是H5页面设计的主导，它能在不知不觉中影响着交互。另外，好的视觉设计能够提升转化率，激发用户的购买欲。　　二、提供清晰的操作指引　　虽然对于一般的微信H5

2、来说，每个页面的切换都会有一个清晰的箭头作为引导，但是如果是需要用户做出额外的点击、滑动才能跳到另一个页面的话，就必须给出一个清晰的操作指引，完善用户体验。　　三、保证视觉统一　　不只在视觉上，统一性在H5页面设计中非常重要，它体现了页面设计和排版的逻辑性，也体现了色彩、元素的协调性，这样都能让用户享受愉悦的视觉体验。　　四、降低用户学习成本　　如今用户对H5页面设计模式已经形成了一个熟悉的认知，比如中心排版、翻转动画、点击跳转等等，如果增加一些很陌生、另类的设计，就会增加用户的学习成本，让用户的阅读变得吃力。　　五、通过风格

3、指南创造一致性　　确定了H5页面的风格之后，那么页面中的元素、尺寸、字体、颜色等各个方面都可以先围绕这个风格进行设计，最后再使用拼凑手法来将他们组合、搭配在一起，这样可以保证页面风格的一致性。　　文档来源：4996　　篇二：微信H5页面的排版设计六大误区[凡科微传单]　　微信H5页面的排版设计六大误区　　排版是微信H5页面设计的重要组成部分，它不仅仅是文字与图片的简单拼接，所以要完成一个优秀的排版其实并不容易，一不小心，就有可能毁了整个作品。所以今天，我们就和大家分析一下，在微信H5页面中，常见的六个排版设计误区。　　1．文字

4、拥挤：文字拥挤是因为字间距过小，它会降低文字的可阅读性，而很多人在制作时都会忽略字间距这个细节。另外，有些字体本身比较稀疏或紧密，多需要我们去做适当的调整。　　2．段落密集：段落密集是因为行间距过小导致的，会令用户难以识别各行文字，不过单纯地拉开行间距很难取得好的视觉效果，建议行间距为行高的二分之一左右。　　3．拉伸与压缩不合理：如果图片、文字不按照原始比例进行拉伸或压缩，就会造成不正常的扭曲和形变，影响视觉体验，我们在设计时要尽量避免这种情况，比如使用PS做图时，按住Shift键进行拉伸。　　4．忽略可读性：在页面中，影响可

5、读性的因素有很多，不过最基础的还是文字本身的清晰性。一般，页面文字不宜过小过细，这样会降低它的辨识度，而且色彩对比要明显，不能被背景或其他元素所掩盖。　　5．忽略阅读舒适度：文字看得清了还不够，还应该让用户看得舒服。一般页面的标题、宣传语要用加粗加大、有美观性的字体文字，而正文则要简洁清晰，保证用户不会产生阅读疲劳，这样的阅读舒适度才会高。　　6．使用太多字体：一般刚刚接触微信H5制作的用户都比较容易犯这个错误，认为字体多可以起到装饰的作用，其实相反。一个页面使用太多字体会导致可控性差、视觉干扰强，字体间不同的风格还会使页面整

6、体不统一。建议页面字体有两种就够了。　　这些误区都是大家比较容易犯的，希望大家认真学习，不断改进，避免在微信H5页面制作中出现这些错误。　　文档来源：5297　　篇三：用案例浅谈微信传播的H5页面设计　　用案例浅谈微信传播的H5页面设计　　从引爆朋友圈的H5小游戏《围住神经猫》，到颠覆传统广告的大众点评H5专题页《我们之间只有一个字》，从XX下半年起，各种H5游戏和专题页纷纷崭露头角。“H5”，这个由HTML5简化而来的词汇，借由微信这个移动社交平台，正在走进更多人的视野。本文聚焦于基于微信传播的H5页面的视觉设计，通过一些案

7、例分析来谈谈设计思路与方法，希望与大家进行交流探讨。　　功能与目标　　首先从功能与设计目标来看，H5专题页主要有以下4大类型：　　1.活动运营型　　为活动推广运营而打造的H5页面是最常见的类型，形式多变，包括游戏、邀请函、贺卡、测试题等形式。与以往简单的静态广告图片传播不同，如今的H5活动运营页需要有更强的互动、更高质量、更具话题性的设计来促成用户分享传播。从进入微信H5页面到最后落地到品牌App内部，如何设计一套合适的引流路线也颇为重要。　　大众点评为电影《狂怒》设计的推广页便深谙此道。复古拟物风格的视觉设计让人眼前一亮，富

8、有质感的旧票根、忽闪的霓虹灯，配以幽默的动画与音效，恨不得每个选项都点一遍。围绕“选择”这个品牌关键词，用引人入胜的测试题让用户把人生当作大片来选择，选到最后一题引出“大众点评选座看电影”，一键直达App购票页面。即使明知是软文也忍不住带着“矮油不错，这个页面有点diao噢”