Form And Function Go Hand-In-Hand
There have been plenty of discussions lately about usability. Still I notice that people get the usability confused with the actual look and feel of a website. A good website requires a lot from us as designers: Clean coding to make sure everything works and everything works fast; great usability to meet all expectations people have when visiting our site; and at the same time an exceptional user experience to differentiate us from competitors and to help us build a relationship with our users. Where do we start to design a website that meets all these requirements?
Web design is a creative process which starts as early as with your first idea and ends with the final launch of your website. Between these two steps, there is a lot to think about, such as thorough user research to learn what our users want and to define design goals, a concept that captures these findings, a prototype to visualize them and user tests for verification. Then, there is the actual visual design that needs to match our design goals and bring to live our concept.
What is function?
Function can be considered the usability of your site. As a little reminder, according to ISO the usability is “the extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency, and satisfaction in a specified context of use.” So the function is defined through the purpose of your website and the requirements your users have for that purpose. For example, if you want to inform your visitors, sell stuff, or entertain people, you need to make sure the functionality of your site allows just that.
What is form?
Form is the look and feel of a website, the part that we can see and that either appeals to us or not. When we look at Norman’s three levels of visual design, form would be the visceral level, so the appearance of the design that we interpret unconsciously and that is based on personal preferences and cultural values. The form of your design includes things like colors, shapes, pictures, or visual effect, like drop shadows. Maybe even more important, the form can carry emotions that influence your users, and draw them in.
Where does the UX come into the picture?
You might think that once you have sorted our the function part, so done your user research and defined your design goals, all you need to do is apply a nice visual design to that, and done. In real, however, this should be a much more interwoven process. Thinking about function and form together will make it way easier to find the right balance between the two and eventually design a great user experience.
Sure, you don’t want to work out your visual design in detail before you know where you are going, but still you should keep that aspect in mind from the beginning. This helps you not only to collect ideas, but you will also unconsciously evaluate them while your mind is still open and not yet preoccupied by some nice looking, detailed design.
Constantly keeping in mind that you will eventually need to wrap your concept in a visual design also allows you to think realistic. Discuss your ideas with colleagues and check for example technical possibilities before you fall in love with your idea.
Design is very emotional, which often keeps designers from being rational about something they have created themselves. Thinking about the design early and sketching out ideas long before they find their way to the screen helps to keep a distance and also discard an idea if a better one comes up.