基于人脸识别的智能服饰搭配小程序

(一) 技术方案
开发工具：微信小程序开发者工具
美术风格定位：白色和红色为主要颜色搭配界面，美观，调理清晰，完美兼容ios系统和安卓系统。设计元素上强调抽象、极简、符号化，去除冗余的装饰效果突显小程序的文字图片等信息内容。
所用技术：
前端：框架语言wxml，逻辑语言JavaScript，wxss样式；
数据交换格式：json；
服务器：小程序云服务器；
云开发：小程序云——云开发，云数据库，云函数，云储存；（.node格式）
所用Api：微信小程序原生api，百度人脸识别api
样式库：vant（轻量，可靠的移动端vue组件库）
开发框架：mpvue

(二) 效果展示

1.第一次进入小程序会有授权登录页面，在授权登录页面会对该小程序主要的功能和人脸识别实现原理进行介绍；获取用户信息授权登录使用:bindgetuserinfo

2.点击授权登录之后会进入BMI（身体质量指数）检测页面，输入身高和体重后根据算法计算出BMI值从而检测出体型（偏瘦，正常，过重，肥胖），将结果储存到微信缓存里。储存进微信缓存使用微信原生api：wx.setStorageSync，弹窗使用wx.showmodal。BMI计算公式：BMI=体重（千克）/（身高（米）*身高（米））

3.检测完体型之后点击确定会进入人脸识别界面，人脸识别界面分别有人脸追踪功能和人脸识别功能，人脸识别可识别出用户脸型，识别成功后将识别结果储存到微信缓存里。
功能实现简要流程：

人脸追踪：使用定时调用函数setInterval()每500毫秒调用自定义方法takephoto（），takephoto方法调用wx.createCameraContext()调用当前设备摄像头，调用api：wx.getimageinfo（）获取图片真实宽高和路径wx.getFileSystemManager().readFile（）根据路径将图片的编码格式变为“BASE64“ 将图片通过wx.request发送到百度云人脸位置识别接口，成功将返回图片的宽高，最后使用微信api：wx.drawCavans根据百度云人脸位置识别结果绘制画布，让用户能够直观的看到人脸的位置（如下图），每500毫秒显示一次位置。
人脸识别：功能主要实现和人脸追踪功能类似，调用百度云人脸属性识别接口。

人脸识别成功之后点击进入主页面，主页面有对衣服和裤子的细分类和风格推荐功能，用户可以选择自己喜欢的服饰加入衣柜。
主页面主要使用样式wxss比较多，底部tabbar有“首页“，”我的衣柜“，”我的信息“三部分首页中一共有十四个点击事件，其中三个是tabbar，一个是搜索页面链接，十个是服饰引索（裤子衣服，风格推荐如下图），服饰引索根据点击的按钮不同，给某个全局变量赋不同的值，根据这个全局变量的值在进入服饰列表页面时调用数据库不同的数据，在wxml页面中遍历出服饰信息从而在服饰列表页面显示不同的服饰信息（图片，服饰名称，价格）。
选择了完自己喜欢的服饰之后点击进入衣柜可查看之前加入衣柜的服饰，“我的衣柜”页面里有删除服饰和进入淘宝购买页面的功能。
由于调用数据库信息后，数据存储结构类型是数组类型，用户点击“加入衣柜”按钮时，获取e.currentTarget.dataset.id的值取得当前遍历数组下标，再通过wx.setStorageSync将当前服饰信息存储到微信缓存中，进入“我的衣柜”时会通过：wx.getStorageSync取得服饰信息缓存，调用数组中相关下标取得服饰图片，名称，价格，购买链接，将图片名称，价格显示再页面中，点击“前往购买”会调用该服饰的购买链接进入淘宝页面。点击删除按钮会删除该服饰的全部信息并刷新页面，实现删除的功能。具体实现是把该数组下标元素之后的全部元素向前移动一个单位，实现删除信息。缓存数组如下图：

