Advanced Feature: Create Full Flows
Anima Playground's Create Full Flows feature allows you to build multi-screen applications seamlessly. This feature is perfect for adding new pages and connecting them with existing designs, enabling a true web application experience.
How It Works
- Start with a Base Frame: Begin with an existing Figma frame, such as your homepage.
- Add a New Frame: Click the Figma icon in the chat area to initiate the process.
- Paste the New Frame Link: Provide the link to the new Figma frame you want to add (e.g., "Contact Us" page).
- Define Navigation: In the chat prompt, specify how you’d like the new frame to integrate with your current design.
Example: "Add a navigation button linking to this page." - Automatic Generation: Anima will generate the necessary code, create the new page, and establish the appropriate links between screens.
- Review & Iterate: Use the code and preview panels to make any adjustments, and refine the flow as needed.
Practical Example
Imagine you've created a homepage design in Figma. Now, you want to add a "Contact Us" page:
- Click the Figma icon in the chat (or paste a new link to the chat)
- Paste the link to your "Contact Us" Figma frame.
- Type a prompt: "Add a 'Contact Us' button in the navbar that links to this page."
- Anima Playground will automatically:
- Generate the new "Contact Us" page.
- Add the navigation button to the homepage.
- Ensure proper routing between the two pages.
Updated 4 months ago