小 程 序 云 开 发 介 绍 文 档
产品名称:爱心收发室小程序
一、产品概述
1.产品简介
爱心收发室是一款与校自管会爱心收发室联名推出的信息查询类小程序。旨在为科大师生提供更好的校园服务。
2.产品定位
校园信息查询服务,操作简单,方便实用。
3.应用前景分析
传统的失物招领服务中心,采取的是上交,备案,人工查询的方式。该方式费时费力;而qq群,公众号等方式则严重缺乏时效性。
该小程序实现了及时发布消息,支持基本寻物信息与招领信息的发布,支持图片上传。并且管理员可登陆小程序,更好的进行信息管理。
二、产品技术方案
1.产品特色优势
精准性:可直接在小程序中精确搜索校园卡、身份证、学生证等证件以及其他物品。
同步性:管理员可通过登陆小程序实现线下爱心收发室服务中心与线上小程序无缝衔接,将已有的丢失物品信息一键发布,实现同步。
时效性:可实现随时随地发布,随时随地查询。
我们还有管理端,每次可以更新数百条消息,由相应的学生组织负责运行。
2. 技术方案
2.1小程序端
在开发的前期我们先确定了主题,在主题确定以后先做大体的样式,主题为小程序端,采用wxml、wxss、js等语言编写这些语言分别相当于前端的html、css、和js。对于组件,我们一共自定义了14个组件分别是button、contact、dialog、icon、loading、loadmore、mapTap、message、popup、puclish、seeks、warn其中组件public文件中还细分为babyLost,pickUp,以及publish等三个组件。
button是一个特殊的提交按钮主件,可以在使用时更改样式,icon是一个图标库小程序中用到的大多数图标都是从这里获取,loading是一个等待按钮,当我们搜索一条消息或者加载一个页面会显示等待,极大的提高了用户体验。loadmore是当加载多条消息时会在底部显示加载中的提示,message则是当点击发布时,以及删除一条消息会弹出一个温馨提示,warn在发布页面以及在证件查找页面会出现,这些组件在小程序中被多次使用,简化代码。组件的使用方便我们更好的维护小程序。而publish中的三个组件则是在发布页面中使用的。popup组件是用户在第一次使用小程序时才会显示,用于授权时,为了保证用户发布消息的准确性用户需要授权才可以使用该小程序。像反馈,加载,以及提示组件。是我们团队借鉴一下一些优秀的小程序来做的。
在小程序制作的过程中我们也遇到了很多的难题,像textarea的层次是最高的,当出现提示框时并没有出现预想的效果,原本预想的提示框会覆盖掉其他的组件充满全屏,在提交我们发布消息时弹出温馨提示框,但是textarea却怎么也不能覆盖,我们采用替换的方法,当弹出提示框,textarea组件会被隐藏,使用text的组件替换,同时也将textarea组件中的内容替换,用户也察觉不出替换的效果。从云开发获取消息时一次最多只能获取20条消息,我们采用的是上拉加载的方法分批加载,这样既可以解决问题,还可以增强用户体验。
2.2 后端
当小程序端的任务做完后开始做后端。我们采用云开发来替代服务器,后端语言采用node.js。通过node.js来获取用户的openid,管理员账号和密码,当用户发布的消息超过一个月时消息会被自动删除,管理员操作用户信息等。云开发的数据库有限权,不能修改他人消息以及删除等,我们同样通过使用云函数来解决。除此之外,在用户发布信息前会通过云函数对用户所发信息进行校验,如果发布信息包含敏感信息,则发布会失败。
在开发小程序时,我们查阅过大量的小程序,学习他人小程序的优点,取长补短。为了增强用户体验我们不断的修改小程序,更改一些样式以及功能,主题色以及样式都是我们不断修改,争取使我们的小程序变得简洁,美观。
3. 性能分析
我们使用至少15部不同型号的手机进行测试,有苹果、华为、oppo、vivo、小米等。在发布页面可以发布一些捡到的证件,其他物品,以及寻物启事。证件类消息使用同一个方法函数,证件类中以校园卡为例我们发布了100条消息,而捡到其他物品以及寻物启事也是使用同一方法函数,这个函数及方法难于证件类的方法及函数,我们任然测试了100条消息。还有管理端我们每次更新上百条数据,它们最后的测试结果均与我们期望一致。并且搜索是在一秒内完成。
三、产品使用体验说明
1.普通用户
1.1授权登录
用户首次使用时,会弹出窗口,点击“登录”按钮后,底部弹出授权框,点击“允许”按钮,即可成功登录。
1.2查找失物/拾物信息
授权登录后,在首页点击要查找的证件进入查询页面,选择学院,输入姓名,提交后,即可查看搜索结果。在搜索结果中可看到拾取者的联系方式及物品详细信息。如需搜索其他物品,则点击“其他”按钮,已被捡到的物品会以列表展示,方便丢失者查找。
1.3发布拾物/失物信息
授权登录后,点击底部导航栏“发布”按钮进入发布信息页面。在上部选择捡到物品,底部选择证件类型,填写失主的学院,姓名,物品描述,以及拾取者的联系方式,发布即可;上部选择物品丢失,输入物品信息,联系方式以及物品图片,发布即可,发布后可在寻物启事中进行查看。
1.4管理历史记录
授权登录后,在底部导航栏“个人”中。点击头像可查看用户发布过的信息,点击相应信息可删除已找回的物品。
2.管理员
2.1上传已有的证件或物品
在“个人”界面,点击“头像”按钮,登陆后进入管理员界面,可将已有证件或物品的信息粘贴,上传后即可同步到小程序。
2.2查看管理用户已发布信息
在“个人”界面,点击“管理员登录”按钮,登录后进入管理员界面,点击右上角图标,可查看用户已发布的信息,并管理。
3.产品使用
3.1捡到证件类物品
以校园卡为例,在“发布”页面的校园卡选项发布如图
然后可在首页的校园卡选项查看发布消息
3.2 丢失物品
在发布页面的物品丢失栏可以发布丢失的物品,然后点击发布,点击确定。在此处会对信息内容进行安全校验,如包含敏感信息则发布会失败。
查看时,在首页点击寻物启事栏,之后在点击刚才发布消息即可查看刚才发布的具体消息
3.3 管理端发布消息,并且提交,账号:20200831,密码:aixinshoufashi.密码账号可以随时在后端修改,还可以进入管理页面,对不符合要求或者虚假信息进行删除等管理(在个人页面中点击头像),由于小程序正在被用户使用,请不要轻易更改我们的信息哦。
还可以搜索到在管理端发布的消息比如寻找刚刚发布的校园卡
我们与学生会合作由学生组织负责运行,并且将小程序与微信公众号,qq公众号配合使用,使我们的小程序发挥出最大的价值。学生组织主要负责管理端,他们在每周一至周五,都会在管理端一次性更新大量的消息,19年9月-20年1月期间新用户增长2023人。
现在也有了相同功能的QQ小程序,和微信小程序使用同一个腾讯云的云开发。(请使用QQ扫码体验)
名称和思路都可以,就是界面看着感觉差了些什么
加油, 美工跟上
UI界面可以在优化一下,功能和思路其实还不错,这个产品在校园内应该会很有市场
河北科技大学理工学院的吗?我在你们的对面,正在研发几个市场化小程序,有兴趣可以联系我,可以提供实习和兼职机会。
虽然做的比较粗糙,但是思路可以,产品应该有市场,特别在校园内
做成这样,应该是无法入围的。