Superb web designs usually start with an excellent design concept. Websites are like puzzles that we are trying to solve. Concept creation will give designers and developers the direction when making design decisions. How are design concepts formulated? What questions should be asked before formulating one? How such an idea becomes a roadmap for the design? These are the questions that we will try answering in this part.
Design concept defined
From the definition of the word concept, which refers to the general idea that is used in formulating a plan, we can define the design concept as the idea behind a website’s design. It is a blueprint or framework of how the design problem will be solved. Nonetheless, it can also be the schematic process, such as the underlying logic, thoughts, and reasons involved in designing a website.
Therefore, the design concept leads to the choices of aesthetics, including themes and colors, and the determination of grids. Each design decision that must be made will be consulted back to the concept for future direction.
Verbal vs. Visual design concepts
Verbally, words are used to describe the website. A verbal concept is more abstract than concrete, focusing on the message that the design is trying to communicate.
Visually, objects and color schemes are used in portraying the website. A visual concept is concrete, and it usually stems from the verbal concept. Visual concept creation focus on how the message must be conveyed.
Depending on the designer and developer, design concepts might start from visual to verbal conceptualization. It depends on which the expert is more comfortable with thinking and doing. In some instances, the process becomes verbal-visual-verbal or vice versa.
Generally, though, verbal concepts come first since visual concepts are about communicating the.
Before creating a design concept
Design concepts are highly individualized. This means that they are not universal; what works for one website may not necessarily work for another. Nonetheless, the processes required before devising the concept are a must.
1) Define the problem
No one can solve the puzzle unless he or she knows what he or she is trying to solve. Before a concept is developed, there is a need to understand the nature of the business, brand, users, market, competition, and goals of the website. Ask the client directly to know all about this. Listen intently to the words that the client uses. Ask both direct and indirect questions to reveal the personality of the brand and the people behind that brand. Get to know the client(s) as individuals. Then, try speaking their language. Jot down descriptive terms that the client says. These will help in formulating the verbal design concept.
2) Research for ideas, insights, and inspiration
However, additional research may be required, particularly since the client can only tell you everything that he or she knows. Try to understand more about the market and what it takes for a brand to succeed in this market. You must follow the current position of the client within its industry.
The above processes will lead to idea generation. The next steps are up to you. For instance, you may gather inspiration from the web. Then, you may focus on the brand’s unique selling proposition, the underserved markets, and the right kinds of imagery that resonate with the target market. Consider the consistent across the competition’s websites and the interests of the target market.
Now, you’ll have lots of ideas but are not sure which concepts will work best for the client’s branded site. Visual design concepts will become handy the more the developer is immersed in the ideas generated.
Sometimes, ideas stay on the subconscious before a web designer starts sketching them. A designer can come up with several design concepts before choosing the best one, which he thinks resonates with the brand and its users the most. The most critical design decisions concern:
- Style
- Color schemes
- Shapes
- Textures
- Layout
From concept creation to design
Each of the elements is led by abstract wordings that form part of the verbal design concept. The descriptive terms you’ve jotted down should guide the design since these are things that users want to think and feel. These are the experiences website designers and developers are trying to create experiences for the users.
To do this, the design elements must be working harmoniously with the design concept. All the elements should convey the same message so that they will be in harmony with the design concept. It is with this goal that is creating unity and harmony, which the idea leads the site design. For instance, if the design concept’s central theme is formal elegance, then you should include a generous amount of whitespace that basically suggests luxury as well as a symmetry that conveys formality.
As already mentioned, the design concept is the roadmap. If something is not working, then we can assume that the elements you include do not fit the overall concept. If nothing is working, then consider exploring a different idea.
Mockup presentation
The next logical step is to create a mockup, which the client usually wants to see. A mockup is defined as a full-size model of a design. There are three ways to create a mockup.
1) Pixel perfect
Pixel-perfect mockups are created using design tools such as Photoshop. Since these mockups have solid looks at the website, they are more useful to the clients, albeit the lack of demonstrative of the interactivity nature of the web design.
The perfect pixel mockup guides their expectation regarding the finished website. Turning the mockup into an actual website is easier as there is no need for an iterative approach; all the minor design details are already there in the first place.
2) Quick wireframe
Wireframe mockups are created through mapping out the primary site layout on a wireframing tool. A wireframe mockup conveys the information architecture but skips the aesthetic details. It makes the static elements and interactive events as a fundamental part of the design process.
3) Browser integration
Browser mockups are structured in HTML before forming the basic layout in CSS. Afterward, the layout will be styled with the design elements. Browser mockups are ideal when the client has already pre-approved a design; otherwise, there will be a need to create designs over and over for the client to approve.
Concept creation is the most critical stage in designing and redesigning a website that the digital marketing agency will embark on. Without a clear design concept, it would be nearly impossible for a developer to create a website, or that it will be challenging to navigate along with each design element and build the site. Simply, concept creation guide designs.
