PC Build Web App
A guided PC-building experience designed to make component compatibility understandable.
Interactive project walkthrough
Interactive Preview
Compatibility Builder Preview
Sample estimates only — a small, local simulation of the build planner's compatibility logic. Prices and wattages are illustrative, not live data.
Choose components above to see compatibility feedback and a budget estimate.
Project Overview
PC Build Web App helps first-time builders choose parts with confidence by pairing a visual, category-based selection interface with real-time compatibility checks and a running budget estimate.
My Role
Designed and developed the application's interface, guided selection flow, and compatibility-focused user experience.
The Problem
New PC builders often struggle to understand sockets, memory standards, power requirements, budgets, and whether components work together.
The Solution
A visual, constraint-driven builder that guides component selection and evaluates compatibility as the build develops.
Key Features
Visual Component Selection
Browse categorized parts (CPU, motherboard, GPU, memory, PSU) through a clear visual layout instead of raw spec sheets.
Compatibility Validation
Automatically checks socket, memory type, and power draw so incompatible combinations are easy to catch early.
Budget Estimation
A running subtotal helps first-time builders stay within a target budget as they choose parts.
Guided Workflow
A step-by-step flow designed for people who have never built a PC before.
Technical Architecture
Engineering Highlights
- Implemented complex compatibility logic to ensure all selected parts work together.
- created a visual builder interface for intuitive part selection.
- Optimized performance for handling large datasets of PC components.
Challenges and Lessons
Challenges
- Modeling compatibility rules (socket, memory type, and power draw) in a way that stayed accurate as more components were added.
- Keeping the interface responsive while validating several interdependent selections at once.
Lessons Learned
- Constraint-based UI works best when validation feedback is immediate and specific rather than a single pass/fail message.
- Small visual cues, like grouping parts by category, meaningfully reduce decision fatigue for less experienced users.