Canva for Miro

Inspiration

Miro is a digital whiteboard that makes it easy to collaborate with others. The software allows you to create notes and designs, move things around, and communicate through embedded video calls or online chats.

I am a big fan of Miro. While working remotely during the pandemic, Miro helped bridge the collaboration gap among my colleagues. While exploring the community posts, we found this article. Canva wasn't available due to the lack of API to integrate with. With the launch of Connect API in this hackathon, we are inspired to make the community dream come true.

What it does

We help to bridge the gap of importing Canva design and assets into the Miro platform. This greatly helps the user to be immersive while collaborating on their work (discussion or brainstorming) in Miro.

How we built it

We build using NextJS while strictly following the appropriate design guidelines of both platforms (Canva and Miro). This includes using the Miro WebSDK to build the app within their ecosystem while integrating it with the newly released Canva Connect API.

Challenges we ran into

Privacy is the biggest concern for any kind of integration app. The authentication logic for the Connect API was pretty hard to digest initially. Identifying the best approach to store the token is a bit tricky, ultimately, we are quite proud of our approach to handling it.

We wanted to expand the same implementations for the Assets type. However, we lack the API to list Assets. Thus, making it difficult to create the same experience we have for the Design. Nevertheless, the existing feature is already worth installing to make the best use of the Canva content in Miro.

Accomplishments that we're proud of

The app mostly working as we are expecting it to be. With a mix of smart encryption logic, we managed to identify a safe way to securely store the tokens without breaching the privacy concern we set out to. That is not storing any form of user token on our server.

What's next for Canva for Miro

We managed to get the working product out. It is currently in review on both platforms (Canva and Miro). Hopefully, is ready for public use before the deadline.

What's next would be to continue to improve the features of the app. Primarily to support various kinds of export formats that are available. Eg, audio and video. We might also want to revisit importing Assets once the connect API is supporting what is needed to complete the features.

Built With

• canva
• miro
• mirotone
• nextjs
• tailwind