本文由 简悦 SimpRead 转码， 原文地址 mp.weixin.qq.com
项目起因
事情是这样的，前不久看到一个国产的开源 canvas 2d 框架（leaferjs）做的非常棒，于是就跃跃欲试，打算用这个框架搞点什么，于是最终决定搞一个开源的在线的图片 & 海报编辑器，肝了一个月算是搞好了。
本人兼 UI 和前端工程师，所以嘛，UI 也是精心设计了一番！做了两套皮肤。好不好用先不说，就看界面还不错吧！
项目网址：image.h5ds.com
功能说明
因为时间比较紧，所以目前功能还比较少，但是可以满足大部分用户的基本需求了，打开网页直接就可以免费使用，偶尔处理点图片啥的很方便，赶快收藏起来。下面是工具的功能说明：
1. 注册登录
登录注册后可以上传图片，将项目保存到云端，目前支持手机登录和二维码登录。
2. 创建项目
目前是这样设计的，一个工程中可以包含多个页面，一个页面中包含多个图层，点击左上角的 icon 可以在项目、页面、图层之间进行切换。
3. 使用模版
项目中预置了上百个模版，都可以免费使用。点击模版就会自动在项目中创建一个新的页面，也可以快速切换回原来的页面。
4. 添加文字
项目预设的文字素材并不多，后续慢慢添加，用户也可以自己去调节文字参数得到自己想要的文字效果，项目中的字体均来源于网络上的一些免费可商用字体，所以字体可以放心使用。
文字支持样式设置比较丰富，基本上可以做出各种你想要的效果，文字也支持渐变色的设置
5. 添加图片
系统预设了大量的国外免费图片素材可以快速使用。
图片支持边框，圆角，阴影等参数设置
6. 快捷键
为了方便用户快速的制作图片，我参考 PS 的习惯，添加了很多快捷键，快捷键说明可以点击左下角的图标进行查看。
7. AI 功能
目前 AI 功能只加了一个 AI 抠图，想要扣什么内容就使用鼠标点击哪里，可以扣各种元素，因为是免费的，所以抠图的效果不是很好，如果有高要求的小伙伴可以尝试使用第三方的抠图服务。其他 AI 功能后续会慢慢加上。
技术说明
主要的技术栈：
Leaferjs 一款性能卓越的国产 canvas 框架，推荐尝鲜。React + Mobx +Typescript 常规组合，全部使用 Hooks，代码简洁易于维护。Semi-Design 抖音团队出的一款 UI 框架，交互体验很不错，推荐！
开源
项目采用 MIT 协议开源，界面漂亮，交互体验好，有需要的小伙伴可以自取。开源不易，希望能动动你发财的小手给个 star，这是对我们最大的鼓励。