Create animations with Keronote ui

gregoryinnovo

Gregson Murcia Castro

Posted on July 20, 2023

Create animations with Keronote ui

What We built

A simple, but fun animated canvas, with several tools and others features in web.

Category Submission:

  • Best Overall Project
  • Most Technically Impressive
  • Most Visually Pleasing
  • Best Project built using Material UI

App Link

https://deft-pithivier-b4a203.netlify.app/login

Screenshots

Image description

Image description

Image description

Image description

Image description

Image description

Image description

Description

Dare to make the animations you imagine, choose the color you want, generate different canvases and frames to give life to your creativity. Finally, take a look at the creations of others and play to see how they turned out.

Link to Source Code

https://github.com/Media-Collab/keronoteui

Permissive License

MIT

Background (What made you decide to build this particular app? What inspired you?)

We love flipnote animations, but the main problem is you need a Nintendo DS for create those animations. So we tried to do a simple animation software having inspiration on those features from flipnote studio, but at the same time improving and adding more features like layer system and extended color palette.

How I built it (How did you utilize refine? Did you learn something new along the way? Pick up a new skill?)

We used refine for easily store animation information and we made a handmade canvas lib called "keronote", this project is also the frontend for that lib and use Refine hooks to finish the project in no time!

Additional Resources/Info

  • Cloudinary API Docs
  • Supabase Data Provider Docs
  • Material UI Docs
💖 💪 🙅 🚩
gregoryinnovo
Gregson Murcia Castro

Posted on July 20, 2023

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Create animations with Keronote ui
refinehackathon Create animations with Keronote ui

July 20, 2023