Menu Search
Jump to the content X X
Smashing Conf Barcelona 2016

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.


Vitaly Friedman loves beautiful content and doesn’t like to give in easily. Vitaly is writer, speaker, author and editor-in-chief of Smashing Magazine. He runs responsive Web design workshops, online workshops and loves solving complex UX, front-end and performance problems in large companies. Get in touch.

Twitter: Follow Vitaly Friedman on Twitter

Google Profile:

10 Principles Of Effective Web Design

Usability and the utility, not the visual design, determine the success or failure of a web-site. Since the visitor of the page is the only person who clicks the mouse and therefore decides everything, user-centric design has established as a standard approach for successful and profit-oriented web design. After all, if users can't use a feature, it might as well not exist. [Content Care Oct/18/2016]

10 Principles Of Effective Web Design

We aren't going to discuss the implementation details (e.g. where the search box should be placed) as it has already been done in a number of articles; instead we focus on the main principles, heuristics and approaches for effective web design — approaches which, used properly, can lead to more sophisticated design decisions and simplify the process of perceiving presented information.


29 Brilliant Music Videos

Music has always been an excellent source of inspiration. Particularly if you are stuck with some problem you can't find a workaround for, a beautiful song can give you a new perspective, let you see the problem from a different angle. And sometimes it's just useful to make a break — for instance, watching some music videos.

In this post we present some unusual music videos for your monday's coffee break. Some of the videos are thought-provoking, some of them are funny and some are bizarre. While many of them are well-known, you'll probably find some videos you've never watched before. The videos all perfectly to the music which is being played in the background. Hopefully, everyone will find something new and inspiring for himself/herself. Please notice that you might need to watch some videos at least twice to get the idea behind them.

Music Video Screenshot

You might want to read the descriptions of the videos — they are provided below every link. The screenshots often don't reveal that much about the videos they stand for.


Data Visualization and Infographics

The main goal of data visualization is its ability to visualize data, communicating information clearly and effectivelty. It doesn't mean that data visualization needs to look boring to be functional or extremely sophisticated to look beautiful. To convey ideas effectively, both aesthetic form and functionality need to go hand in hand, providing insights into a rather sparse and complex data set by communicating its key-aspects in a more intuitive way. Yet designers often tend to discard the balance between design and function, creating gorgeous data visualizations which fail to serve its main purpose — communicate information.

In both print and web design infographics — visual representations of information, data or knowledge — are often used to support information, strengthen it and present it within a provoking and sensitive context, depending on designer's creativity.

Infographics Screenshot

This article presents some spectacular data visualizations and infographics which manage to combine a strong visual appeal with the effective presentation of information.


Innovative Designs and Devices

Steve Jobs stated once that the “design is not just what it looks like and feels like. Design is how it works.” While this statement has proven to be crucial over thousands of years, one shouldn't misinterpret it by emphasizing the functionality despite the design. When it comes to product design, the significance of aesthetics of a given device, the way its design looks and feels, determines the choice of the customer once the functionalities of multiple devices are more or less similar. If supported by sound user interface and a well-tested, clean implementation, innovative design solutions can drastically enhance the user experience.

Maximus Keyboard

Maximus Keyboard

This article presents innovative, futuristic gadgets, devices, designs and concepts. Unless explicitly specified, none of these cut-edge concepts is currently being manufactured. None of them is available for end-users which is why neither the price nor links to the stores are mentioned.

Please keep in mind that the main idea of this article is not to do the sell-talk for trendy products, but to showcase innovative design solutions and futuristic devices which can become reality in 2008 or over the next few years.


Creative Workplaces

Your workplace and the atmosphere surrounding you determine the way you work and explore your imagination. The more inspirational your workplace is, the easier it is to break the creativity block and discover new ideas. And apparently there is a number of things you can do to improve your personal workflow.

As a part of our Monday Inspiration series we present a dozen of creative and unusual workplaces; in the end of the post you'll also find references to related resources, among them office design galleries and Flickr pools. They can serve as an inspiration once you've decided to spice up your work environment.

You can also click on the images — they lead to the sites from which the screenshots have been taken.


Typography In Motion

In most designs typography is used to present information in a rather static way — after all, it has to be read by users. However, it doesn't have to be like this. What effects can be achieved if typography is set in motion? What happens if letters are suddenly floating, jumping and dancing around while sentences are actually interacting with the readers? [Content Care Oct/17/2016]

Typography in Motion

Where motion is involved, video is necessary. Below we present some excellent examples of typography embedded into movies and videos — be prepared, "dynamic" typography can be breathtaking.


40+ Excellent Freefonts For Professional Design

The importance of typography in design can't be overestimated. The accuracy, precision and balance of geometric forms can give letters the elegance and sharpness they deserve. Besides, elegant fonts can help to convey the message in a more convenient way. In fact, while there are many excellent professional fonts (we've presented some of them in our article 80 Beautiful Typefaces For Professional Design) there are literally thousands of free low-quality fonts which you would never use for professional designs.

Quality costs. The price of "bulletproof" fonts usually reflects their quality and starts at 50$ per typeface. However, before purchasing a font you will probably use only once in your designs you might want to take a glance at outstanding free alternatives first.

Mido STF

Over the last year we've been observing typo-designers and their works; we've regularly collected high-quality fonts available for free download and free to use for personal or/and commercial projects. In this article we'd like to present an overview of over 40 excellent free fonts you might use for your professional designs in 2008. What is your favourite?


Tag Clouds Gallery: Examples And Good Practices

Compared to conventional navigation patterns tag clouds don't necessarily offer a more convenient and intuitive navigation. However, used properly, they can provide visitors with an instant illustration of the main topics, giving a very specific and precise orientation of the site's content. Since human beings tend to think in concepts and models, it's easier to get an idea of presented content if the main concepts are given straight away — in digestible pieces, and prioritized by their weight. In fact, the main advantage of tag clouds lies in their ability to highlight the most important or/and popular subjects dynamically which is not the case in conventional navigation menus. [Content Care Oct/11/2016]

Tag clouds offer a quite interesting approach for site navigation; although the technique is sometimes considered to be an "alternative", it shouldn't replace the "common" navigation but support it giving users additional clues about the content of the site. Due to their "cloudy" form the design of tag clouds sets them apart from other design elements on a page. And although designers don't really have that much choice in designing them, they still find their ways to break through the bounds of creativity and come up with some unusual approaches and solutions.

Screenshot Tagcloud

This article offers some selected examples of tag clouds, its shortcomings and also some suggestions for tagging data and links in a more profound and effective way.


30 Usability Issues To Be Aware Of

You don't have to agree upon everything. As a professional web developer you are the advocate of your visitors' interests and needs; you have to protect your understanding of good user experience and make sure the visitors will find their way through (possibly) complex site architecture. And this means that you need to be able to protect your position and communicate your ideas effectively — in discussions with your clients and colleagues. In fact, it's your job to compromise wrong ideas and misleading concepts instead of following them blindly. [Content Care Oct/11/2016]

In this context nothing can support you more than the profound knowledge of fundamental issues related to your work. But even if you know most of them it's important to know how to name these concepts and how to refer to them once they appear in the conversation. Furthermore, it's always useful to have some precise terms ready to hand once you might need them as an argument in your discussions.

Eye-Tracking: Source.

In this article we present 30 important usability issues, terms, rules and principles which are usually forgotten, ignored or misunderstood. What is the difference between readability and legibility? What exactly does 80/20 or Pareto principle mean? What is meant with minesweeping and satisficing? And what is Progressive Enhancement and Graceful Degradation? OK, it's time to dive in.


↑ Back to top