微信图文设计与制作
用案例浅谈微信传播的H5页面设计
用案例浅谈微信传播的H5页面设计从引爆朋友圈的H5小游戏《围住神经猫》，到颠覆传统广告的大众点评H5专题页《我们之间只有一个字》，从2014下半年起，各种H5游戏和专题页纷纷崭露头角。
“H5”，这个由HTML5简化而来的词汇，借由微信这个移动社交平台，正在走进更多人的视野。
本文聚焦于基于微信传播的H5页面的视觉设计，通过一些案例分析来谈谈设计思路与方法，希望与大家进行交流探讨。
功能与目标首先从功能与设计目标来看，H5专题页主要有以下4大类型：1.活动运营型为活动推广运营而打造的H5页面是最常见的类型，形式多变，包括游戏、邀请函、贺卡、测试题等形式。
与以往简单的静态广告图片传播不同，如今的H5活动运营页需要有更强的互动、更高质量、更具话题性的设计来促成用户分享传播。
从进入微信H5页面到最后落地到品牌App内部，如何设计一套合适的引流路线也颇为重要。
大众点评为电影《狂怒》设计的推广页便深谙此道。
复古拟物风格的视觉设计让人眼前一亮，富有质感的旧票根、忽闪的霓虹灯，配以幽默的动画与音效，恨不得每个选项都点一遍。
围绕“选择”这个品牌关键词，用引人入胜的测试题让用户把人生当作大片来选择，选到最后一题引出“大众点评选座看电影”，一键直达App购票页面。
即使明知是软文也忍不住带着“矮油不错，这个页面有点diao噢”的心情点击了分享。
2.品牌宣传型不同于讲究时效性的活动运营页，品牌宣传型H5页面等同于一个品牌的微官网，更倾向于品牌形象塑造，向用户传达品牌的精神态度。
在设计上需要运用符合品牌气质的视觉语言，让用户对品牌留下深刻印象。
伴随着浪漫的钢琴旋律，《首草先生的情书》以一位男士的口吻娓娓道来在成长历程中对妻子的爱与愧疚，最后引出“首草——滋阴圣品，爱妻首选”的宣传语。
设计上采用回忆般的黑白色调，简单的照片加文字，配以花瓣掉落、水面涟漪等轻动画，渲染出唯美优雅的气氛。
“首草”这个全新的高端养生草药品牌，用H5打出了一副走心的情感牌，让用户记住了“半生只为你”的爱妻品牌形象。
微信图文设计与制作课件
基本思路同做PPT相同
三、易企秀
工具栏
通过 拖动 可以 改变 页面 顺序
新建页面Leabharlann 三、易企秀微信平台操作
Part 3
平台简介
微信推送
登录
搜索“微信公众平 台”，进入登录页面
输入账号密码登录
平台简介
微信推送
回到秀米图文排版
点击复新制建按图文钮 Ctrl + C
微信推送
添加原文链接
封面图片
点击
输入微信号、QQ号、或者手机号， 点击确定，预览发出
微信推送
检查无误后，点击保存并群发
操作展示
Part 4
END
Ctrl +摘V要
微信推送
注：原文链接可通过秀米场景秀、图文秀或易企秀获得
通过预览按钮， 获得链接
微信推送
上传并插入视频、音频、音乐 注：上传音频文件不超过30M,时长不超过30分钟
视频大于20M，需要通过腾讯视频上传，经审核通过后获得视频链接
微信推送
内容全部添加完毕之后，开始进行预览。页面最下边 有保存、预览、保存并群发，三个按键。选择“预览” 点击。
系统模板
（一）系统模板 标题
（一）系统模板 图片
（一）系统模板 背景图
（一）系统模板 卡片
文本格式 设置
（一）系统模板 分割线
（一）系统模板 关注和原文
（一）系统模板 名片
（一）系统模板 其他
布局模式
（一）系统模板 布局
布局模式 深度排版
（一）系统模板 零件
（一）系统模板 组合
（一）系统模板 贴纸
装饰 美化
（一）系统模板 列表
（二）我的收藏
关于微信公众号图文排版的技巧,这可能是说得最全的一篇文章
关于微信公众号图文排版的技巧，这可能是说得最全的一篇文章原标题：想做出让转发量暴增的微信排版？这4个小秘密你必须知道1、好的排版究竟有多重要？首先来介绍一下，为什么要推出这个课程。
微信公众平台现在已经有超过一千万个帐号了，据统计现在可能已经超过一千五百万个了。
有这么大的体验量之后，大家见多识广，对内容和阅读的体验要求也是越来越高的。
同时，好的排版不仅能够提供阅读上的体验的提升，还能够为公众号带来更多的粉丝。
相信大家也有时候会看到一些比较不错的文章，大家会相互去转发，说你看人家这排版做这么好看，为什么我们不能做成一样的呢？第三点，排版风格也是品牌不可或缺的重要一环。
由于现在公众帐号已经变成每家企业的标配，公众帐号的排版的风格和网站，和logo的视觉要求是一致的，所以排版风格也就变成了企业宣传的脸面。
这一点大家一定要重视。
第四点，排版是原创公众帐号的形象，为什么这么说？相信有原创帐号的或者是转载过别人原创文章的人大家都知道，就是在你没有要求别人把你加入白名单的前提之下，你转载别人的文章，你的排版格式是被完整保留的，所以，你的排版风格可能会影响到别人，或者说是别人的排版风格转载到你这儿是完整保留的。
如果你的排版风格比较好，可能更多人也出于对于排版的一个顾虑也会优先来转载你的文章。
第五点，就是综上所述，排版风格和排版水平对于公众帐号的运营是至关重要的。
学习这个课程能达到什么样的效果呢？我们简单的举了几个例子。
左边你可以看到这个标题的格式不是很统一，或者说像右边的封面，它们的风格是非常杂乱的，但是学习这个课程之后，可以让你的封面和标题都非常的简洁和统一。
另外就是内容，我们是希望让你的文章看起来更有条理，让别人阅读的时候更加顺畅。
同时，一些比较好的排版风格是可以让你的文章条理或者是让它的视觉效果变得非常好。
2、排版—图文标题篇（1）怎么样成为一个“标题党”？首先，映入眼帘的就是图文的标题。
那图文标题大家心里都应该有数，现在的这些标题是提高阅读的一个首要动力。
微信活动方案怎么做好看的
微信活动方案怎么做好看的微信活动方案怎么做好看的微信作为中国最受欢迎的社交媒体平台之一，已经成为许多企业和个人开展活动的首选渠道。
然而，如何制定一个吸引人、好看的微信活动方案却是一个需要一定技巧和创意的任务。
在本文中，将介绍一些关键要素，帮助您打造一个成功且吸引眼球的微信活动方案。
1. 目标明确：在制定微信活动方案之前，首先要明确活动的目标。
无论是提高品牌知名度、增加粉丝互动还是促进销售，都需要明确目标并围绕此目标制定方案。
只有明确目标，才能有针对性地制定方案，并在设计中突出重点。
2. 创新独特：微信活动方案需要有独特的创意，能够吸引用户的目光。
可以尝试引入互动性强的元素，如抽奖、答题、拼图等，让用户参与其中，增加他们的参与度和忠诚度。
同时，可以结合品牌的特点，设计独特的活动元素和视觉效果，使方案与众不同。
3. 简洁明了：要制定一个好看的微信活动方案，界面设计需要简洁明了。
过于复杂的设计会使用户感到困惑和不舒服，容易导致用户流失。
因此，应该遵循简洁的原则，将重点信息突出展示，排版整齐清晰，让用户一目了然。
4. 图文并茂：图文并茂是制作好看微信活动方案的关键之一。
在方案中，应该充分利用图片、图标和配色等视觉元素，以及简洁明了的文字说明，使整个方案更加生动有趣。
同时，注意图片和文字之间的平衡，避免过多的文字堆砌，给人以沉闷的感觉。
5. 移动端适配：微信是一个以移动端为主要访问方式的平台，因此，在制定微信活动方案时要考虑移动端的适配。
方案的设计要符合移动设备的屏幕尺寸和触摸操作习惯，保证用户在移动设备上的体验流畅和友好。
6. 营造氛围：为了让微信活动方案更吸引人和好看，可以通过营造氛围来增加活动的趣味性。
例如，在方案中使用一些有趣的动画效果、背景音乐或声音提示等，让用户感受到活动的独特性和乐趣。
通过以上关键要素的合理运用，您可以制定一个吸引人、好看的微信活动方案。
记住，方案设计不仅要追求美观，更要与活动目标和用户需求相契合。
微信活动推广——H5图文推送教学设计
微信活动推广——H5图文推送一、教材及教学内容分析1.教材分析高等教育出版社《网络营销实务》是一本针对中职电商专业学生、专注网络营销实战的教材，教材内容实操性较强，引导学生在“做中学、学中做”，对于提高学生网络营销实践技能有较大帮助。
2.教学内容分析《微信活动推广——H5图文推送》是教材《项目九掌握微信营销》中《任务三策划微信活动》中的内容。
在本教材197-202页中有关于微信公众号、微信图文消息推送、微信活动策划等内容。
本课对教材中零散的知识点进行整合，使其更符合工作的需要，并调整了一定顺序，将内容整合成3个课时进行教学。
第1课时为微信公众号基础知识介绍，包括注册流程、功能介绍、图文简单发送等操作。
第2课时为班级微店策划一起微信活动，撰写营销策划方案，包含活动介绍、促销信息和营销方式。
第3课时是利用H5形式推送微信活动。
本课采用第3课时作为教学内容，是在第2课时学生已完成“班级微店推广策划方案”的基础上，以经过企业专家认可的一份较完善的策划方案为样板，让学生进行微信活动图文推送的要素提炼，并用H5形式表现。
二、学情分析本堂课执教的对象是电子商务专业高二年级的学生，思维活跃，动手能力强，具备一定电子商务、营销策划的专业知识，渴望参与课堂学习，乐于从实践中获得经验。
对移动终端的使用、互动体验有强烈的兴趣，并且全部会使用H5制作图文推送页面。
学生对于生活中的微信公众号有初步的认知，对于微信中图文推送有亲身体验，但对于微信营销互动、活动推广的实践操作与体验比较欠缺。
三、教学策略选择与分析利用“学习体”微信公众号作为教学平台，紧紧围绕微信活动图文推送来展开教学。
课前通过教学平台进行微课学习、课堂上通过任务单填写、H5操作和头脑风暴等形式，理解本课要素提炼的知识、掌握H5编辑图文消息的技能。
课堂借助多种信息化的手段，以任务为导向，通过学生的互助合作、自主探究，借助信息化校企课堂、远程协助，有思维碰撞、交流互学的过程，突破教学难点，提升学生微信活动推广的能力。
图文排版范本
图文排版范本1.如何做出舒适而又优雅的公众号图文排版您好！很高兴能为您解答，一、图文标题图文标题应该遵循简洁明了的原则，建议标题字数控制在13-15字，超过这个字数之后，标题会自动换行而影响美感。
除此之外，字数太多还会因为订阅号折叠而没办法让读者看到你想表达的意思。
标题太长，后面都是省略号如果实在是控制不了字数，那也最好不要超过两行，否则真的很难看！标题字数建议不超过三行对于多图文的标题也要注意字数限制，尽量不要出现换行的情况。
此外，在多图文中，不管是标题符号使用还是配图都建议使用同一风格，以提高用户的体验。
二、图文封面1.封面选择基准在为图文封面配图时，建议遵循干净、简洁的原则。
所以，封面图片最好选择干净简洁而又能突出主题的封面。
如果有能力对图片进行加工和设计，可以加上公司的logo或者品牌的印记，但不建议使用影响封面美感的微信水印识别。
在此，为大家推荐一个简单、实用、快捷的在线平面设计工具创客贴：创客贴模板中心创客贴入手0门槛，点击上方网址注册后，选择社交媒体中的公众号文章首图，会出现批量的封面头图。
想用哪张图片直接点击使用即可。
重要的是，这些封面头图还可以进行修改。
这篇文章的封面图片就是利用创客贴做的。
2.封面尺寸图文封面尺寸为900px*500px，因此建议对封面头图设计好固定的尺寸。
封面图主要信息居中显示，以免遗漏图片中的重要信息，因为分享到朋友圈或者分享给微信好友预览图仅仅保留居中的500px*500px部分的内容。
单图文配图而如果是多图文配图，二条的封面尺寸则显示为200px*200px。
在多图文中，建议整体风格一致，如果还能巧妙地突显账号的品牌，那就更棒了。
多图文配图三、正文配图做好了封面配图后，接下来就要为正文配图了。
正文配图同样遵循干净、简洁的原则。
在挑选图片时，尽量选择与文章内容贴近的图片。
此外，也要注意图片内容、色彩色调冷暖一致。
正文配图准则比如，我这段主要更新与写作相关的文章，那么配图就可以选择书、笔、电脑等相关图片。
如何制作图文并茂(2024)
19
宣传海报设计示例
1 2
突出主题
在海报设计中，应首先明确主题，并通过醒目的 标题、图像和色彩来突出主题，吸引观众的注意 力。
视觉冲击力
运用大胆的色彩搭配、强烈的对比和动感的图形 元素，创造出具有视觉冲击力的海报效果。
信息层次
3
合理安排海报中的文字、图像和其他元素，形成 清晰的信息层次，使观众能够快速理解海报所传 达的信息。
2024/1/30
16
文字排版与美化方法
选择合适的字体
根据文章风格和读者群体选择合适的字体，确 保易读性和美观性。
调整字号和行距
根据文章层次和内容重要性，调整字号和行距 ，突出重点内容。
2024/1/30
使用颜色和背景
合理运用颜色和背景来增强文字的表现力，但要避免过度使用。
17
文字与图片融合技巧
如Instagram、Flickr等，聚集了 大量摄影师和摄影爱好者，可以 发现和获取优质图片。
2024/1/30
12
图片筛选与分类整理
2024/1/30
根据主题筛选
选择与文章或设计主题相关的图片，提高内容的整体性和连贯性 。
注意版权问题
确保使用的图片具有合法授权，避免侵权风险。
分类整理图片
建立清晰的文件夹结构，按照主题、颜色、风格等分类整理图片， 方便后续查找和使用。
2024/1/30
辅助性
图像可以辅助文字进行描 述，使信息更加生动、具 体，提高信息的传达效果 。
多样性
图像可以呈现多样化的信 息，包括颜色、形状、大 小等，使信息传达更加丰 富。
4
增强视觉冲击力
2024/1/30
吸引力
01
公众号图文封面标题位置
公众号图文封面标题位置在微信公众号的图文推送中，用户首先会看到的就是封面，它占据着整个推送的顶部位置，通常需要吸引读者的眼球并提供清晰的信息。
作为图文封面中最为重要的元素之一，标题的位置是需要重视的。
标题的定位在设计图文封面时，我们需要为标题考虑一个最佳的定位方式。
我们希望标题在页面上能够具备以下的特点：1.易于辨认：标题需要能够清晰地展现出来并且不被其他元素遮挡，这样读者才能够一眼看到，从而引发他们对页面的兴趣。
2.保持简洁：标题应该简单明了，放置在较为显著的位置但不会占据整个页面。
这样可以避免让页面变得拥挤、难以阅读以及不雅观。
3.放置在合适的位置：该放置在页面顶部的位置，并与其他元素保持适当的距离。
如果放置位置不当，读者就会感到标题与其他元素之间有矛盾，从而降低了页面的吸引力。
通常情况下，站长和运营人员可以将标题放在页面的顶部位置，这样它可以很容易地被读者看到，并与其他元素和谐地组合在一起。
这也是最常见的标题位置选择。
标题的大小与字体标题的大小和字体选择是影响标准标题的读性的重要因素。
1.大小：标题的大小需要与页面中的其他元素相匹配。
如果标题过大，可能会影响其他元素的视觉效果，如果标题过小，可能会导致读者没有注意到它。
因此，站长和运营人员需要使用自己的判断来确定标题的合适大小。
2.字体：在选择字体时，在维护品牌一致性的同时也要保证可读性。
有些网站会选择较为传统的、易于辨认的字体，而在其他网站可能会选择更现代的字体。
在两者之间进行平衡是好的选择。
通常情况下，标题的字体应该比正文大一些，而且应该是黑色或白色，以引起读者的注意。
标题和封面平衡标题已经被证明是封面非常重要的部分，然而过分夸大标题也会让封面变得失衡。
因此站长和运营人员应该在沟通设计师时协商好比例，并将它合适地融入到封面设计中。
如何确定一个适当的平衡点？站长可以从许多方面考虑。
例如封面色彩、插画、艺术方向等，都是考虑谁甚至会对封面更加重要的因素。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
•
9、一个人即使已登上顶峰，也仍要自 强不息 。上午 12时51 分44秒 上午12 时51分 00:51:4 422.3.2 4
• 10、你要做多大的事情，就该承受多大的压力。3/24/2
022 12:51:44 AM00:51:442022/3/24
• 11、自己要先看得起自己，别人才会看得起你。3/24/2
Mar-2222.3.24
• 14、我只是自己不放过自己而已，现在我不会再逼自 己眷恋了。22.3.2400:51:4424 March 202200:51
基本思路同做PPT相同
三、易企秀
工具栏
通过 拖动 可以 改变 页面 顺序
新建页面
三、易企秀
微信平台操作
Part 3
平台简介
微信推送
登录
搜索“微信公众平 台”，进入登录页面
输入账号密码登录
平台简介
微信推送
回到秀米图文排版
点击复新制建按图文钮 Ctrl + C
微信推送
添加原文链接
封面图片
2017 微信制作
目录
Part 1 Part 2 Part 3 Part 4
图文排版 H5动画制作 微信平台操作
操作展示
图文排版
Part 1
一、打开秀米图文排版2.0“秀米”点击打开二、用QQ或者微博账号登录，添加新的2.0图文 点击
三、打开秀米2.0图文，建立新图文
预览
保存 复制
更多
谢 谢 大 家 022 12:51 AM3/24/2022 12:51 AM22.3.2422.3.24
• 12、这一秒不放弃，下一秒就会有希望。24-Mar-2224 March 202222.3.24
• 13、无论才能知识多么卓著，如果缺乏热情，则无异 纸上画饼充饥，无补于事。Thursday, March 24, 202224-
•
3、越是没有本领的就越加自命不凡。 22.3.24 00:51:4 400:51 Mar-22 24-Mar-22
•
4、越是无能的人，越喜欢挑剔别人的 错儿。 00:51:4 400:51: 4400:5 1Thursday, March 24, 2022
•
5、知人者智，自知者明。胜人者有力 ，自胜 者强。 22.3.24 22.3.24 00:51:4 400:51: 44Mar ch 24, 2022
系统模板
（一）系统模板 标题
（一）系统模板 图片
（一）系统模板 背景图
（一）系统模板 卡片
文本格式 设置
（一）系统模板 分割线
（一）系统模板 关注和原文
（一）系统模板 名片
（一）系统模板 其他
布局模式
（一）系统模板 布局
布局模式 深度排版
（一）系统模板 零件
（一）系统模板 组合
•
6、意志坚强的人能把世界放在手中像 泥块一 样任意 揉捏。 2022年 3月24 日星期 四上午1 2时51 分44秒0 0:51:44 22.3.24
•
7、最具挑战性的挑战莫过于提升自我 。。20 22年3 月上午1 2时51 分22.3.2 400:51 March 24, 2022
•
8、业余生活要有意义，不要越轨。20 22年3 月24日 星期四1 2时51 分44秒0 0:51:44 24 March 2022
输入微信号、QQ号、或者手机 号，点击确定，预览发出
点击
微信推送
检查无误后，点击保存并群发
操作展示
Part 4
END
•
1、有时候读书是一种巧妙地避开思考 的方法 。22.3. 2422.3. 24Thur sday, March 24, 2022
•
2、阅读一切好书如同和过去最杰出的 人谈话 。00:5 1:4400: 51:4400 :513/2 4/2022 12:51:44 AM
（一）系统模板 贴纸
装饰 美化
（一）系统模板 列表
（二）我的收藏
（三）剪贴板
H5动画制
作
Part 2
H5 动画
秀米 场景秀 秀米 图文秀
易企秀
三种工具
一、秀米 场景秀
基本相同于图文排版
可插入小于 1M的背景音
乐
二、秀米 图文秀
秀米场景秀+图文排 版
三、trl +摘V要
微信推送
注：原文链接可通过秀米场景秀、图文秀或易企秀获得
通过预览按钮， 获得链接
微信推送
上传并插入视频、音频、音乐 注：上传音频文件不超过30M,时长不超过30分钟
视频大于20M，需要通过腾讯视频上传，经审核通过后获得视频链接
微信推送
内容全部添加完毕之后，开始进行预览。页面最下边有保 存、预览、保存并群发，三个按键。选择“预览”点击。