01 — THE CHALLENGE
A useful model starts with the right question.
UX reviews are valuable but difficult to scale and compare. The project explored which experiential dimensions could be operationalized without flattening the complexity of design.
05 — UX Prediction · Deep Learning
DeepUX
Turn design principles into measurable signals.
Try the live demo↗PROJECT OVERVIEW
A computer-vision system that evaluates UX dimensions directly from website screenshots, bridging qualitative design expertise and quantitative prediction.
Project anatomy
From two interfaces to a measurable UX comparison.
DeepUX applies separate visual models to one or two screenshots, normalizes their predictions and displays the difference on the selected UX dimension.
Core pipeline
Select a step to understand how the data is transformed.Selected step
The user uploads design A, design B or both, then selects aesthetics, usability or trustworthiness.
Implemented features
Visible capabilities are connected to the technical components that make them possible.A/B comparison
Two screenshots can be evaluated simultaneously on the same dimension.
Three UX dimensions
Aesthetics, usability and trustworthiness each use a dedicated model.
Visual-only assessment
The result comes from the screenshot, enabling analysis before instrumentation or live traffic.
Harmonized score
Model outputs are converted to a readable 0–10 scale.
Variant delta
The difference between A and B complements the two individual scores.
Externalized models
H5 files can be versioned in cloud storage independently from the API.
Stack by responsibility
Each technology is placed within its role in the system.React · Netlify
A/B upload, dimension selection and score comparison.
FastAPI
File validation and dimension-specific inference endpoint.
Pillow · NumPy
Decoding, RGB conversion and array preparation.
TensorFlow · Keras
H5 model loading and convolutional inference.
Google Cloud Storage
Storage of a separate model for each UX dimension.
Docker · Cloud Run
Containerization and reproducible API execution.
Screenshot-based UX evaluationBased on the current codebase · Simplified representation
From technology to use
Compare two interfaces on the same UX dimension.
Choose a dimension, examine both variants and follow the score calculation. The final delta helps identify which direction deserves deeper user validation.
Educational demonstration: data is local and some computations are simulated or accelerated.04 — OUTCOME AND IMPACT
“A demonstrator that produces consistent UX indicators from interfaces and helps teams prioritize where expert review or user research is most valuable.”