熊喵表情 - 开启AI表情制作新时代

熊喵表情,一款可以个性化定制您的专属表情头像的应用。不管是静态表情,还是动态表情,熊喵表情都能轻松制作,无需复杂的手动抠图,只需上传一张人脸照片,个性表情就能一键生成。还有独创的文生表情功能,好用到令人发指,关键还免费,简直是暴殄天物。下面我就来介绍一下如何从零开始制作这一款APP。

技术栈及选型

原生 vs 跨平台:原生需要为每种平台都开发一个应用(如android和ios以及各种小程序),而跨平台多端共用一套代码,对于独立开发者和中小微企业,选择跨平台是明智之举。

国外跨平台 vs 国产跨平台:国外主要用RN 和 Flutter,这两个框架Flutter最近几年渐入佳境,有很多重量级的APP都是使用RN开发的,例如美团等等。但是国外平台有个硬伤,就是不支持国内生态,尤其是微信生态。因此选国产跨平台也是没得选。

国内跨平台框架: 简单对比便能分出高下,为了全端小程序都能上线,可选项就只有Taro vs uniapp,这是网上搜到的一个对比图,大家可以简单看一下。

框架 技术栈 案例 微信小程序 支付宝小程序 百度小程序 头条小程序 H5 App
Taro React 丰富
娜娜奇 React ⭕️ ⭕️ ⭕️ ⭕️
wepy Vue 丰富
mpvue Vue 丰富 ⭕️
uni-app Vue 丰富 ⭕️ ⭕️ ⭕️
megalo Vue ⭕️ ⭕️
OKAM Vue
Mpx Vue

至于Taro和uniapp怎么选,我觉得因人而异,我希望能够快速的出原型,因此我选择了周边更丰富的uniapp,例如UI框架,甚至用户登录认证模块,uniapp都有现成的模块和插件来支持,所以用uniapp开发会很快。当然我也注意到网上有一些关于uniad的评价,我表示我会自己评估,如果确实有问题,再换到Taro也不难,我在功能设计上已经将几乎所有核心功能做到了服务端,客户端真的就只是个界面展示。

Taro vs uniapp

Taro uniapp
开发语言 RN Vue
开发工具 VSCODE 插件 HBuilder
性能 极致 优秀
社区生态 Github star 3k 轮子少 Github star 1k 轮子多

后端选型

这个应用需要使用很多OpenCV的算法,要制作成后端API使用,用python flask来做最合适不过。

架构设计

熊喵表情 - 开启AI表情制作新时代_第1张图片

因为我做了10多个应用,我发现每个应用都需要有个搜索功能,于是我干脆自己搭建了一个ElasticSearch的集群,3台机器就能搞定这些应用的全文搜索,并且还挺稳定的,几个月了这个集群还是很健康。

熊喵表情 - 开启AI表情制作新时代_第2张图片

opencv+dlib,dlib就是一个人脸检测工具,opencv能做图片处理,合在一起就能用人脸制作表情,这里有两个点需要注意

  1. dlib 需要开启AVX加速,不然检测时长会超过2s。

  2. 需要将opencv+dlib打包到层中,云函数再使用这个层,云函数才能随心所欲的使用这个人脸检测的功能。

重难点实现

  1. 动态表情换头功能的实现

熊喵表情 - 开启AI表情制作新时代_第3张图片

    核心代码就这么几行,就是从腾讯云对象存储先下载下来用户上传的头像,然后用dlib检测头像中的人脸;同时下载模板GIF图片,对GIF图片里面的每一帧,都用人脸替换到空白的位置。最后用Imageio合并成一个GIF文件,并上传到对象存储,整个过程来回小于1s。

熊喵表情 - 开启AI表情制作新时代_第4张图片

2. 熊猫表情制作

熊喵表情 - 开启AI表情制作新时代_第5张图片

核心代码也就这么多,主要不同的是用到了opencv的seamlessClone功能

熊喵表情 - 开启AI表情制作新时代_第6张图片

3. 文生表情功能

之前逛贴吧看到一张熊猫打麻将的表情,我用这个文生表情的功能,做了一个同款,除了麻将做的不是很真实,整体效果还是很不错的。这个用了文生图的大模型sdxl emoji

熊喵表情 - 开启AI表情制作新时代_第7张图片

部署及运维

目前仅上架了微信小程序,服务器端就是个云函数,给了3G的内存。大模型目前用的别人免费的API。

熊喵表情 - 开启AI表情制作新时代_第8张图片

你可能感兴趣的:(人工智能)