Java-远程-1个月
¥6-12K/月
技能要求: HTML5
经验要求: 5-10年经验
程序员客栈
2026-04-19 17:20
工作描述:
项目编号:【186470】
一、项目背景

这是一个传统文化解读的趣味测试H5。用户输入生辰信息,系统排盘生成八字,再通过AI生成“前世身份卡”(含前世职业、成就、卡通形象),用户可保存卡片分享至微信好友/朋友圈。完全免费,无付费功能,无用户注册。

二、核心功能模块(共4个)

模块1:欢迎页

主标题:“探索你的前世今生”(或类似文案,你提供)

副标题:一句话吸引用户(你提供)

按钮:“免费开启解读”,点击进入信息收集页

模块2:信息收集页

输入项:姓名(选填)、出生日期(公历,年月日)、出生时间(时,默认12:00)

提示文案:“你的信息仅用于本次解读,不会被保存”

按钮:“生成我的命格”,点击后显示加载动画(如“正在连接你的前世今生...”),调用后端API

模块3:结果展示页

顶部:八字四柱(年柱、月柱、日柱、时柱,天干+地支)

中部:前世身份卡,包含前世职业、前世成就(一句夸张有趣的话)、前世寄语(一句温情文案)、卡通人物形象(根据五行匹配不同模板)

底部:

“保存图片”按钮:点击后,将当前结果页(含八字+前世身份卡)合成一张图片,保存至手机相册

“分享给朋友”按钮:点击后,调起微信分享接口,分享一张带二维码的裂变卡片(二维码指向你的H5入口链接)

AI生成标识(必须):“本内容由AI生成,仅供参考”

模块4:后端API(外包方负责开发)

API 1:接收前端传来的出生日期+时间,调用lunar-javascript(或lunisolar)计算八字四柱、十神、五行,返回JSON

API 2:接收八字结果,拼接预设提示词,调用DeepSeek API生成前世职业、成就、寄语,返回JSON

注意:后端需预留微信JS-SDK签名服务接口,用于前端分享配置

三、微信分享功能

使用微信JS-SDK,实现自定义分享标题、描述、缩略图

分享卡片图片由前端合成(含用户前世身份信息+二维码),分享时调用
二维码由前端生成,指向H5入口链接

四、技术栈要求

前端:原生HTML/CSS/JavaScript,或React/Vue(你指定,或由外包方推荐)

后端:Node.js(推荐)或Python

八字计算库:lunar-javascript(开源)

AI接口:DeepSeek API

图片合成:html2canvas

五、设计风格

主色调:红色系(#ff5722等),背景深色(#1a1614等),营造神秘感

卡片风格:卡通、趣味、年轻化

适配:移动端H5(375px宽),微信内置浏览器

页面数量:共3屏(欢迎页、信息页、结果页)

六、交付物

完整前端源码(HTML/CSS/JS,或Vue/React项目)

完整后端源码(Node.js/Python)

部署文档(含服务器环境配置、API密钥配置、微信JS-SDK配置说明)

演示链接(部署在乙方测试服务器,供验收)

七、验收标准

输入正确生辰后,八字四柱与公开排盘工具(如“问真八字”)结果一致

AI生成内容符合预期风格,无乱码、无“幻觉”(如胡编职业)

微信内分享卡片正常展示,二维码可扫码进入H5

所有页面在不同尺寸手机、微信版本下显示正常
公司信息

立即沟通