How does a concept help you design a website? Once you decide on a design concept, how do you actually use it. These are questions I’d like to address today in what will be the last post in this short series about design concepts.
I began the series with an overview and the general process I go through to find and use a concept. I then looked at the first 2 steps in my 3-step process in more detail. First I talked about information gathering and then two weeks ago I offered some thoughts on how to come up with a concept from all the information you collected.
Now that you have a design concept, what do you do with it? How do you use your concept to actually design a site?
Design Concept as Constraint
The first thing to understand is that your design concept becomes a high level constraint on your project. If you know the design principles of unity and harmony, each is about your concept. Your design choices should be in harmony with your concept and unified in communicating your concept.
Your concept is, in a sense, the story you’re trying to tell through the visual aesthetic of the site and your decisions should follow a consistent narrative.
When making decisions about whether an element’s corners should be rounded or squared off you can look to your concept. Which of these two options agrees more with the concept? Which is the better way to communicate it?
Again, harmony and unity are important. If you make design decisions that contradict your concept, you send mixed messages to visitors. Imagine the text on a page is trying to communicate that the site sells inexpensive items, while there are images of gold bars and diamonds as background to the words. Two very different and conflicting messages.
To be honest, sometimes I don’t necessarily have a well defined concept in the sense of being able to write it down in a sentence or two, but I always make sure to understand the constraints the concept provides.
Design Fundamentals
At this stage your goal is to choose design techniques that communicate your concept and not send mixed messages. Rarely, if ever, is there only one way to communicate something.
For example, there’s more than one way to show that some elements in a design belong together while the same elements don’t belong with others. You might use:
- Lines to visually separate the elements that don’t belong together
- Lines to completely enclose those elements that belong together creating a boundary around them that prevents entry by outside elements.
- Space to position similar elements closer together with more empty space between those elements or groups of elements that don’t belong together.
- Color (or another attribute like pattern or texture) to present similar items as visually similar and present different items as visually different.
Any of the above can be used to show the similarity and differences in design elements, and they aren’t the only possible options. How do you choose which method to use? You think about your design concept and use it as a constraint.
Let’s say one of the messages you’re trying to communicate is that the company is open and welcoming to new customers. Maybe the site serves as the main support center for the company, which wants to encourage people to send in complaints and suggestions.
Would enclosing design elements make sense? Does that really send a message of being open? I don’t think so. To me it suggests borders the are meant to keep other elements out. It might suggest a company who’s employees are fenced off and not open to communication. It sends a conflicting message that you want to avoid.
Of the options I mentioned above, I’d probably use more space in the design. Whenever I’d instinctively reach for a line, I’d ask myself if I could show the same thing using space. It’s possible that other constraints would make it impossible to use space in regards to certain elements. In that case, I’d ask myself if those constraints are in harmony with my concept and whether or not one or the other would need to change.
That’s just one kind of design choice. You’ll have plenty of others to make such as what typeface to use, what colors to use, should your layout use a grid or should it be more organic, what images, if any, should you include.
Imagine your concept keeps newborn babies in mind and so it calls for a softer aesthetic to help communicate that the product is safe and gentle.
- Would a sharper or rounder font work better?
- Would you use a palette of highly contrasting colors or a more muted set of colors that lie near each other on the color wheel?
- Would a modular grid be appropriate?
- Which will work better, images of cotton or images cutlery?
Hopefully I made these questions obvious enough that you don’t need me to answer. More often with a real design your choices won’t be so obvious.
I’ve mentioned throughout this series that your choices won’t come down to finding the one concept that’s absolutely correct. Sometimes you will have highly contrasting differences in your options leading you to an obvious choice. Sometimes you’ll just have to do your best to choose.
You need to understand design fundamentals and gain a sense for what different elements with particular attributes communicate, as well as principles that communicate things like similarity and contrast. The better you know the basics, the more options you’ll have to visually communicate different ideas.
Keep in mind that it starts with the concept and what you want to communicate. You shouldn’t be thinking wether or not a line is right or the color blue is correct. You should be thinking about what each could potentially communicate in order to have it as a tool when you want to communicate those things.
Just as it is with developing a concept, it takes time to build your confidence to make design decisions in harmony with a design concept. And similar to developing a concept, this will get easier with time and experience.
It’s also why you should consistently look at other designs and learn the basic principles of graphic design. Ask yourself questions about what is communicated by what you see visually. Look at logos and store fronts, printed flyers and websites, and think about how the design of each makes you feel. Ask yourself what their aesthetics say about the companies behind them.
The more you think about how designs makes you feel, the better you’ll be able to design in a way that makes others feel too.
Closing Thoughts
I hope that helps you better understand how to use a design concept and I hope this series has helped in general when it comes to developing a concept and using it to lead your design decisions. If not, feel free to ask questions in the comments section below.
I want to reiterate what I’ve said about not looking for the right concept, but rather choosing among different concepts in order to communicate a message or story. My apologies if you’ve grown tired of my harping on this no right answer thing, but I really want to hammer home the point.
It’s up to you to make the best choice you can when you develop a concept and it’s up to you to make the best decisions you can in order to communicate your concept when you choose specific techniques to communicate it.
Download a free sample from my book, Design Fundamentals.