分享一款AI绘画图片展示和分享的小程序
🎨奇绘图册
【开源】一款帮AI绘画爱好者维护绘图作品的小程序
查看Demo · 反馈 · github
文章目录
- 前言
- 一、奇绘图册是什么?
- 二、项目全景
- 三、预览体验
- 3.1 截图示例
- 3.2 在线体验
- 四、功能介绍
- 4.1 小程序
- 4.2 服务端
- 五、安装部署
- 5.1 快速开始
- ~~5.2 手动部署~~
- ~~5.3 使用docker部署~~
- 1、前置处理
- 2、运行容器
- 3、后置处理
- 六、项目地址
- 结语
前言
从2024年开始接触AI绘画,玩了大半年stable diffusion + sdwebui 、flux + comfyui,也尝试过hunyuan、cogvideo、svd、ltx等AI生成视频(Mac有点带不动),先后画了上万张图。想记录下自己的成果、不同时期的风格、与朋友分享交流,出于以上三个目的,写了个小程序。
之后又建设了一套生成图片后自动发布到抖音、快手等社交平台的流水线,做了些账号,让绘图更有价值。但由于过千粉之后不实名也没啥变现功能,也没再继续。
趁着蛇年春节的空闲时间,整理了下代码,将基础的图片展示小程序开源,发挥些余热,希望帮每一个AI绘画爱好者记录自己的作品成果。
一、奇绘图册是什么?
一款帮AI绘画爱好者记录和维护绘图作品的小程序。旨在让大家能够便捷的拥有一个个人画廊工具。
二、项目全景

完整的项目结构如图,其中绿色部分是目前开源的内容。虚线部分由于我的Mac M3带不动图生视频模型甚至flux也很吃力,所以本项目主要基于SD及webui实现,理论上都适用,但兼容性未做过多测试,可能存在问题。
社交平台自动发布部分不准备分享,因为喜闻乐见的一公布就容易被封禁失效,有兴趣的可以交流探讨,也可开动脑筋自行实现。
群聊机器人部分由于wechaty等群聊机器人年底全被封了,企业群聊机器人又只能加入组织后才能体验,展示demo十分不便,所以没有整理这部分,也暂不做讨论。后续整理完代码后开源,目前代码实现有点乱,大家可以先关注一波。
三、预览体验
3.1 截图示例

3.2 在线体验

- 由于视频类目不支持,demo中视频使用gif图片兼容
- 由于审核原因,只放了一点点普通图片
- 由于示例服务器带宽较低,可能加载稍慢
以上,敬请谅解~
您如果只是自用,且擦边内容较多,也可以考虑只发布到体验版,不上线到正式版。
四、功能介绍
4.1 小程序
如上面架构图中小程序部分所示,小程序部分主体分三个模块:图集、图池、视频。
- 图集:当提示词等参数不变时,生成的同一批图片视为一个图集,即
prompt_hash相同的若干图片展示在一起,并展示对应的画图参数。 - 图池:展示指定目录中的全部图片。指定图片目录后,系统自动维护里边的图片信息,生成类似github贡献热力图,可按日期查阅不同日期的图片,见证自己的过往成就和风格变化。
- 视频:展示视频列表。可直接在图池页面选择多张图片自动合成简易的幻灯片式的轮播视频;也可使用文、图生视频的结果(作者Mac M3带不动图生视频,可以自己完善)
4.2 服务端
-
服务端通过定时任务更新目录中的图片数据,也可主动调用指令。(
php artisan sync:images) -
数据存储在mysql,图片文件可以选择存储在本地磁盘(默认)或对象存储服务,只需调整.env中的
FILESYSTEM_DISK=s3,并设置AWS_相关配置。 -
如果图片文件存储在本地磁盘,可以通过nginx的
http_image_filter_module模块压缩图片,节省服务器带宽(小程序封面展示不需要太高清)约10倍;有条件的可以使用对象储存服务,配合CDN资源加载速度更快。

-
通过ffmpeg可以实现简单的多张图片合并成视频,有条件的可以接入大模型的图生视频产物。

