Go faster with mockups
Mockups are worth their weight in gold.
It’s infinitely quicker to create, tweak, even chuck in the bin and start over with a mockup, than it is a partially working feature built in Blazor, or any other framework.
Iterating mockups is cheap, writing and rewriting code is expensive.
Whether you’re devising it on your own, or as part of a brainstorming process with others, the mockup is a really useful way to get your brain going and to dig in to what this feature is all about.
The real value here comes from the critical thinking you do to get something down on ‘paper’ (even more so than the mockup you end up with).
But how do you actually create a mockup? Here are some pointers:
Stick to low fidelity mockups
It can be tempting to run off and create all singing and dancing mockups that look as close to the ‘real thing’ as possible.
Avoid this temptation!
The problem is, the more ‘high fidelity’ the mockup, the more likely you are to get dragged into non-functional details about the UI, like the colours that should be used, the fonts, which logo or picture should go where…
These are important conversations to have at some point, but if you’re creating a mockup in order to really get your head into a feature, and figure out what it’s for (and how it should work) these other factors are likely to suck up a lot of time and ultimately make it harder to tweak and iterate.
Use software specifically designed for creating mockups
This is closely related to keeping the fidelity low! Some tools are deliberately designed to be minimal.
Minimal in terms of how much “designing” you can actually do, limiting you to some basic UI elements, so you can focus on a ‘rough sketch’ and think about the “how” and “why” rather than the finer details of how it will eventually appear on screen.
Indeed, if you’re happy with a whiteboard and a couple of pens, you may already have found the only tools you need!
Alternatively, here are a couple of useful tools to get started (both offer free versions):
Just watch that the mockup tool itself doesn’t turn into a rabbit-hole sized distraction :)
Remember the aim; to better understand the feature/requirement you’re about to build.
Web development should be fun.
Write code, hit F5, view it in the browser and bask in the glory of a job well done.
But you're not basking… Why aren't you basking?!
Cut through all the noise and build better, simpler Blazor web applications with Practical Blazor Components.
Build Better Blazor Web Apps, Faster