Show HN: Open Source Canva Clone | Hacker News Reader

Show HN: Open Source Canva Clone

github.com

232 pointschloe-bm43 comments

I am creating an open-source canva clone. Demo here: https://react-editor-core.vercel.app/

Reposting my comment here for better visibility. To put it gently, this is a fork of other people's work without proper attribution. This should not be allowed on show HN.

https://github.com/bharathreddyza/react-design-editor https://github.com/bazooka720/scenify-editor

This is cool. What do you plan to do with it? Do you plan to commercialize it, show for a college project, augment your resume?

Best of luck and good wishes.

I like it and would tinker with it personally for fun and perhaps profit. However, I will stick to Canva for my team for various reasons.

This is fun! Is there any way to animate things in a video, aside from importing another video?

Feature being implemented

You legend! I look forward simply to tracking your progress, this is so good already

unsolicited request from a heavy canva user: dont stay too general - try to hyperoptimize for one usecase and win that instead of trying to compete on all fronts.

I use Canva a TON for youtube thumbnails. flood your templates section with that and I will switch to you.

Is this demo meant to be working? I can't upload a video.

Just FYI, your templates say "doble" click to edit

I'm getting: 404: NOT_FOUND

Awesome!

Canva has many subtle behaviors, such as how it clips and pan photos, snapping and alignment. If you want to build something comparable I would recommend ditch fabricjs and roll your own. Just need to brush up on matrix transform and vector math.

If only I had more than one down vote to give. I find that remark to be callous, ignorant, and downright mean, and I’m not even the product’s creator.

Lol sorry it came across that way. Not trying to be dismissive - simplify speaking from experience after working on several similar products in the past decade. The drag and drop editing experience is core to everything and you can't out source that.

Thanks for the clarification. Gracefully handled.

That's a lot of anger for some fairly reasonable advice.

Can’t argue with you

With all due respect, I think the title of this post should be amended as this is not Open Source.

After perusing the Github repo, it looks like the actual editor logic is not open source (in fact it lives in a private repo which you control), and the linked repo is just a wrapper around it.

I think you can see some components here: https://github.com/layerhub-io/layerhub-io/tree/main/package...

I see that you since made this public (it was not at the time of my comment, as confirmed by the repo commits being <2 hours old). When you say "some components", what components are missing?

I'm not saying you have to make the entire project open source, but if you are claiming it is an open source project it comes with the territory.

All you need to create/customize your graphic/presentation editor should be there. There are some other private packages that are optional: Exporting content in server side: PNG, pdf, etc.

Please state clearly in the readme what is open-source and and what is not. Also calling it open-core might be more appropriate.

Great start!! Thanks for sharing! I couldnt get animate to work, but looking forward to use this as this matures.

We may get animations soon

I love using Canva, but a large part of the value is the assets (images, fonts, templates etc) so I am not sure how I’d benefit from cloning just the software.

New features are being implemented: Import templates from PSD, AI, Figma, SVG.

Also, people can customize it at their own needs.

dalle might make the images less important. It's not there yet, but the demos are pretty amazing.

That is impressive and exciting. Thank you. I look forward to giving it a more serious spin when I am finished with my current project.

Doesn't this violate Show HN policy where in it has to be an individual's project and not an org?

It does unfortunately. Here is the excerpt,"The project must be something you've worked on personally and which you're around to discuss."

Was this made by yourself? This is an impressive amount of work.

I'm curious how did you make the editable text? It looks like it is inside the canvas rather than with regular DOM nodes like Canva. The W3C recommends against [1] doing this due to all the issues (selection, undo/redo, keyboard nav, special glyphs, RTL languages, etc) that come with text editing... but it appears to work really well. Or did you find some library to do that?

[1]: https://www.w3.org/wiki/No_edit_change_proposal_for_canvas_t...

Looks like this project was derivative work from this repo: https://github.com/bharathreddyza/react-design-editor

Which was then forked to scenify editor: https://github.com/bazooka720/scenify-editor

I would be very careful if anyone is thinking about contributing. It doesn't look like the original copyright was properly attributed or respected.

Impressive work. Will be checking the progress.

Also, I see that you've hosted the project on Vercel, can it handle the heavy traffic from HN?

is there way to automate poster building? i mean i was looking for something like this?

a simple example would be how office diaries are made. the frontpage is same but the name is changed for each customer.

maybe your software can do this programatically mail-merge style? like we give a template, we give client list and boom, indiviual poster for each client?

(disclaimer, I'm the founder)

Bannerbear.com can help you there - we generate PNGs / PDFs based on data you send us either via API or Zapier. Would be very simple to set up what you're describing :)

Some tutorials to browse: https://www.bannerbear.com/resources/nocode/tutorials/

Yes, we have dynamic content support. You can introduce variables inside designs for: Text, Images, Video, etc. You can join our server and ask us anything.

awesome

I've not heard much about Canva. How is it different than Adobe Express?

Disclaimer: I work for Canva, my opinions are my own.

Among other things, Canva supports collaborative whiteboarding:

https://www.canva.com/newsroom/news/introducing-canva-whiteb...

and landing pages:

https://www.canva.com/designschool/tutorials/canva-websites/

So one way I like to think of Adobe Express is that it’s a subset of Canva’s offering, but the media editing features are slightly more refined. The corollary here is that Express’ moat is Adobe’s stock image library. It will have trouble beating Canva as a visual communication platform over time.

Also, Canva is more value aligned with me; I’m biased of course. But it’s worth raising in case you’re interested: the company is committed to promoting and pursuing sustainability where it can:

https://www.canva.com/sustainability/

and about 30% of the equity is committed to philanthropic work:

https://www.afr.com/wealth/people/canva-s-billion-dollar-giv...

Hi, I’m Jordan from the Adobe Express team. There are a few competing products and apps in this space, each with their own strengths.

My personal favorite features in Adobe Express are the ways it’s powered by Adobe: access to hundreds of thousands of Adobe Stock photos, over 20,000 Adobe Fonts, and gorgeous templates crafted by Adobe designers.

I also really love the new scheduling tools that help me do all of my social media creating and scheduling in one place!

It should be very similar, not sure if adobe express supports video and presentations.

This is so cool. The view is also almost like Canva. Impressive so far.

Nice

Reply on news.ycombinator.com