Skip to main content

Quick Start Guide

Welcome to QA Proof! This guide will help you get up and running with our design QA platform in just a few minutes.

What is QA Proof?

QA Proof is an AI-powered design QA tool that helps teams catch visual bugs and design inconsistencies before they reach production. By comparing your Figma designs with live web pages, QA Proof automatically detects layout shifts, color mismatches, spacing issues, and more.

Prerequisites

Before you start, make sure you have:

  • A QA Proof account (sign up at qaproof.io)
  • Access to your Figma design files
  • A website or web application to test

Step 1: Create Your First Project

After signing in to QA Proof:

  1. Click the "New Project" button in the dashboard
  2. Enter your project name (e.g., "Homepage Redesign")
  3. Add your website URL
  4. Click "Create Project"

Step 2: Connect Your Figma Design

To compare your designs with the live site:

  1. Navigate to your project settings
  2. Click "Connect Figma"
  3. Authorize QA Proof to access your Figma files
  4. Select the design file you want to use as a baseline

Learn more about Figma integration in our Figma Integration Guide.

Step 3: Run Your First Test

Now you're ready to run your first design QA test:

  1. Go to the "Tests" tab in your project
  2. Click "Create New Test"
  3. Select the pages or components you want to test
  4. Choose your test settings (viewport size, browser, etc.)
  5. Click "Run Test"

QA Proof will capture screenshots of your live pages and compare them with your Figma designs. Results typically appear within 1-2 minutes.

Step 4: Review Test Results

Once the test completes, you'll see:

  • Visual differences highlighted in red
  • Severity scores for each issue (critical, major, minor)
  • Side-by-side comparison of Figma vs. live page
  • Specific measurements showing spacing, color, and typography differences

What's Next?

Now that you've completed your first test, explore these features:

๐Ÿ’ก Pro Tip: Set up automated tests to run on every deployment using our CI/CD integration.

Need Help?

If you're stuck or have questions: