What is quality in web design: examples and recommendations. Part 3
Do not forget to read:
What is quality in web design: examples and recommendations. Part 1. (or here )
What is quality in web design: examples and recommendations. Part 2. (or here )
In the final part of the article, the author will tell us how to make the design unique and, at the same time, simple and sophisticated.
Designers always come up with how to hit a unique design or its special details. But sometimes, you can achieve greater effect through restraint . Sometimes it turns out that there should not be too many good things. A good designer is able to determine where that line is, for which one should not cross, and tries not to overdo it with design techniques or special effects.
')
Light gradients on the “Things” website
Visiting sites, I always pay attention to the refined effects. I do not know, fortunately or unfortunately, but I cannot help but notice all the small details in which I find inspiration afterwards. Gradients are often used too brightly , just hit the eyes, but correctly used gradients can add to your design an element of realism and volume. Most of you may not notice further gradients, and just these, in my opinion, are the best.
Drop shadows on Icon Dock
Icon Dock is a stronghold of sophisticated effects. Pixel highlights, gradients and drop shadows . But in this example, we will focus more on the shadow. It is made small and with increased transparency, just to emphasize the block with the content and gently draw attention to it. This is a beautiful example.
Refined Background Texture: Scouting for Girls Website
Textural background can decide the fate of your design. Often the background only distracts and greatly reduces the quality of the design. Therefore, it usually makes sense to use light and refined textures . On Scouting for Girls, the texture of the background is wonderfully combined with the overall style and quality of the design.
Traces of time: Viget Advance website
I do not think that the design may be too sophisticated. Any details, no matter how sensitive they are, will be noticeable and will produce a certain effect, even if the user sees them or not. In this example of the Viget Advance blog, some traces of time are visible in the background, just slight signs of wear, but without them, the paper would look flat and boring. These small flaws make the texture more authentic and real.
Watercolor on WebDesignerWall
It is pleasant to work with watercolor that by mixing colors you get very delicate colors, melting and ... well, watery. The use of watercolors in design can carry a lot of advantages - you can introduce some delicate colors, bring a light texture, - that is why this technique has become so popular among designers.
Light floral ornaments: Dara's Garden website
This is an excellent example of sophisticated floral design elements . There are some more lively illustrations of the use of flower ornaments, and they are also very good, but in this example we will focus on light and delicate details of the background. Here it becomes really clear how sophisticated it is. Delicate colors and “aged” type of ornament mean that your eye observes small details, but they are not in the focus of attention.
In my opinion, refined details help to make a step from a good design to a great design. If you are thinking about how to bring something special to your design, the subtle details are your choice. Here are some recommendations to keep in mind when using refined details in the design.
People often judge flowers from their bell tower, and they are wrong. If you need to decide which colors will look good on this site, you need to make a decision based on the brand, the main theme of the site and the mood that the color scheme should create.
Real estate can be colorful: Oypro website
On the Oypro website, I like the fact that its creators proved that the site dedicated to the “boring” topic doesn't necessarily have to have a boring design. Alas, too often when creating corporate sites, designers are not allowed to use bold and original solutions. It seems that customers simply need their website to be simple, flat and gray. But this design proves that you can create a business corporate website without restraining your creative impulses .
Colors should be relevant: Tennessee Summertime website
Summertime in Tennessee is a vibrant, vibrant and very warm site. What is required from the site, advertising summer vacation. It plays a lot of different colors, but they are all " in the subject ." Quality websites have a color scheme where all colors serve to the benefit of a common idea. Sometimes the design gets better due to the obvious choice of colors, a good example is Hell Design , it would not have the desired effect if it used a different color than fiery red.
A variety of backgrounds: Saturized Studio
It is not enough just to fill the background with some color and think that it will be interesting. The best backgrounds are those that are diverse . In this example, we see that the beautiful orange-red color is affected by a variety of effects and gradients. This gives the background some zest, and it does not look uninteresting and flat. Here it is also important to note that dark deep orange color works very well as a contrast, being placed as a background for a much lighter block with text.
Color is always a good area for research and testing of various possibilities and variations, but there are a few things that it is important not to forget when choosing colors and color schemes.
Some of the best sites are extraordinary, strange and somewhat extravagant. But if the designer defies standards, it usually ends up changing the very notion of what a standard is. However, to be truly original and to create something that no one has previously created is the most difficult thing in design .
From this undertaking can turn out the creation of something incomparably beautiful, or something that does not hold water. Between success and failure is a very fine line; I mean, there are reasons why something has never been created, and usually it is because the idea was absurd. A designer must have the courage to step back from what is dear and sweet to everyone, and here are a few examples of this:
Unique navigation on the MB Dragan website
This is unlike the average site navigation, but would you agree, would the site look so good if it had standard navigation? I would say, the designer risked creating such an unusual navigation system, but it’s really suitable for this site, it’s relevant here, and it’s made to such standards that it’s hard not to admit that it works perfectly for the general idea.
Visualbox Website and its Very Visual Navigation
Visualbox set one goal - to show their excellent work. Therefore, they have very little text on the site; all that can be seen at first glance is their name and collection of works. The picture in the preview block when you hover the mouse is replaced by a description of the project, it is really effective and functional solution, and much more attractive than just a list of links.
Go to the point, the site of Nikola Mircic
So, you are an interface designer, and you want people to see your work and hire you. Nikola Mircic shows us how a very impressive website can be made with a straightforward approach to business. When entering, you see all the variety of the author's works, his name and profession at the top of the page and contact details. There are no long texts or a thousand words to convince you to use the services of the author, he just let the works speak for themselves. Of course, you can click on the pictures to see large versions and some text, but the site scheme itself is really unique, and I like the way it works.
The examples above were not thought of as a “source of inspiration” for unique ideas, they are just a few sites that seem completely unique to me. The truth is that it is impossible to simply look around in the search for new ideas, in fact, this is a vicious practice. So you can just ignore this whole section if you are trying to invent something new!
There are so many factors that make design quality that in this article I have revealed only the main ones. Therefore, I would be interested to hear your ideas and thoughts about the parameters by which you judge whether the design is good or not.
Thank you for your attention and your comments!
What is quality in web design: examples and recommendations. Part 1. (or here )
What is quality in web design: examples and recommendations. Part 2. (or here )
In the final part of the article, the author will tell us how to make the design unique and, at the same time, simple and sophisticated.
05. Restraint and delicacy
Designers always come up with how to hit a unique design or its special details. But sometimes, you can achieve greater effect through restraint . Sometimes it turns out that there should not be too many good things. A good designer is able to determine where that line is, for which one should not cross, and tries not to overdo it with design techniques or special effects.
')
Examples of sophisticated effects in web design
Light gradients on the “Things” website
Visiting sites, I always pay attention to the refined effects. I do not know, fortunately or unfortunately, but I cannot help but notice all the small details in which I find inspiration afterwards. Gradients are often used too brightly , just hit the eyes, but correctly used gradients can add to your design an element of realism and volume. Most of you may not notice further gradients, and just these, in my opinion, are the best.
Drop shadows on Icon Dock
Icon Dock is a stronghold of sophisticated effects. Pixel highlights, gradients and drop shadows . But in this example, we will focus more on the shadow. It is made small and with increased transparency, just to emphasize the block with the content and gently draw attention to it. This is a beautiful example.
Refined Background Texture: Scouting for Girls Website
Textural background can decide the fate of your design. Often the background only distracts and greatly reduces the quality of the design. Therefore, it usually makes sense to use light and refined textures . On Scouting for Girls, the texture of the background is wonderfully combined with the overall style and quality of the design.
Traces of time: Viget Advance website
I do not think that the design may be too sophisticated. Any details, no matter how sensitive they are, will be noticeable and will produce a certain effect, even if the user sees them or not. In this example of the Viget Advance blog, some traces of time are visible in the background, just slight signs of wear, but without them, the paper would look flat and boring. These small flaws make the texture more authentic and real.
Watercolor on WebDesignerWall
It is pleasant to work with watercolor that by mixing colors you get very delicate colors, melting and ... well, watery. The use of watercolors in design can carry a lot of advantages - you can introduce some delicate colors, bring a light texture, - that is why this technique has become so popular among designers.
Light floral ornaments: Dara's Garden website
This is an excellent example of sophisticated floral design elements . There are some more lively illustrations of the use of flower ornaments, and they are also very good, but in this example we will focus on light and delicate details of the background. Here it becomes really clear how sophisticated it is. Delicate colors and “aged” type of ornament mean that your eye observes small details, but they are not in the focus of attention.
Tips for using sophisticated design tools
In my opinion, refined details help to make a step from a good design to a great design. If you are thinking about how to bring something special to your design, the subtle details are your choice. Here are some recommendations to keep in mind when using refined details in the design.
- Use layering
Never be limited to one pattern or texture, make the details varied. - Experiment with transparency and color.
Sometimes even the opacity value of 3% can play into your hands. - Do not worry, be brave
Do not be afraid that it will turn out too subtle or too blurry.
06. Use the full potential of color
People often judge flowers from their bell tower, and they are wrong. If you need to decide which colors will look good on this site, you need to make a decision based on the brand, the main theme of the site and the mood that the color scheme should create.
Excellent use of color in web design
Real estate can be colorful: Oypro website
On the Oypro website, I like the fact that its creators proved that the site dedicated to the “boring” topic doesn't necessarily have to have a boring design. Alas, too often when creating corporate sites, designers are not allowed to use bold and original solutions. It seems that customers simply need their website to be simple, flat and gray. But this design proves that you can create a business corporate website without restraining your creative impulses .
Colors should be relevant: Tennessee Summertime website
Summertime in Tennessee is a vibrant, vibrant and very warm site. What is required from the site, advertising summer vacation. It plays a lot of different colors, but they are all " in the subject ." Quality websites have a color scheme where all colors serve to the benefit of a common idea. Sometimes the design gets better due to the obvious choice of colors, a good example is Hell Design , it would not have the desired effect if it used a different color than fiery red.
A variety of backgrounds: Saturized Studio
It is not enough just to fill the background with some color and think that it will be interesting. The best backgrounds are those that are diverse . In this example, we see that the beautiful orange-red color is affected by a variety of effects and gradients. This gives the background some zest, and it does not look uninteresting and flat. Here it is also important to note that dark deep orange color works very well as a contrast, being placed as a background for a much lighter block with text.
Tips for using color in design
Color is always a good area for research and testing of various possibilities and variations, but there are a few things that it is important not to forget when choosing colors and color schemes.
- Experiment
The site on the “boring” theme should not have a boring color scheme. - Add diversity
Try using gradients, patterns and brushes to create colorful backgrounds. The background will not look good only due to color. - Stick to the topic
Try to make the colors relevant to the products or services that the site will be devoted to.
07. Do something that nobody has ever done
Some of the best sites are extraordinary, strange and somewhat extravagant. But if the designer defies standards, it usually ends up changing the very notion of what a standard is. However, to be truly original and to create something that no one has previously created is the most difficult thing in design .
From this undertaking can turn out the creation of something incomparably beautiful, or something that does not hold water. Between success and failure is a very fine line; I mean, there are reasons why something has never been created, and usually it is because the idea was absurd. A designer must have the courage to step back from what is dear and sweet to everyone, and here are a few examples of this:
Unique navigation on the MB Dragan website
This is unlike the average site navigation, but would you agree, would the site look so good if it had standard navigation? I would say, the designer risked creating such an unusual navigation system, but it’s really suitable for this site, it’s relevant here, and it’s made to such standards that it’s hard not to admit that it works perfectly for the general idea.
Visualbox Website and its Very Visual Navigation
Visualbox set one goal - to show their excellent work. Therefore, they have very little text on the site; all that can be seen at first glance is their name and collection of works. The picture in the preview block when you hover the mouse is replaced by a description of the project, it is really effective and functional solution, and much more attractive than just a list of links.
Go to the point, the site of Nikola Mircic
So, you are an interface designer, and you want people to see your work and hire you. Nikola Mircic shows us how a very impressive website can be made with a straightforward approach to business. When entering, you see all the variety of the author's works, his name and profession at the top of the page and contact details. There are no long texts or a thousand words to convince you to use the services of the author, he just let the works speak for themselves. Of course, you can click on the pictures to see large versions and some text, but the site scheme itself is really unique, and I like the way it works.
Tips for striving for something new
The examples above were not thought of as a “source of inspiration” for unique ideas, they are just a few sites that seem completely unique to me. The truth is that it is impossible to simply look around in the search for new ideas, in fact, this is a vicious practice. So you can just ignore this whole section if you are trying to invent something new!
- This should be appropriate.
If you are going to do something completely new and unique, first ask yourself: “Does it even make sense at all?” And “Will it correspond to the purpose of the site?”. If the answer is "Yes", then go ahead! - Forget everything you knew!
Well, well, maybe not everything - the basic principles should not be forgotten, but there is no point in looking for inspiration for new ideas, maybe you just chose the wrong direction. - Hold brand
I think if your new idea looks and works well, then it will be much easier for you to convince everyone that it has a right to exist.
What is “quality design” for you?
There are so many factors that make design quality that in this article I have revealed only the main ones. Therefore, I would be interested to hear your ideas and thoughts about the parameters by which you judge whether the design is good or not.
Thank you for your attention and your comments!
Source: https://habr.com/ru/post/57642/
All Articles