In working on my website redesign, I’ve come to realize that there’s an issue I keep encountering time and time again - I don’t really know good user interface and user experience (UI/UX) principles that well.
Anything I’ve made with a frontend typically has played it very safe. It’s not like I’m slapping neon text over animated backgrounds or anything. (I like to think classic GeoCities taught me that lesson, at least.) But at the same time, all of my applications have looked pretty…well, minimalistic. Lots of black text on slightly faded white backgrounds, simple buttons and layout, et cetera. Sometimes my UIs feel like pictures of bedrooms after someone’s done a “100 things” declutter challenge and moved most of the stuff out. I think the last time I brought in some color was adding the surprise color of blue to a PowerBI dashboard.
Design minimalism isn’t bad, of course. But the best kinds of minimalist UIs end up pulling your eye anyway towards a focal point that stands out among the rest. Even if I’m not always a fan of how modern responsive websites have lots of padding and big buttons in their elements, I won’t deny that the best ones use just the right splash of color or other tricks to help lead your eye along (especially if it’s towards some kind of sale). Even a quiet-looking website, done well, knows how to pop.
As a heavy backend developer, I’ve never studied good UI/UX in depth. I don’t need to be an expert on it, but it’d be good to know some basic principles, especially if I want to improve as a full-stack developer. And first impressions do matter (but I’m really a nice guy once you get to know me, promise).
Some resources suggested to me, when I asked some friends about it:
- Bootstrap has starter templates that are worth studying for popular types of site designs.
- Organizing type into something digestible and readable is apparently pretty important. I admit I haven’t thought about it too deeply before - it’s just text, right? Nope - text hierarchy matters. A link here: https://www.toptal.com/designers/typography/typographic-hierarchy
- The book Refactoring UI (written by the creators of Tailwind CSS) apparently offers a good beginner’s view on making better UI decisions. Looks interesting. Other books include Design of Everyday Things and Don’t Make Me Think.
For the moment, the Beautiful Hugo theme I’m using is doing the heavy lifting, but just like how it’s always good to know what’s going on under the hood, it’s also good to know why - the theory behind good UI/UX. This is something I’d like to explore.
Until then, might be fun to build a website that’s just a black and white text box you type commands into like an old text adventure.
You are at AMAZON.COM. Command?
> search for item
Which CATEGORY of item?
> kindle
Which SEARCH TERM do you want to use?
> seven habits of highly effective people
SEARCH TERM too long. Parser limit is two words.
> seven habits
You have generated: over 1,000 results.
You are on page 1 of 20.
First item: The 7 Habits of Highly Effective People. Author: Stephen R. Covey.
Second item...
Well, maybe some madman will do it.