
新春将至,丙午马年氛围渐浓,一款可自定义生成马年头像、支持分享与历史记录的小程序,既是节日趣味互动工具,也是商家提升用户粘性的优质载体。本文精简核心步骤,分基础版与进阶版,手把手教你零基础搭建,总字数控制在1000字左右,实操性拉满。
小程序核心分为两大模块:基础版实现AI生图核心功能,进阶版优化用户体验,补充微信头像获取、分享及历史记录功能,全程无需复杂技术,按步骤即可完成。

基础版:搭建AI生图核心,实现头像定制
基础版重点完成AI智能体配置与简易页面搭建,满足核心生图需求。第一步,新建项目后,在平台右下角创建AI智能体,选择纳米香蕉2及以上模型,首次配置提示词时按提示更新后端,添加图片类型入参,写入马年风格描述及1:1比例提示词,适配头像展示。

第二步,创建风格数据模型,设置风格名称和具体prompt两个字段,更新后端后,导入国风骏影、鎏金马纹等马年风格prompt,实现快速调用。第三步,回到智能体,添加style ID入参,关联风格数据表,筛选对应ID的prompt,删除手动prompt,测试生成效果。

第四步,搭建前端页面,添加图片选择器、风格选择视图和生成按钮,配置按钮关联智能体,关闭流式输出,添加图片列表变量接收生成结果,绑定列表组件展示图片,调整UI后即可发布,实现基础生图功能。
进阶版:优化体验,补充三大实用功能
进阶版先创建图片生成页、分享结果页、历史记录页三个页面,开启底部导航栏关联核心页面。第一步,配置行为流,添加图片和style ID入参,开启异步操作,关联AI智能体,创建生成图片数据表,同步保存生成记录及用户信息,避免数据丢失。

第二步,优化生成页,将按钮行为替换为行为流,添加校验条件,避免空操作,添加loading弹窗,优化等待体验,配置成功跳转分享页、失败返回重试。第三步,调用微信原生能力,添加“选择微信头像”按钮,获取头像后同步至用户表,实现一键获取与复用。

第四步,搭建分享结果页,绑定生成图片数据,配置分享功能,实现好友转发,添加重新生成按钮,带入历史风格与图片,无需重复操作;搭建历史记录页,绑定用户专属生成记录,实现头像查看与二次操作。
避坑小贴士与总结
核心避坑点:务必添加1:1比例提示词;数据库配置后及时更新后端;行为流入参绑定准确,避免页面无数据。
本次教程精简核心步骤,完整覆盖生成、保存、分享、记录全流程,既适合个人与好友互动,也可适配餐饮、文创等商家节日营销。按步骤实操即可快速搭建,助力解锁马年节日互动新方式,无需复杂技术,零基础也能轻松上手。