五、安装部署
微信小程序仓库下载后使用微信开发者工具打开即可配合后端项目使用,这里不做展开,主要介绍服务端部分。
- 服务端接口基于
php实现,使用laravel11框架,依赖php8.2及以上版本。 - 图片拼接视频部分依赖
ffmpegv4.4以上,可参考以往博文:ffmpeg翻页转场动效的安装及使用
- 如果您没有php或ffmpeg,但有docker,也可以通过
docker构建。
5.1 快速开始
🔔项目提供了一键部署脚本,可以直接运行bash deploy.sh(确保网络/代理畅通),会优先检测php版本符合要求执行本地部署;不符合要求时执行docker部署。无需再关注5.1、5.2部分。
其中deploy.sh运行时支持图片路径参数即sh deploy.sh 你的图片目录,不指定路径时默认使用项目根目录的demo文件夹
git clone https://github.com/WYQilin/aigallery-server
cd aigallery-server
bash deploy.sh
# 或 sh depoly.sh 你的图片目录
三行指令即可完成安装,部署完成后到小程序查看即可。
5.2 手动部署
1、 下载源码
git clone https://github.com/WYQilin/aigallery-server
cd aigallery-server
2、修改配置
示例配置里已调整好默认值,可以复制使用,仅调整文件中的 # 数据库 和 # 小程序 部分
cp .env.example .env
3、安装依赖
composer install
4、初始化laravel
php artisan key:generate
php artisan migrate
php artisan storage:link
5、指定图片目录
系统会处理storage/ai_images目录,可以你的图片复制进来或软链到该目录。如何您远程服务器部署可以rsync等指令同步文件夹到服务器。
cp -r 你的图片目录 storage/ai_images #复制
ln -s 你的图片目录 storage/ai_images #软链(docker容器不要使用软链)
6、处理图片
目录设置好后,可以运行脚本处理图片写入数据库
php artisan sync:images --all
设置定时任务,每分钟同步一次图片文件
crontab -e新增一条:
* * * * * cd 项目根路径 && php artisan schedule:run >> /dev/null 2>&1
7、启动服务
php artisan serve
服务启动后重新进入小程序可以即可看到图片列表们。
5.3 使用docker部署
请确保已安装docker,且魔法网络畅通或设置了国内镜像。
docker只为了方便快速体验,建议手动按需部署。
1、前置处理
按5.2中的1、2步完成代码下载并设置好数据库、小程序key等配置。
2、运行容器
如果您熟悉laravel的sail可以直接使用sail启动(laravel专用的docker交互程序,它会自动完成一些事情,且更方便)
由于docker-compose.yml文件中会使用变量,需要从.env文件中先加载他们(或手动修改docker-compos.yml的配置变量)
export $(grep -v '^#' .env | xargs) && docker-compose up
3、后置处理
容器创建并运行后,进入容器中继续执行5.1中第2步之后的各步骤
六、项目地址
微信小程序:https://github.com/WYQilin/aigallery
服务端接口:https://github.com/WYQilin/aigallery-server
(网络不佳时可以搜索gitee同名仓库)
🌟🌟感谢大家star~
结语
有技术性问题或建议优先在对应github仓库提issue,简单交流可以博客留言或私信,感谢大家~
相关文章:
分享一款AI绘画图片展示和分享的小程序
🎨奇绘图册 【开源】一款帮AI绘画爱好者维护绘图作品的小程序 查看Demo 反馈 github 文章目录 前言一、奇绘图册是什么?二、项目全景三、预览体验3.1 截图示例3.2 在线体验 四、功能介绍4.1 小程序4.2 服务端 五、安装部署5.1 快速开始~~5.2 手动部…...
大模型知识蒸馏技术(4)——离线蒸馏
版权声明 本文原创作者:谷哥的小弟作者博客地址:http://blog.csdn.net/lfdfhl离线蒸馏概述 离线蒸馏是知识蒸馏中最早被提出且最为常见的实现方式,其核心在于教师模型和学生模型的训练是分阶段进行的。具体而言,教师模型首先在训练集上进行充分训练,直至收敛,然后利用教…...
解决DeepSeek服务器繁忙的有效方法
全球42%的企业遭遇过AI工具服务器过载导致内容生产中断(数据来源:Gartner 2025)。当竞品在凌晨3点自动发布「智能家居安装指南」时,你的团队可能正因DeepSeek服务器繁忙错失「净水器保养教程」的流量黄金期⏳。147SEO智能调度系统…...
【C++游戏开发-五子棋】
使用C开发五子棋游戏的详细实现方案,涵盖核心逻辑、界面设计和AI对战功能: 1. 项目结构 FiveChess/ ├── include/ │ ├── Board.h // 棋盘类 │ ├── Player.h // 玩家类 │ ├── AI.h // AI类 │ └── Game.h // 游戏主逻辑 ├── src/ …...
Ubuntu 下 nginx-1.24.0 源码分析 - NGX_MAX_ALLOC_FROM_POOL
NGX_MAX_ALLOC_FROM_POOL 定义在 src\core\ngx_palloc.h #define NGX_MAX_ALLOC_FROM_POOL (ngx_pagesize - 1) 在 src/os/unix/ngx_alloc.h extern ngx_uint_t ngx_pagesize; 这个全局变量定义在 src\os\unix\ngx_alloc.c 中 ngx_uint_t ngx_pagesize; 在 src/os/unix/ngx_…...
等距节点插值公式
目录 等距节点插值公式Newton 前插公式Newton 后插公式 等距节点插值公式 将 Newton 差商插值多项式中各阶差商用相应差分代替,就可得到各种形式的等距节点插值公式,例如常用的前插公式与后插公式。 Newton 前插公式 如果节点 x k x 0 k h ( k 0 , …...
BT401双模音频蓝牙模块如何开启ble的透传,有什么注意事项
BT401音频蓝牙模块如何开启ble的透传? 首先BT401的蓝牙音频模块,分为两个版本,dac版本和iis数字音频版本 DAC版本:就是BT401蓝牙模块【9和10脚】直接输出模拟音频信号,也就是说,直接推动耳机可以听到声音 …...
基于SSM框架的宠物之家系统(有源码+论文!!!)
这个系统可以帮助大家去做设计或者学习,大家可以管我要word版论文🥰这里具体论文内照片、e-r图等等加载不进来, 大家如果想要源码+论文+制定+调试,可以私信我!!(可改别的系统,例如调查问卷系统等等) 目录 第1章 绪论 1.1开发背景 1.2开发工具及语言 第2章 宠物之家系…...
计算机视觉+Numpy和OpenCV入门
Day 1:Python基础Numpy和OpenCV入门 Python基础 变量与数据类型、函数与类的定义、列表与字典操作文件读写操作(读写图像和数据文件) 练习任务:写一个Python脚本,读取一个图像并保存灰度图像。 import cv2 img cv2.im…...
深入理解正则表达式的预查
深入理解正则表达式的预查(Lookahead and Lookbehind) 在正则表达式中,预查(Lookahead and Lookbehind)是一种强大的工具,允许你在不消耗字符的情况下进行匹配检查。预查可以分为四种类型:正向肯定预查、正向否定预查、反向肯定预查和反向否定预查。 1. 正向肯定预查(…...
网工项目理论1.7 设备选型
本专栏持续更新,整一个专栏为一个大型复杂网络工程项目。阅读本文章之前务必先看《本专栏必读》。 一.交换机选型要点 制式:盒式交换机/框式交换机。功能:二层交换机/三层交换机。端口密度:每交换机可以提供的端口数量。端口速率:百兆/千兆/万兆。交换容量:交换矩阵…...
Gateway中的Filter机制
Gateway中的Filter机制 文章目录 Gateway中的Filter机制Gateway中的Filter机制Gateway Filter 机制的概述核心思想与设计Filter 的两种类型过滤器的生命周期Gateway Filter 的特点Gateway Filter 的意义Gateway Filter 的工作原理核心架构与执行流程执行流程解析过滤器类型的角…...
顺序表常用操作和笔试题
1、顺序表的常用操作 1.1 顺序表的创建 如下代码所示:创建了一个默认空间为10的整型顺序表,如果空间不足则会以1.5倍扩容。 List<Integer> list new ArrayList<>(); 创建一个空间为15的整型顺序表 List<Integer> list2 new ArrayL…...
二.数据治理流程架构
1、数据治理流程架构核心思想: 该图描绘了一个以数据标准规范体系为核心,大数据生命周期管理为主线,数据资源中心为依托,并辅以数据质量管理和大数据安全与隐私管理的数据治理流程架构。它旨在通过规范化的流程和技术手段&#x…...
【Java】泛型与集合篇(二)
泛型与集合(二) Set 接口及实现类HashSet 类特点内部实现构造方法LinkedHashSet 类基本概念特点构造方法常用方法适用场景用 Set 对象实现集合运算TreeSet 类特性构造方法常用方法注意事项对象顺序自然排序定制排序注意事项Queue 接口及实现类Queue 接口定义与特点常用方法常…...
解锁机器学习核心算法 | 线性回归:机器学习的基石
在机器学习的众多算法中,线性回归宛如一块基石,看似质朴无华,却稳稳支撑起诸多复杂模型的架构。它是我们初涉机器学习领域时便会邂逅的算法之一,其原理与应用广泛渗透于各个领域。无论是预测房价走势、剖析股票市场波动࿰…...
CSS 底部颗粒磨砂特效
参考:element-plus的顶部效果 background-image: radial-gradient(transparent 1px, var(--bg-color) 1px); background-size: 4px 4px; backdrop-filter: saturate(50%) blur(4px); 注意点:var(--bg-color) 改为跟你背景色相同的即可。 其他自己看情况…...
QT自定义扫描控件,支持任意方位拖动和拖动扫描范围。
部分代码: void FishControlForm::paintEvent(QPaintEvent *event) {QPainter p(this);p.setRenderHints(QPainter::Antialiasing|QPainter::SmoothPixmapTransform);p.translate(m_centerPoint);//bgp.setPen(Qt::white);p.drawEllipse(-m_radius,-m_radius,m_rad…...
Ubuntu18.04安装rvm、ruby2.6.5和rails5.2.6
系统环境:Ubuntu 18.04 一、安装前准备 1. sudo apt update 2. sudo apt upgrade 如果提示abort,忽略。 3. sudo apt install sqlite3 gnupg curl git libpq-dev 二、安装rvm ruby版本管理器 1.切换管理员模式 sudo su 2.安装软件签名公钥 gpg…...
燧光 XimmerseMR SDK接入Unity
官网SDK文档连接: RhinoX Unity XR SDK 一:下载SDK 下载链接:RhinoX Unity XR SDK 二:打开Unity项目,添加Package 1、先添加XR Core Utilties包和XR Interaction Toolkit包 2、导 2、再导入下载好的燧光SDK 三&…...
罗德与施瓦茨ZNB20,矢量网络分析仪9KHz-20GHz
罗德与施瓦茨ZNB20矢量网络分析仪9KHz-20GHz R&SZNB20矢量网络分析仪 产品型号: ZNB20 产品品牌:罗德与施瓦茨 R&S 产品名称: 矢量网络分析仪 频率范围:9kHz - 20GHz R&S ZNB 矢量网络分析仪 良好的测量速度、动态范围和操作方便性&am…...
突破平面限制:低空经济激活城市土地“立体生长力”
蓄锐行:我深耕于低空经济领域,同时对IOT技术有着深入的理解,而在AI的探索性研究上,我也已迈出坚实的步伐,虽起步不久,却满怀热情与憧憬。平日里,我热衷于撰写关于低空经济的文章,分享…...
可调节图片参数,解决图片模糊及尺寸过小问题的工具
软件介绍 你是否正为图片模糊、尺寸太小而烦恼?别担心,有这样一款神器能帮你轻松解决。它能精准调节图片参数,即便原本模糊不清的图片,经它处理后也能变得高清锐利,瞬间让图片焕然一新。而且,它还具备导出…...
React 与 Vue 对比指南 - 上
React 与 Vue 对比指南 - 上 本文将展示如何在 React 和 Vue 中实现常见功能,从基础渲染到高级状态管理 Hello 分别使用 react 和 vue 写一个 Hello World! react export default () > {return <div>Hello World!</div>; }vue <…...
✨2.快速了解HTML5的标签类型
✨✨HTML5 的标签类型丰富多样,每种类型都有其独特的功能和用途,以下是一些常见的 HTML5 标签类型介绍: 🦋结构标签 🪭<html>:它是 HTML 文档的根标签,所有其他标签都包含在这个标签内&am…...
力扣 买卖股票的最佳时机
贪心算法典型例题。 题目 做过股票交易的都知道,想获取最大利润,就得从最低点买入,最高点卖出。这题刚好可以用暴力,一个数组中找到最大的数跟最小的数,然后注意一下最小的数在最大的数前面即可。从一个数组中选两个数…...
【SQL】SQL多表查询
🎄概念 一般我们说的多表查询都涉及外键和父子表之间的关系。比如一对多:一般前面指的是父表后面指的是子表。 ⭐分类 一对多(多对一) 多对多 一对一 ⭐一对多 📢案例:部门与员工的关系 📢关系:一个部门对应多个员…...
HTML之JavaScript DOM(document)编程处理事件
HTML之JavaScript DOM(document)编程处理事件 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"…...
知识篇 | DeepSeek企业部署模式主要有6种
国际数据公司IDC近日发文《DeepSeek爆火的背后,大模型/生成式AI市场生态潜在影响引人关注》表示: “大模型的部署过程需同时满足高并发与低延迟的严苛要求,并需全面考量数据安全、隐私保障、资源弹性扩展以及系统维护等多重因素,D…...
uniapp中@input输入事件在修改值只有第一次有效的问题解决
在uniapp中使用输入框,要求输入不超过7个字,所以需要监听输入事件,当每次输入文字的时候,就把输入的值截断,取前7个值。但是在input事件中,重新赋值的值发生了变化,但是页面上的还是没有变&…...
