我用三个月时间仿造了一个稿定设计2022年中总结

丰富的线上&线下活动,深入探索云世界

做任务,得社区积分和周边

最真实的开发者用云体验

让每位学生受益于普惠算力

让创作激发创新

资深技术专家手把手带教

遇见技术追梦人

技术交流,直击现场

海量开发者使用工具、手册,免费下载

极速、全面、稳定、安全的开源镜像

开发手册、白皮书、案例集等实战精华

为开发者定制的Chrome浏览器插件

这时候可能有细心的小伙伴发现了,不是重构项目吗?怎么看起来像是重写了?好吧,我自始至终都没见过旧版“在线PS”的源码,后来我才了解到,旧项目原本是老板五年前扒的别人生产环境代码来上线的,这可真是五线谱上瞧不见马——就你马离谱了呀。

开发中遇到的问题已经数不清有多少了,但最大的问题还是莫过于图片的生成方案,想想在客户端一顿操作,以为自己画了只虎,结果下载一看却是只猫,那不是白搞了?

为了弥补设计部产能不足的问题,领导示意我从网上采集些模板和素材过来,让设计可以在里面挑选/调整之后快速扩充模板数量:

采集的资源会默认为“未激活”状态,由设计部门去修改和判断停启用。一开始边测试边录入数据,每天入库几十个模板,老板嫌速度太慢,我干脆就化身无情的模板搬运工,用公司电脑不舍昼夜地挂机了两天,最终入库将近3万个模板,把设计部几年的工作量都给安排了(这里偷偷说下,其实我也采集了稿定的,但是不敢给公司用,只敢把小厂的偷来稿定的只给自己消遣和研究,分析数据的时候也能学到不少东西)

PS:目前公司后台的未审核模板数还剩下2万个:

但设计部最近又经历了一波人员变动,如今产能是更加不足了。。

关于Node服务的部署,也是困难重重,首先是运维方面非常不认同NodeJs,说漏洞非常多,听到我要使用node+chrome的方案时更是强烈滴反对,说linux浏览器以前就用过,十分不稳定,还会搞崩服务器等等。但我寻思着自己1核1G小主机都不会崩,公司的服务器怕什么呢?于是还是坚持了自己的方案(前面说了纯Web绘制咱也真做不出来啊)。

运维这边则给了一个内网端口,由后端php再写一个接口调用,并且加了个url回调,当我截图任务完毕时再调用它,通知php去拿到图片。这样可以在url加串md5解决一个鉴权问题,关键外网也不能直接访问到Node服务(运维放下了手中的刀)。而前端下载则只能不停轮询php的接口,轮询到有结果时才拿到下载地址,比较的呆。

由于我们的项目并不针对C端用户,所以比起覆盖各行业场景的模板需求,垂直领域海报的模板下沉更有意义,这当然离不开设计部的添砖加瓦,此时将平面设计师做好的psd上传到后台解析成可交互模板就很有必要。这块涉及到很多东西,包括各种字体特效、文本多行拆分样式、图片蒙层解析、分组多页面等功能——我都是没有实现的,只做到了基本够用的程度,所以也写了一些PSD设计规范给设计部,以免设计师辛苦做了图传上来却显示了个寂寞。

这块和稿定设计比起来就是班门弄斧了,稿定没有任何规范,因为99%的psd文件它都能近乎完美的解析,文件是上传到服务端解析的,不知道具体怎么实现,反正可以支持解析很大的文件,而我是在前端浏览器解析完再上传的,遇到超过200M的psd文件基本上页面就卡死在那摆烂了。

由于自己是整个项目的owner,UI和产品介入后我开始有两套代码,一套是给公司开发的,另一套是自己的实验田,有些功能自己做了觉得可以,就git检出比较代码手动迁移到公司项目里,比如当产品告诉我他想加一个二维码功能的时候,我已经开发完一版了,直接截图给他,于是产品原型也不画直接用截图给我提了个需求单。

尝试了不少有趣的功能,但其实折腾多了,有点“面向谷歌浏览器开发”的感觉,因为浏览器之间的差异很难抹平,做到完美兼容对我来说几乎不可能,所以有很多都没上线,怕出什么bug,又有些实验性质的东西,就只是自己玩。

