LogoLogo
Quest HomeSign Up
  • 😀Welcome to Quest
  • Getting Started
    • Quest Overview
    • Helpful Resources
    • Quick Start - Build your first component from Figma
    • Quick Start - Build your first component from a Wireframe
    • AI Prompt
  • Fundamentals
    • Customizing & Using the UI Kit
    • Designing Custom Components in Figma
    • Easily Sync Designs without Losing Work
    • Setting Up Props & Bindings
    • Exporting Code
    • Push to your Repository
    • Creating Responsive Components
    • Nesting Components
    • Workspaces & Apps
    • Code & Preview Mode
    • Prototypes/Wireframes
    • Animations - build with React Spring
    • Quest plugin for Figma Dev Mode
    • Publish on Quest to a URL
  • Features
    • Working with Variants & States
    • Naming Conventions
    • Previewing with Custom Fonts
    • Light & Dark Mode
    • Creating a custom Tooltip
    • Creating a Floating Popover
    • Creating a Dialog pop-up
    • Radio Group
    • Using the MUI Data Grid & Table
    • Data & List Bindings
    • Dynamic Bindings
    • Grid
    • File Upload
    • Design System Tab and Theme Import
    • How-to use a Theme in your Application
    • Accessibility Support
    • Design Tips and Tricks
    • Video
    • Lazy Loading
    • Sticky Position
    • Link
    • Custom Breakpoints
    • Min / Max Width
    • Supported Quest UI Kit Components & How-to Make Edits in Figma
    • Supported Chakra Components & How-to Make Edits in Figma
  • Advanced Tutorials
    • Setting up Bindings and Features on the MUI Button
    • Display Repeating Components based on a Dynamic List
    • How-to Pass Values from Parent to Nested Components
    • How-to Invoke a modal Dialog Box from a Button Click
    • How to Setup a popover
  • 🔍Help
    • Product Updates
    • FAQs
    • Plugin Warnings / Alerts
  • 💡Support
    • Why does my design look different in Quest than Figma?
    • Can I keep making changes in Figma without affecting code?
    • What are some best practices?
    • Does Quest support more than Figma and React?
    • How do I manage users?
    • What is the refund process?
    • How do I get in touch with Quest?
    • Do I have to use MUI if I'm using Quest?
Powered by GitBook
On this page

Was this helpful?

  1. Support

What are some best practices?

PreviousCan I keep making changes in Figma without affecting code?NextDoes Quest support more than Figma and React?

Last updated 3 years ago

Was this helpful?

What are some best practices recommended by Quest for seamlessly managing Figma and Quest integration?

Designers and Frontend engineers can save a lot of time by reviewing and adhering to our recommendations in the below chapters of the Quest docs:

  1. Auto-layout frames. This is an absolute must read: .

  2. Naming conventions. Standardizing how you name your frames, components will help keep your designs readible. When the code is auto-generated, it'll be immensely helpful to have proper Frame names for better code readability. Please follow the recommendations in section .

  3. Finally, leverage MUI and design kits. This will not only make your designs go faster, it'll also help generate quality code because we have optimized Quest for MUI and Figma design kits. Review chapter from Quest docs

The above are not exhaustive but we hope they will set you up for a great start. Please review the entire Quest docs and we hope you'll find useful information to standardize your development.

💡
Design Tips and Tricks
Naming Conventions
Customizing & Using the Design Kit