3D flashcard prototype in Figma

Figma is free to use. Sign up here: Today we’re making a 3D flashcard prototype in Figma. Start by making each side of a flash card. We need two frames: one for the front, and one for the back. Flip the back frame horizontally. This gives us the flipping animation in the prototype. Now, click into the text layer and flip the text back so we can read it. Duplicate the star icon and change its color. Now, let’s make the flipped version of the card. Duplicate and re-order the frames. Rename them since their positions have now switched. Align each card vertically. Make sure the “front” layer is on top of the “back” layer. Create two components and rename them to “unflipped” and “flipped”. Select both and combine as variants. Now switch to prototype mode and connect them with smart animate. Place an instance in a frame, and click present. Now you can flip flap all day!! ____________________________________________________