也简单做了一下后台的模板与素材管理:

项目到这里介绍的也就差不多了,总之就是一个不停摸索又不停折腾的过程。其实互联网行业里大部分的产品我感觉都挺饱和的了,很难讲什么真正的创新,都是缝合一下就出来个产品,再按实际需求去做功能点。而像遇到这种非常规类型的项目,技术主导就显得尤为重要,一般的产品专员很难发挥效果,技术能力既决定了产品的上限,同时也是一道难以逾越的壁垒。我在做这个项目经常想的一类问题就是:稿定这个功能到底是怎么做到的?当然偶尔也会想摆烂,那会和同事开玩笑说我是一个人的下水道对标百人前端的天花板,但是每当做出来新功能时,多少还是有些小兴奋,人在巨大落差感面前,也总会不断激起前进的欲望吧。

一开始搭建过Vue2组件库、Vue3组件库,由于公司的前端项目基本都是使用Vue2技术栈的,所以我在4人前端小组里推过我做的这个组件库,当时我考虑的重点是怎么用起来舒服,所以编写了自动化脚本代替一些操作,而且我认为公共组件库就是给大家用的,使用文档很重要,所以组件文档也是要做到能根据代码和注释自动生成,降低开发成本。

我的组件库是基于monorepo模式并由lerna进行管理的,组件deploy会直接发到官网上面去,所以当然也有准备要部署私有npm的(是的我们公司项目都是淘宝镜像梭哈),但是碍于要去和运维申请服务器资源,可能还需要处理权限账号之类的对接,而且很奇葩的是我Gitlab连创建仓库的权限都没有,觉得限制太多懒得去搞了。

公司项目太多,分支管理也有点混乱,经常需要来回横跳切换,发布有的是CI/CD,有的是本地编译后提交dist目录,觉得麻烦,写了个自动化脚本,通过交互式配置任务来自动处理提交发布,还有判断任务执行风险、代码冲突检测机制、任务热重启、自动跳转到pr合并等功能,个人觉得挺酷,但是我们公司操作Git都是“小乌龟”起手(php应该很熟悉),不像我喜欢用命令行。

