一、案例效果

动画模拟群聊效果

视频录制群聊效果

二、应用场景

很多派友“非(bu)常(xiang)关(dong)心(shou)”常见的微信群聊H5到底是怎么做到的，像这样的

三、功能设置

用动画制作模拟群聊

1.一般所有的文案跟元素全部由设计师自主完成，导出图片，上传到Epub360编辑器中编辑，逐一 设置，做出风格各异的微信群聊。《制作教程》

视频录制群聊

1.基础版及其以上用户，可以直接将录制好或在视频软件中处理好的视频，用本地视频组件上传到H5作品中即可。

2.难免会碰到H5作品上线时间紧张，并希望最终效果理想的情况，所以使用手机录屏工具，结合真人微信聊天，一样可以高效完成优质的群聊H5。

3.接下来推荐录制群聊视频的各种录屏软件，精心整理打包为大家助攻！

4.视频录制的聊天视频有一定的局限性，不可获取用户头像昵称。

5.前期准备工作：

（1）若干微信号及等数量的手机；

（2）聊天内容（文案）；

（3）聊天中用到的表情包、图片等资料；以展示为主，提前添加到微信。

（4）建议多个小伙伴一起有组织的在手机上“聊天”，聊天过程中录制视频。

（5）根据在不同的环境和系统为大家推荐几种给手机录屏的神器：

6.电脑端录屏软件：windows系统

借助360手机助手（注：转载百度经验），先将手机的画面在电脑上显示，然后使用录屏软件来录制手机操作的视频。

在电脑上录制手机屏幕视频的关键点是将手机的画面在电脑上显示，所以其他的只要是支持可以修改录屏位置跟尺寸的录屏软件，我们都可以使用。

通过知乎的这篇经验帖（转自知乎），我们可以搜罗到适合自己的录屏软件，这里就不再为大家逐个整理了。

7.电脑端录屏软件：Mac系统

（1）神器1:自带的QiuckTime Player：手机+数据线

（2）优点：方便手机上操作，电脑上录制；录制的视频清晰，但文件较大。

（3）用数据线将电脑和手机连接，打开QuickTime软件，找到新建影片录制，即可录制手机聊天视频。

8.神器2:Camtasia2/3，支持各种录屏。尺寸可修改。

（1）优点：录制高清画质视频，录制连接到电脑的手机画面；屏幕尺寸无需自定义，自动显示手机屏幕尺寸；导出的视频文件可选择大小，无需压缩；导出标准的MP4格式。

（2）用数据线将电脑和手机连接，打开Camtasia3软件，找到软件右键单击录制视频。

（3）弹出下图窗口，选择手机名称（iPhone2），点击右侧Start Recording,即可录制手机聊天视频，结束后点击Stop Recording。还可对视频剪辑调整，所以录制过程中出错也不用担心，剪掉就好了。

（4）做了一个视频的GIF给大家看下

（5）点击share,可以保存视频，包括视频的品质／格式都可选择。

9.神器3:Screen Flow

（1）这款神器简直6到不行，通过数据线连接到电脑的手机，在点击软件的录制按钮后，可以同时录制两种画面，而且互不干扰，视频可任意选择删除或保留，十分方便。

（2）简单剪辑后可以保存为标准的MP4格式，软件免费，良心下载地址

10.手机端安卓：神器1:ScreenRecorder

（1）优点：录制高清画质视频，直接在手机上录制手机视频，免费版即可满足需求；

屏幕尺寸无需自定义，导出标准的MP4格式，操作简单。

11.神器2:屏幕精灵

（1）优点：可以录制横屏，选择是否录制声音，可以选择画质，进行简单的编辑，总之是一款小巧但功能强大的录屏小软件。

（2）如果想要录制高清视频或者去掉录制的标志，需要成为会员支付8.88元，但也还好，毕竟工具还是不错的。

12.iOS：先前苹果出于隐私考虑禁止录屏，所以在appstore里面鲜有录屏工具发布，但新升级的ios11已经自带了录屏功能。

iOS11系统自带的手机录屏功能

（1）优点：手机自带，操作灵活，画质高清，剪辑方便。

（2）手机设置中的控制中心添加屏幕录制，在上划屏幕时，可以点击最下方屏幕录制使用。

（3）录制好的视频，在插入到H5作品中的注意事项，可以详细查看该教程——本地视频组件规范。

本次的录屏软件推荐希望可以帮助大家快速完成录屏，最后，欢迎各位派友推荐更多的录屏神器，我们将根据大家的意见要求及时补充更新。