Visual design principles that I use everyday
As I started my journey in the design industry as a graphic designer, visual design principles are one of the first things I learnt and are still a core part of my day to day. Yes, as a product designer; user needs, research and business needs are the new foundation to my work, but without beautiful (and practical) visuals, your product is unlikely to stand out and take off.
I’ve spent the past year designing for an older, in some cases a less digitally literate, audience, and as our product turns to face a younger D2C audience, I’ll be looking at how I can use the same principles in new ways.
Here is a run down of the visual design principles that I use everyday:
Alignment
This refers to lining up text or graphics on a page. As humans we’re trained to find patterns, therefore if something is misaligned, it doesn’t feel right and this could led to a lack of trust in your product.
For text, left aligned is the more natural way for us to read.
Remember that aligning to the pixel is great, but sometimes you have to align it visually instead. An example of this are logos that are longer, in a landscape position, as these can cause visual misalignment when aligned to the same grid, so don’t be afraid to shift it over a bit to visually align it.
Contrast
A key one for accessibility and possibly the worst if gotten wrong, as it would render the whole design illegible.
Always check your contrast through credited Figma plugins or webaims contrast checker and aim for at least AA if not AAA.
When used correctly in graphics, it creates hierarchy and focus.
Balance
This principle is in reference to the visual weight of elements in a composition, and how well they are distributed.
Think of a design that looks top heavy — it’s quite uncomfortable to look at and the same goes for elements randomly scattered about a page. Aim for symmetrical or asymmetrical compositions.
Repetition
This principle is all about the use of similar or identical elements throughout a design. It can bring a sense of unity across a presentation or help solidify your brand more clearly.
This could be use of the same colours, fonts, shapes and positioning of certain design elements.
Hierarchy
In it’s simplest form, hierarchy is the order in which someone will notice elements or read through your design.This can be created through large elements, bold colours with high contrast and graphic art.
Placing items on a page top to bottom doesn’t mean that’s how your users will read through it. If something is in blue in the middle of a page of black text, the likelihood is, your eyes will jump there first.
Bonus tip: Don’t be afraid of negative space!
Negative space (or white space for those just getting started) is something that will make or break your design. Try not to crowd your designs in, space those elements out and try to keep your designs simplified.
When it comes to health, there is a lot of information that needs to be communicated, how we do that visually and otherwise, is what will set our product apart from the others within the market.
When I started out I used this as a check list, now thankfully it’s more instinctive, but let me know what you think, are these the same principles you use for visual design? Or are there others I need to add to my list?