How Prime Horizon Built an Automated Design QA Tool: Horizon Design

Project Type

SaaS Product

User Audience

Global

Industry

Design Technology

Team Size

Service Used

End to End Development

Engagement Length

January 2026 - Ongoing

About Horizon Design

Horizon Design (PPU) is a design QA platform developed by Prime Horizon. It compares live websites against their original Figma designs.

PPU is a tool that checks whether a developed website matches its intended design, pixel by pixel, so teams don’t have to check it by eye.

Project Overview

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Technologies Used

Python

TypeScript

FastAPI

React

TailwindCSS

PostgreSQL

SQLite

Docker

NGINX

Playwright

Redis

Figma API

JWT

Challenges Faced by Prime Horizon

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

1. Figma OAuth and Token Security

PPU needed direct access to Figma designs, which meant integrating Figma OAuth while keeping access tokens secure. The team also had to handle token storage and refresh cycles without exposing users’ design data.

2. Building an Accurate Comparison Engine

The core challenge was building an engine that could analyze color, typography, layout, and pixel-level differences. It needed to be both fast and precise.

3. Real-Time Progress and Responsiveness

Some comparisons take time to process. Instead of leaving users with a static loading screen, the team needed a way to show progress while the comparison was running without making the application feel unresponsive.

4. Cross-Platform Deployment

Design resilient cloud environments with clear deployment workflows, practical observability and security built into every layer. Our engineers help your systems grow with your business.

5. Database Migration for Scalability

Turn operational data into useful insight. We bring together dependable pipelines, clear reporting and accessible interfaces so teams can make informed decisions.

Solutions by Prime Horizon

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

1. FastAPI Backend and Comparison Engine

Prime Horizon developed the backend on FastAPI. It handles color, layout, and pixel comparison with precision. This let teams detect subtle design inconsistencies instantly. It saved hours of manual review and improved output quality across every project.

2. React Frontend with Real-Time Tracking

Prime Horizon built the frontend in React. It shows live progress, handles authentication, and offers a clean interface. Users can track comparisons as they happen. This reduced confusion and boosted team productivity.

3. Secure Access via OAuth and OTP

Turn operational data into useful insight. We bring together dependable pipelines, clear reporting and accessible interfaces so teams can make informed decisions.

4. Reporting and History Tracking

Prime Horizon added PDF and HTML exports, history tracking, and a multi-viewport responsive mode. This gave teams detailed documentation. It also made it easy to compare results across devices, improving decisions for designers and stakeholders.

Outcomes of the Project

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Adopted as a Standing Workflow Tool

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Faster Design QA Cycles

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Stronger Cross-Team Visibility

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Foundation for Growth

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Team Involvement

Resources	Count
QA Engineer	2
Software Engineer	1

Core Features of the Software

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Pixel-Level Visual Comparison

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Real-Time Progress Updates

Build confidence into every release through structured quality assurance, thoughtful code review and continuous improvement. Clear acceptance criteria keep delivery aligned with your requirements.

Figma OAuth Integration

Users can connect their Figma accounts through OAuth, allowing PPU to access the designs required for comparison while keeping authentication and token handling secure.

Multi-Viewport Comparison

PPU can run comparisons across multiple viewport sizes, helping teams verify that an implementation remains consistent across desktop, tablet, and mobile layouts.

PDF and HTML Reports

Comparison results can be exported as PDF or HTML reports for documentation, review, and sharing.

Comparison History and Job Management

Previous comparison jobs are stored so teams can revisit earlier results and track their comparison history without having to repeat completed jobs.

Development Timeline

Project Start Time

Jan 2026

Project End time

Ongoing

Collaborative software engineering, shaped around your priorities.

Ready to Build a Precision Tool of Your Own?

Prime Horizon builds tools that catch them before they reach production. From secure OAuth integrations to real-time comparison engines, Prime Horizon's team designs software that solves real workflow problems. If your team needs a custom platform to streamline QA, development, or any complex internal process, Prime Horizon can build it. Get in touch to start the conversation.

Tech Stack

Full