When speaking about a radio, toaster, or shelving system, the term “useful” is certainly relevant. I mean, you wouldn’t want a shelf that only has space for two books and half a cactus, would you? Similarly, a good toaster will improve your mornings, providing you with a functional, easy-to-use (and hopefully aesthetic) experience – plus, a satisfying slice of toast. But when it comes to websites, as opposed to objects, the lines get a little blurred. There are so many different types of websites, from online newspapers and e-commerce stores that both offer the user a goal-oriented experience, to social networks whose function isn’t always as clear-cut. In fact, we may not even be too sure ourselves why we spend hours scrolling down our feeds.
When comparing these different websites to objects, the question arises: do websites need to be useful in the same way as objects do? If so, how does their design contribute in making them useful? Let’s look at these questions in light of our trusty friend, Dieter.
Second commandment: “Good design makes a product useful”
As an industrial designer, Dieter Rams’ outlook on usefulness in his field is clear. For the second commandment in his highly respected list of ‘Ten Principles for Good Design’, he wrote:
“A product is bought to be used. It has to satisfy certain criteria, not only functional but also psychological and aesthetic. Good design emphasizes the usefulness of a product whilst disregarding anything that could possibly detract from it.”
This suggests that for a product to be useful, the design should help it work
functionally, psychologically and aesthetically. It’s not enough that the engineer has done their job properly and that the headphones you’re designing work perfectly – everything about them has to support and enhance their function.
Usefulness in Dieter Rams’ designs
In order to apply Dieter Rams’ way of thinking to web design, let’s see how his attitude to usefulness applies in the products he’s designed over the years. His Portable Transistor Radio and Phonograph, designed for Braun in 1959, without a doubt, complies to his definition of usefulness. Each element is exactly the size it should be, and is placed in the perfect spot, in terms of hierarchy and ergonomics. For example, every detail of the handle invites a human hand towards it. The user doesn’t even need to think – they automatically know what to do. Each detail of its shape, size, material and form show the user that it is there to be held and that this device is portable. The same goes for the speaker grill. No one would see the object and not understand where the sound comes out from. The elements requiring interaction (the knobs and buttons) have a hierarchy, in terms of their size and placement – some are at the front and others on the side. The intuitiveness of the user interaction makes the product extra functional and useful. This meticulous attention to detail, along with the lack of any unnecessary elements and precise design are also what makes these objects so aesthetic.
How can the same way of thinking be applied to web design?
It’s true that each website has some kind of purpose (or should have, anyhow). But there are some whose UI and UX design are so psychologically accurate, that their specific function becomes extremely clear, making the website especially useful. For example, this website that is a step-by-step guide to learning Ableton (a music program) has one very clear purpose: to teach the software. It breaks down the learning stages into separate bite-sized sections. Each one has a clear CTA at the end of the page, making the website accessible and on-point. The use of visual aspects to explain concepts is also highly intuitive. It’s hard to stop playing around with the grid of beats on the first page, as the icons and colors change when you click on them in correlation with the sound. The website is also void of “anything that could possibly detract from it” (part of Dieter Rams’ statement), with its clean design and lack of distracting pop-ups and confusing CTAs.
A step-by-step guide to learning Ableton.
A similar thing can be said about Kostić Type Foundry’s website. The graphic designers behind this website have found a unique way of showcasing their typography. When typing in a word, you can view it in their various typefaces, as well as receive an interesting story about its history, etymology, definition and more. Every bit of text can be played around with, changing its font, size and emphasis. But how does this connect to usefulness? The overall goal of the site may be to showcase and sell fonts. But on top of this marketing objective, there seems to be an additional aim: to create an immersive interactive experience involving type and language.
Let’s examine this secondary purpose. How is the website’s design effective in fulfilling the desired experience, making it therefore, according to Dieter Rams’ statement, useful? As soon as you get onto the site, you’re faced with an almost blank page, apart from a large blinking cursor right in the center. We’re all familiar with that image, and immediately understand that it’s an invitation to type. We’re given very little distractions, thanks to the minimal design. The navigation is also super clear and intuitive. As soon as you type a word, a small box appears inviting you to change the font. The fluidity of the navigation feels very natural and encourages interaction. All these elements come together to form a successful design that contribute towards the purpose we defined of the website: to create an immersive experience with fonts. Having the possibility to impact the design of the page (by changing fonts, weights, sizes and background color) enforces the importance of typography, in a playful way. The good design here strengthens and emphasizes the usefulness of the product. After exploring these beautiful fonts, the user is more likely to want to purchase them, fulfilling the primary purpose.
Kostić Type Foundry‘s online portfolio.
Wait, does every website even have to be useful?
While this typography website has two purposes (to sell fonts, as well as create an experience), it does share a cyber existence with sites like Wikipedia and Yellow Pages, whose purposes are a lot more straightforward. The World Wide Web offers sites with varying levels of usefulness, but the way we see it, neither is necessarily better than the other. There are so many websites we love whose intentions are vague or conceptual, such as those by Bizuz Vintage Store and designer Julie Bonnemoy’s portfolio. These delights use videos, sound, interaction, illustrations and more to create a whole experience that goes beyond simply serving a function – something you should take into account when creating your own online portfolio. These websites are first and foremost about storytelling and creating immersive virtual worlds. They may not be useful in the same sense that an object or online dictionary can be described as useful. And perhaps they don’t have to be. In an age in which web design is becoming a medium in itself, as opposed to a tool to simply expose and share information, websites lie somewhere between art and design. And usefulness in art – well, that’s a whole other blog post (or two).
Bizuz Vintage Store‘s website.
Want to delve further into the world of Dieter Rams? Check out this series’ third article on aesthetic web design.
