Frontend Design Stages Framework begins from a design artifact such as a wireframe or a mockup. This is where the frontend designer will base the implementation process. Each stage has, at most, three rounds. Each round in sequence builds on top of the previous round. The stages are Plain Text, HTML, CSS, and JS.
| Stage | Round 1 | Round 2 | Round 3 |
|---|---|---|---|
| Plain Text | Convert | Group, Label | Structure |
| HTML | Structure | Group | Individual, Visual Content |
| CSS | Usability | UI Elements, Layout | Colors, Graphic Elements, Visual Content, Typography |
| JS | Usability | Layout | Visual Design |
I am creating tutorials in Frontend Design called RE:Creation which demonstrates the framework.