前端真有意思,又干了一年图片编辑器

大家好,我是一名前端工程师,也是开源图片编辑器vue-fabric-editor项目的作者,我是一名干了十几年的前端程序员,真的越干越觉得前端开发有意思

图片编辑器截图:

从2025年孤军奋战到拉起几个人的小团队,现在已经2026年了,不知不觉一年就过去了,前端的创业小团队都能做出哪些有意思的项目,大家一起看看我们做的项目,也算是我们团队的年终总结了。

项目列表:

  1. POD样机
  2. 丝巾设计平台
  3. 吧唧设计/亚克力设计
  4. 盒型/刀版设计
  5. 印花设计
  6. 工艺仿真

POD样机

这是一个快速生成电商图片的场景,让用户上传一张图片,快速生成多个不同场景的图片,比如冰袖产品,只需要穿一张印花图片,就可以生成多个不同场景和不同穿戴角度的电商图片,可以用来快速上架到电商平台。

不仅仅是冰袖,还是支持更复杂的服装设计,同时生成工厂打印使用的刀版图,一次生成不同尺码。

当然,也支持3D的预览,不同面进行设计后进行3D渲染。

丝巾设计平台

这个平台是帮甲方开发的项目,主要的功能是实现各种印刷图案特效,让用户快速的实现丝巾设计,并且实现丝巾试戴效果。

丝巾试戴效果

当然,也有一些常见的AI设计功能,和图片处理相关的功能。

吧唧/亚克力设计

这个项目我们从头开发了一套定制商城小程序,可以让用户在小程序中快速定制吧唧/亚克力钥匙扣产品,后端是Node.js + MySql的技术栈 ,微信支付等各种功能,Node.js还是经得起考验的

这个项目对我们来说有几个重点

  1. 小程序商城,支持SKU、阶梯价、物流、折扣、限购、支付等功能。
  2. 样机预览,白墨、烫金各种印刷工艺。
  3. 打印文件,要有打印机识别的专色通道和拼版功能。
  4. 自动刀线,自动根据图片生成刀线文件。

印花设计

这个项目主要是让用户根据一张图片快速的生成瓷砖、面料相关的印花,快速实现印花效果,然后渲染到3D模型中,进行预览,确认效果后可以下载连续四方图用于印刷。

盒型/刀版设计

这个项目主要的功能是让客户根据现有的盒型,快速的修改长宽高后,生成新的刀版图和3D模型,用于快速的预览,需要实现平面刀版图和3D模型的参数化,来试实现参数调整后实时渲染的功能。

工艺仿真

这一部分其实是调研的内容,主要是用3D来实现工艺仿真的效果,比如凹凸压痕、不同烫金材质,难度不大,不过涉及的细节比较多。

回顾

这一年我们去杭州3次,在义乌待了2个月,回忆起来还历历在目为,有艰辛、有收获、有成长,最感激的是找到了志同道合的兄弟

  1. 新招实习生不出差,自己到客户现场开发。
  2. 钱塘江畔驻场开发,与韩国客户用翻译软件面聊。
  3. 连续3天联系中介解决团队住宿问题。
  4. 解决白墨专色,夜里在义乌杨村满大街找打印机。
  5. 解决色差问题对比到眼睛看花,国庆加班赶进度。
  6. 找到志同道合的兄弟,多个项目一起跑下来。

日夜兼程

驻场开发

驻扎工厂

采购电脑和午休床

随着同事的加入,我们内部流程也更加规范,需求文档、技术方案、测试用例等等,自卖自夸一下 哈哈,团队虽小,小巧精悍,我们完全聚焦在编辑器、定制设计器领域,很多工厂项目让我们积累了宝贵的业务经验。

总结

现在AI时代,大家都在唱衰前端,我们最近一年发现真的扎到场景和业务中,前端开发的机会还是挺大的很多复杂的繁重的专业软件正在被慢慢解构,变成轻量的、简洁的在线软件,希望明年我们能啃下来更多有难度的项目,结合制造业,服务好更多客户,也祝福大家越来越好,找到自己热爱的事业。

大家感兴趣的可以点个赞和关注,持续向大家汇报进展。

相关推荐
Devlive 开源社区1 天前
技术日报|React视频工具Remotion三连冠日增1374星破3万,Apple Silicon语音库mlx-audio爆火登榜第二
前端·react.js·前端框架
m0_748229991 天前
Vue3高效学习路线全攻略
前端·javascript·vue.js
谢尔登1 天前
React架构演变
前端·react.js·架构
木辰風1 天前
vue在IE浏览器下父页面向子页面传输对象时数据丢失
前端·javascript·html
小雨青年1 天前
Cursor 项目实战:AI播客策划助手(四)—— 产品发布与交付收尾
前端·人工智能
@呵呵1 天前
上传图片裁剪
开发语言·javascript·vue.js
晚霞的不甘1 天前
Flutter for OpenHarmony《淘淘购物》主页点击跳转功能详解:从 UI 响应到页面导航的完整实现
前端·flutter·ui·搜索引擎·前端框架·交互
cooldream20091 天前
前端技术架构详解:Vue 3 + TypeScript + Vite 在具身 AI 系统中的实践
前端·架构·typescript
迟_1 天前
CSS-实现图片靠右
前端·css
weixin_395448911 天前
下位机&yolov11输出
java·服务器·前端