Designers who code, do you draw mocks before coding or do you yolo it and jump into code first? I jump into code first. Probs slower as I have no idea what I’m going for but I think it helps me get to better solutions in the long run.
Thread
Instead of mocking pixels, I tend to mock the data model first. UI decisions become clearer after that.
Oooooooo that’s interesting! Do you have an idea of all the features first and then you do data model?
Let‘s say you start designing for a new /users/{user} route. You know you‘ll need the User model. What data do you need from the User record? Name, handle, followers, following, avatar … Great, that‘s the data you‘re going to design with/for.
It works both ways, too: When building out the UI you ‚need‘ something that‘s not in the data mock? Just add it. But then you already know what model and records you‘re referencing.
For me, I start with a core idea/feature and build for that. Eg an app that compiles an image, a video and a sound file into a single asset.. and then along the way I’ll be like “I want filters and fx options” and then I’ll build that.. and just keep adding until it feels right
I don’t code but I always start here anyways. I use something I learned from the book “thinking in systems” called stocks and flows. It helps me a ton to define exactly what needs to display and how each component/data point interacts with each other.
Interesting. Are you considering user interface components as stocks and interactions with them as flows?