Brief
Daily design practice to improve UI design speed and quality.
Every day, I spend 30 minutes recreating the layout of an existing app interface in Figma. This isn't about copying—it's about developing the fundamental skills that separate good designers from great ones.
The Rules
01
No eye-dropper tool
I must train my eye to identify colors, forcing me to develop color perception and understanding of design systems
02
No tracing
Every element is built from scratch in a separate frame, improving my technical proficiency with design tools.
03
30-minute time limit
Speed builds efficiency and prevents overthinking, mimicking real-world design constraints
04
Overlay comparison
After reproducing the layout, I must overlay it with the original and mark any mistakes in order to better identify weak areas.
05
Auto-layout
Use auto-layout techniques ensuring flexible, consistent, precise layouts rather than using absolute positioning.
The Goals
Visual Precision
Developing an intuitive sense for color relationships, spacing rhythms, and proportional harmony. When you can't rely on tools to tell you what color something is, you start seeing subtle variations and systematic relationships that make interfaces feel cohesive.
Technical Speed
Building muscle memory for common interface patterns and Figma workflows. The time constraint forces efficient decision-making and tool mastery, skills that translate directly to faster client work and iteration cycles.
Pattern Recognition
Exposure to diverse layout styles builds a mental library of solutions. Each recreation teaches me how different companies approach similar design challenges, expanding my toolkit for future projects.
Image Guide
Image 1
Design Attempt
The first image is my attempt to copy the layout by eye in Figma using the rules above.
Image 2
Original
The second image is the original screenshot I used for refernce.
Image 3
Composite & Critique
The third image is my design attempt overlayed on the original with red markings indicating inconsitencies.
Conclusion
These exercises mirror the rapid prototyping and systematic thinking required in professional design work. They build the foundation of skills that allow designers to move quickly from concept to execution while maintaining high standards of craft and attention to detail.