由于当时也在学习怎么写vue的cli插件,就把这个工具写成了cliPlugin,不知道是不是这个原因,发布到npm后竟然有不少的自然下载量,直到目前已经有20k+download数据,不知道别人用着怎么样,反正我基本没在公司项目里使用(因为提交规范原理是拦截githooks,但是我们多数前端代码是没有独立仓库的,都放在了php仓库的目录下。。

职业道路要早做准备、多做打算,能力增长有快有慢,可能目标感才更能决定成败。技术不必急于求成,都是可以慢慢学的,但环境可能不会变好,或许努力去到更好的环境,才更能加速你的成长。

要做的事情还有太多。就先说到这里吧,保持思考,保持学习,平常心。

THE END
1.在线搞定设计海报设计制作在线设计协作平台0基础轻松搞定设计,稿定设计提供丰富的海报、图片、PPT、H5设计模板,一站式全场景正版商用素材供应,满足个人及团队的设计制作需求。https://www.gaoding.com/introduction
2.创客贴平面设计作图神器免费设计模板创客贴,极简好用的平面设计作图软件,在线图片编辑器,免费使用.提供免费设计模板,有海报、名片、公众号图片、PPT、邀请函等65个场景模板,一键搞定设计印刷https://www.chuangkit.com/
3.快设计海报制作神器创意工具在线稿定平面设计通过简单拖拉拽就可以快速产出设计,满足线上线下各类品牌推广和宣传活动。海报、邀请函、宣传页、贺卡、微信头图、视频封面等海量模板素材可商用。一键抠图无损细节,PSD导入自定义模板库。https://sheji.tuchong.com/
4.稿定设计在线ps,稿定设计怎么制作图片在日常生活中,稿定设计是一种常见的APP,但很多小伙伴并不知道素描设计如何制作图片视频融合,电脑版的设计可以帮助用户快速绘制图形,拥有极简的在线编辑器和各种各样的丰富模板,很多用户在刚开始上手时,都不知道如何添加要编辑的图片。接下来就由小编为您介绍稿定设计在线ps,稿定设计怎么制作图片。 https://m.36dianping.com/news/7388.html
5.稿定设计做图做视频必备在线设计神器在线编辑视频,人人都能拍大片 稿定设计智能PPT 设计大师每周更新模板 辅助工具随取随用 稿定设计网页制作 个性化网页制作 傻瓜式网页制作、发布,永久保存 稿定设计隐私政策 稿定设计非常重视用户的隐私和个人信息保护。请您仔细阅读本隐私政策并确定了解稿定(厦门)科技有限公司(以下称“我们”、“平台”或“稿定设计”)https://www.xiaolizhijia.com/3725.html
6.稿定设计做图做视频必备在线设计神器稿定设计是一款在线设计做图工具。这个工具让您可以轻松地编辑图片和视频,而不需要掌握Photoshop技能。通过使用海量模板,您可以快速创建各种类型的视觉作品,包括海报、简历、PPT、公众号配图和电商等。https://pidoutv.com/sites/340.html
7.海报模板在线制作免费海报模板制作那我们随意选择一个,然后点击进去就可以直接开始设计或替换了。 真的是随随便便挑一个,颜值就爆表,再来看一下素材部分。 图片、文字、音乐和视频各种元素都可以在Canva搞定。 02.稿定设计 稿定设计是一款多场景商业视觉在线设计平台,根据不同场景不同尺寸,创建模板素材。 https://www.wandongli.com/index.php/news_detail.html?id=23279
8.新媒体运营必备54个工具网站,按工作流程整理好了3.创客贴——平面设计作图神器 创客贴是一个在线平面设计的制作神器,场景全、模板多、无限次下载,在模板的基础上修改要素调整制作,分分钟出图,再也不用哭着求美工小姐姐救救你啦。 网站:https://www.chuangkit.com/ 4.稿定设计——做图做视频必备工具 https://www.digitaling.com/articles/362648.html
9.MAKA在线设计平台全球3000万中小企业用户使用的在线平面设计工具,MAKA免费提供海量精美平面设计素材,快速在线PS,随时随地编辑设计模板,一键搞定设计,支持下载高清素材图片。https://www.maka.im/
10.仿稿定设计,在线图片设计源码丨在线海报设计系统素材设计源码资源浏览查阅144次。php源码适用于多种场景:海报图片生成、电商分享图、文章长图、视频/公众号封面等,无需下载软件即可在线海报设计源码更多下载资源、学习资料请访问CSDN文库频道.https://download.csdn.net/download/weixin_36643308/88298375
11.稿定设计官网,提供大量免费设计素材和免费设计和视频模板在线ai在线设计网站 ai设计工具 稿定设计在线ps 稿定设计官网 3+2-1+10 链接直达 ?>1.免费ai视频生成+写作(可联网)?>2.超强免费ai视频神器3.免费ai写作绘画 简介 一个简单有趣的图片视频设计平台,提供大量免费设计素材和免费设计和视频模板、在线抠图和电商海报设计模板等,一键搞定设计需求。在线快速图片和视频https://feizhuke.com/sites/gaodingsheji.html
12.稿定设计官网,稿定设计海量设计模板加持不会PS也能轻松搞定设计稿定设计海量设计模板加持不会PS也能轻松搞定设计,在线设计海报、简历、PPT、名片、宣传单、邀请函、Logo等多种设计需求场景,3秒抠图、批量套版、AI辅助设计实用便捷。海量正版授权资源,商用无忧。https://www.e4w.cn/sites/6743.html
13.稿定设计在线免费图片编辑器专业好用稿定设计-在线免费图片编辑器,操作简单,一用即会,0基础也能轻松进行图片编辑器,苏打办公完美贴合你的需求,立即体验!http://bangong.360.cn/site/details?id=38
14.在线设计软件这么多,到底有何不同?——来份竞品分析细品一下稿定设计面向人群较广,30+种模板类型,从表情包到中小企业行政信息发布等涉及需求都有涉及,基本满足0设计基础的各类用户群体制图、应急所需。 (2)模板库使用路径 对比fotor懒设计与稿定设计的使用路径后可以看到,框架结构较复杂的稿定设计在海报制作部分,因为对模板进行了多次分类而使得海报制作的步骤增加。 https://www.jianshu.com/p/caff4e038677
15.懒人excel(懒人excelapp)要批量转换也可以!点击“Add Files”一次添加多个文件,选择目标格式就可以在线批量转换,真滴hin方便~ 5、稿定设计——零基础在线设计神器 稿叔使用下来感觉最棒的在线设计网站,没有之一,只要回答神器网站,就一定少不了它的身影! 原因就在于它有超多精美的模板可以一键套用,解决了稿叔在工作和生活当中的作图难题,日https://www.jiandaoyun.com/article/post/13393.html
16.稿定设计官方下载2024电脑最新版稿定设计官方免费下载稿定设计官方版是一款专业出众使用便捷的在线设计制作工具。稿定设计官方版可根据用户自身需求自行设计属于自己的图片、封面、小视频、动画,设计过程中可以利用相关的素材模板进行使用并可以帮助用户一键制作创意海报、制作热门特效视频、快速编辑图片。稿定设计最新版为用https://mip.onlinedown.net/soft/1229545.htm
17.稿定设计稿定设计素材设计免费试用评价“稿定设计”是稿定(厦门)科技有限公司推出的一款在线设计工具,属于平面设计类别。其主要用途是为用户提供高质量的图片、海报、名片、PPT等设计素材和模板,以及各种设计效果和滤镜,帮助用户快速制作出精美的设计作品。 该产品提供了丰富的设计元素和模板库,涵盖了各种https://www.jingxuanxing.com/space/396/
18.稿定在线PS——网页版的PS软件上手难度低,使用方法简单,即使没有学习过ps等设计软件也能轻松上手。 适用人群: 设计师:稿定在线PS提供了海量的设计素材和模板,可以帮助设计师快速完成设计任务。 自媒体从业者:稿定在线PS提供了多种自媒体工具,可以帮助自媒体从业者快速制作高质量的内容。 其他需要处理图片的人群:如摄影师、插画师等。适用场景: 图片https://www.360doc.cn/article/77964170_1091148778.html
19.稿定设计在线设计工具稿定设计下载v1.3.7PC版官方稿定设计安装教程 稿定设计电脑版是一款设计软件,稿定设计软件提供了众多的设计模板以及丰富的编辑功能,即使非专业人士也可以设计出好看的作品,能够满足用户日常工作所需。 功能介绍 【链接转换工具】 1、淘宝PC转手机链接工具 快速生成淘宝/天猫无线端链接。 https://www.wmzhe.com/soft-70927.html
20.稿定设计做图做视频必备在线设计神器稿定设计-做图做视频必备_在线设计神器_海量版权素材模板图片是炸鸡88的弹屏画板中的相关图片之一的详情图,弹屏画板共有467张设计师收藏采集的相关图片素材资源。花瓣网, 设计师寻找灵感的天堂!https://m.huaban.com/pins/5640532094/?back=/discovery/
21.稿定设计做图做视频必备在线设计神器- 备案信息 公司下所有小程序数:- 小程序排名词总量:- 百度PC排名趋势 7天 30天 3个月 数据详情 更多历史 网站下子域名 共有0个 数据详情 复制数据下载,尽在高级特权立即升级 同行网站与学习对象 共有0个 数据详情 网站外链详情 共有0个 数据详情 https://seo.5118.com/www.gaoding.com?t=ydm
22.稿定设计做图做视频必备在线设计神器在线快速图片和视频编辑,不会PS也能搞定设计。海报、简历、PPT、公众号配图、电商等海量模板快速出图。三秒抠图实用便捷,抖音快手热门视频轻松搞定。海量正版授权资源,商用无忧。 https://www.baobaocun.com/thread-64002-3-1.html
23.稿定设计www.gaoding.com简单免费的设计工具,提供丰富精美的设计图片素材,无需PS技术,小白也能轻松搞定海报、邀请函、贺卡、banner、表情包等设计模板制作。https://www.023dir.com/website/16988.html