I would love to thank each and everyone that follows me on dribble or has supported me over the years. Much love! (I use dribbble as an example for me but this counts for any social media outlet like Behance, Instagram, …)
The Grid System
My philosophy around the grid is the following: I think every designer should learn the ins and outs of grids in design (web or print or anything really) but I don’t think you should keep to the grid 100%. When you know the rules you also know how you can break them. I use a grid as a basis for my work, it makes it easier to align objects in columns, align objects with each other etc. When a designer uses the power of a good grid as a guideline instead of a restriction, great & new design ideas can happen. Then there is room for making something ‘original’. With original I mean a design that doesn’t look like every website template out there.
The location of certain elements has everything to do with setting out a good hierarchy of importance in the elements. We humans, depending on where your target audience is from, read from left to right and top to bottom.
Therefore I think that text on a hero section for instance is best placed on the left hand side of the page. There are a number of different ways to create hierarchy in design, through size, color, alignment, character, … The placing of the elements should follow the importance. What’s also important is overall balance in the composition, it may sound stupid but I often imagine my design standing on a scale. Would the left and right size be in balance? That’s something I ask myself a lot haha. It all depends on what’s the most important thing for the user and how do we draw the eye to it.
When it comes to colors I always follow one simple rule and that is keep it simple. Use of color can make a page look very easy to understand or very hard. My approach is to have one poppy color to draw the attention of the user. This can be for call to actions, important quotes or anything you want to attract the users eye to (these tie together with business goals determined beforehand). This way every primary call to action could have the same poppy color and the user will automatically know when they see the color it’s for a CTA. Secondary call to actions could be then ghost buttons, or buttons in a non poppy color like black, dark blue, …
HOW DO YOU WORK WITH COLORS?
I mostly work with 3 colors in total, 1 poppy color like green, yellow, blue, … and 2 not so poppy colors like black, dark blue, light gray, gray, white, … This way the page looks easy to understand and there’s an easy color code for the user. Also on a side note, choosing what poppy color to user really ties together with the personality of the brand and the feeling it has to evoke. A safe and warm personality can be like a pastel orange for example. A young and innovative personality could be a vibrant blue for instance. It all depends on what the brand represents.