首页的上面有商品搜索功能，进入商品搜索页面输入相应字符，系统会引索出相应的信息。
最后是“我的信息”页面，用户对该小程序进行授权之后，小程序调用相应的api获取用户的头像，账号，微信名称，性别显示在页面上，之前检测的体型和脸型也会显示在页面上，最下面有“服装推荐”按钮，点击该按钮之后根据用户的体型，脸型，性别调用数据库相应的数据进入商品列表页面，为用户提供适合自己的服饰。“服装推荐”按钮也类似首页的风格推荐按钮，根据体态，性别，脸型的不同，给某一全局变量赋值，调用相应的服饰信息。

8，更多截图
云数据库截图：

云存储截图：

百度云人脸识别控制台截图：

基于人脸识别的智能服饰搭配小程序相关推荐

【Python】基于人脸识别的智能考勤系统（Pyqt5+MySQL+Opencv） [PC端部分-已附源码]
[Python]基于人脸识别的考勤系统 [PC端部分] 一.项目简介本项目编程语言Python3.6,编程工具pycharm,其他工具QT Designer.Navicat,表单信息保存在本地MyS ...
【项目实训】基于人脸识别的课堂签到管理系统（python+qt5+sqlite3+百度智能云）
[项目实训]基于人脸识别的课堂签到管理系统(python+qt5+sqlite3+百度智能云) 一.环境介绍二.签到功能 2.1 启动签到 2.2 结束签到三.用户组操作 3.1 添加用户组 3. ...
基于人脸识别的课堂签到管理系统（五）---启动/结束签到，以及在百度智能云创建用户组
基于人脸识别的课堂签到管理系统(五)---启动/结束签到,以及在百度智能云创建用户组一.前言概述二.签到功能 2.1 启动签到 2.2 结束签到三.创建用户四.程序展示五.相关下载一.前言 ...
毕设项目-基于人脸识别的高校课堂考勤微信小程序及系统
基于人脸识别的高校课堂考勤微信小程序及系统人脸识别.地图定位考勤微信小程序,调用百度云免费人脸识别API实现. 功能简介教师学生信息管理,课堂考勤信息管理,人脸识别,地图打卡四大模块. 功能模块说 ...
基于人脸识别技术的智能安防系统优化升级
作者:禅与计算机程序设计艺术近年来随着无人机.机器人等新型产品的出现,越来越多的人群开始把目光投向安防领域.虽然在短时间内智能化建筑.物联网.无人机等技术出现并迅速崛起,但由于技术发展速度不断加快, ...
基于人脸识别的课堂签到管理系统（六）---删除，查询用户组以及人脸的添加，删除,更新
基于人脸识别的课堂签到管理系统(六)---删除,查询用户组以及人脸的添加,删除一.用户组操作 1.1 查询用户组 1.2 删除用户组二.人脸操作 2.1 人脸添加 2.2 人脸更新 2.3 人脸删 ...
基于人脸识别的课堂签到管理系统（三）---实时时间显示以及百度AI人脸识别
基于人脸识别的课堂签到管理系统(三)---实时时间显示以及百度AI人脸识别一.前言概述二.实时时间显示三.百度AI人脸识别 3.1 获取access_token 3.2 发送请求,通过网络请求方 ...
夜间环境人脸识别_基于人脸识别的夜间疲劳驾驶判断方法与流程
本发明属于智能识别设有领域,尤其是一种基于人脸识别的夜间疲劳驾驶判断方法. 背景技术: 出租车和网约车在夜间运营极大的方便了人们的出行需求,但是出租车司机为了增加收入常常延长工作时间特别在夜间行驶的时 ...
基于人脸识别的考勤记录项目
写在前面,通过小项目来驱动学习和实践是一种进步很快的方法,本文就是介绍一个基于人脸识别的考勤小项目(Python). 项目学习自一位Youtuber. 1.前期知识 1)了解face_recognit ...

基于人脸识别的智能服饰搭配小程序

基于人脸识别的智能服饰搭配小程序

基于人脸识别的智能服饰搭配小程序相关推荐

最新文章

热门文章