project screenshot 1
project screenshot 2
project screenshot 3
project screenshot 4
project screenshot 5

Magic Frames

A Frame wizard for building your own Frames. Allowing you to build frames to engage your community with on-chain transactions without ever coding or even leaving Warpcast.

Magic Frames

Created At

Frameworks

Winner of

trophy

ETHGlobal - 🏆 Frameworks Finalist

Project Description

Magic Frames is a no-code tool for building Frames from a frame wizard. Focusing on frames that can perform on-chain transactions.

Everything is done inside Frames, so a user only needs to access the Magic Frames home frame and follow the Wizard!

In the Wizard, the user will choose a Spell template and be guided through the steps for creating their own spell. I.e., for the demo, we are creating a Spell for DAOs to create a frame to promote a new proposal to their community to vote straight from the frame itself.

Finally, users can Cast, no pun intended ;), the spell, which in this case would be voting for the proposal.

Everything is done on frames, you don't have to leave Warpcast for creating interactive frames that can be used by your community.

How it's Made

The entire project user interface is a frame, and we used frames.js to build it, speeding up our development time by 10x, at least.

The project consists of 3 parts

1 - A no-code Wizard that is actually a frame. Built with nextjs using frames.js it provides a homepage in Frames for Magic Frames. Users use this wizard to build their own Frames by choosing a Spell template and following the steps.

2 - A storage smart contract in base to store all user's Spells. Where we store the data needed for each spell and provide a spell ID. Later this ID is used by users to access the frame they created and share it with their community.

3 - A dynamic frame that gets the SpellID from a query parm in order to fetch the spell details from the storage smart contract we built and then dynamically build the Frame created by the user, using the correct template.

background image mobile

Join the mailing list

Get the latest news and updates