12月总结月,整理之前做了一个移动端的APP课程付费的项目,后期迭代的时候增加了对应的小程序版本,在已有成熟APP的情况下,开发小程序版本是比较快捷方便的。
项目名称:给栗同学
项目时间:2019.4.15~现今
平台:APP端、小程序端、H5
小程序的设计和功能上会基本与APP保持统一性,做交互设计的时候,要明确小程序和APP的差异,输出合理的设计方案。
小程序和APP的区别大致包括以下几个方面:
一、用户群
小程序的基于微信平台的开发工具,用户群依托微信平台,而APP是来源于App Store及Android各大应用市场。
二、安装方式及特点
小程序:用户在微信内搜索or扫描小程序二维码即可立即使用,响应速度快,不需要单独下载安装,不占用手机内存。(属于微信缓存数据)
APP:各大手机内的应用商店(App Store)下载,不同安装包大小不同,占用手机内存。
三、开发成本及时间
小程序:小程序是基于腾讯开发框架开发,类似HTML,一次开发适配所有机型,需要的时间成本和人力成本较低
APP:APP需要开发安卓系统和IOS系统两种版本,需要针对不同的机型进行适配,需要耗费较大的时间和人力成本
(给栗同学开发最少人员配置,小程序前端开发1人,APP前端开发 iOS1人 安卓1人,后台2人,日常根据需求量和开发时间进行人员协调)
四、引流推广
小程序:基于微信用户群,活跃指数高,引流效果较好;小程序可以跟公众号进行互相跳转,降低了推广难度,提高了活跃度。但小程序是基于腾讯的开发框架,自然会受到微信的一些限制,如流量获取,腾讯的政策要求等。
APP:APP内部的功能框,推广拉新的内容由运营者全权把控,推广方式不受限制,推广渠道较多,自由度较高。但APP需要用户主动在应用市场下载,推广难度较大。
五、产品定位
小程序:小程序的大小受到微信的控制,用户有“快速打卡,用完即走”的特点,所以一般来说,小程序的功能框架会设置比较简单,轻量级的,偏向工具属性的应用。
APP:内存不受限制,内容框架可以根据产品定位随意添加,可发挥的空间大。
通常将APP现有成熟的内容板块进行删减重组再迁入小程序体系中,做出适合微信生态圈的小程序产品。
(给栗同学小程序在原APP课程、学习、目标、我的四个功能板块进行删减,只保留了课程、我的板块,让用户能在微信环境内进行完成核心的听课、学习打卡的功能,其他个性化和复杂的功能仍需要用户下载APP才能体验)
六、基础框架
1,顶部导航栏
小程序:官方指定了两种样式,一深一浅,背景色可自定义,遵循“导航明确、来去自如”的原则。导航栏“胶囊”icon的位置不可变,其余可以自定义,只是相对来说比较麻烦。
APP:不受限制,设计自由,可发挥程度高(导航栏+banner+icon可自由组合)
(给栗小程序用官方固定的样式,没有使用自定义,APP导航栏则添加了搜索框,页面上滑是隐藏搜索框,显示搜索图标加页面标题)
2、底部标签栏
小程序:小程序受制于微信框架的限制,tab切换的形式会比较单一,使用常规的切换方式,不会有动态的效果。
APP:原生的APP,标签栏可以有丰富的表现形式,冲破边界的异形元素,动效切换形式等
(给栗小程序使用的常规切换效果,而APP则选择了图标动效变化行使表现更加丰富)
3,弹窗
小程序:导航栏与标签栏层级最高,弹窗不能置顶,用户依旧可以点击标签栏切换不同的界面
APP:app中页面弹窗的优先级是最高的,会强制用户阅读弹窗内容,只有手动关闭弹窗才能执行其他动作
(给栗小程序显示“温馨提示”弹窗时,导航栏和标签栏依然可以直接点击,跳转到不同页面,而APP显示弹窗时,用户必须触发页面关闭弹窗后,其他区域才能点击生效)
4,引导页/闪屏页
小程序:受制于微信框架,无引导页和闪屏页
APP:一般有2-4张引导页,介绍产品的核心功能和具体玩法、闪屏广告来增加盈利或者节日问候来增强产品温度
(给栗同学APP下载安装,启动页设置加载动效,增加产品趣味性体验)
5,消息推送
小程序:不允许主动给用户推送广告,仅能回复模版消息
APP:用户推送消息,广告等
七、用户体验
小程序:
1、微信首页小程序入口,至少需要3步才能打开小程序,点击微信—首页下拉—点击小程序
2、小程序切换界面层级较深时,加载动态数据时会存在部分卡顿现象
3、受到内存的控制,动画展示元素较少,界面的切换体验比较单一,平淡
4、微信公众号和小程序可以快速互通响应
APP:
1、已下载的app手机桌面直接开启
2、app界面切换的流畅度和加载数据源的响应速度较好
3、可以实现有趣的动画展示,氛围感浓烈,带给用户友好的沉浸感和归属感
4、小程序与app关联体验较差