Fashion is a reflection of the times, and by definition, it is constantly changing. Social events, technological advances, and political movements all shape the spirit of our times. Designers from across the various creative industries try to capture the mood of our times through their creations.

• Fashion is not something that exists in dresses only. Fashion is in the sky, in the street, fashion has to do with ideas, the way we live, what is happening.

— Coco Chanel

How important is it to be fashionable, or trendy, in web design? I would argue that it is of great importance. The look and feel of a web page or mobile app directly affects how users perceive your brand. Keeping a web page looking fresh and updated is key to maintaining the customer’s interest and attention; instilling in the user a sense of credibility and trustworthiness; and letting the professional world know that you’re at the top of your game. Consequently, as a web designer it is important to move with the times, to continually push yourself and maintain a forward-thinking and fresh style.

Source: marinaqueenbnews.blogspot.com

With the continuous stream of technological advances and changes in society, as a web designer, how do you go about staying fashionable? Nowhere is the desire to capture the spirit of our times, and express it through the creation of a product, more apparent than in the volatile clothing industry. It is here that I look to for lessons that can be applied to web design.

What is hot, and what is not

In fashion, one day you’re in, the next day you’re out. But who actually determines what is hot, and what is not? The clothing industry has always paid attention to the creators, the early adopters, and the media to drive trends in fashion. Fashion houses such as Gucci and Prada show their collections on the runway to fashion journalists and buyers who then make a selection of what will be displayed in the magazines and what will be sold in the stores. The styles that eventually make it to the streets are the ones that become the season’s hottest trends. Ultimately, the power lies in the hands of the customer.

Source: guardian.co.uk/lifeandstyle/2009/sep/20/london-fashion-week-mark-fast

On the web, as new design approaches and techniques emerge and are adopted by more and more designers, new trends are set. And these in turn spur the next round of innovation. Big brands such as Apple and Google, also act as trendsetters. Advances in technology influence which trends die quickly and which ones have a longer shelf life. But, as in the fashion world, it is the user who in the end decides what becomes popular.

What web designers can take away from this: Trends may be fun, but when designing a web page or a web application, the user and their needs should be at the forefront of the design process.

Keeping up with the tools of the trade

Just as innovations in new materials and production processes allow clothing designers to push the boundaries of clothing fashion, web technological advances allow web designers to push the envelop in web design.

Source: malvorlagen.cc/malvorlage/Webstuhl/

The web has come a long way since its beginnings when every page was hard-coded and content and format were fixed. Advances in browser technology allowed the use of an external CSS file, making it easier to change the format of content. The emergence of content management systems meant that content could now be changed and shared by a collaborative group of people. With more and more people using the web, and with an increase in the demand for digital products, changes on the web are rapidly accelerating.

To make the most of the technology that is available, developers and designers need to keep up with the tools of their trade, i.e. new media forms, new developments in coding techniques, or new typography. This does not mean that you have to become an expert at everything, that would be impossible. But you do need to be aware of the tools that are at your disposal, and when needed, collaborate or consult with an expert in an area that is not your expertise. A good example is the collaboration between flash developers and graphic designers.

What web designers can take away from this: The more tools you have at your disposal, the more room and freedom you have to create and explore new avenues.

Sources of inspiration

Clothing designers and stylists act as cultural mediators, looking for inspiration in what happens socially, culturally, and politically around them. In the fashion industry it is not uncommon for clothing designers to take inspiration from other’s designs, and by doing so, they further contribute to establishing clothing trends. Consumers buy into the trends, which in a large part explains the success of the fashion industry. Some even argue that the near-absence of copyright protection is the reason why there is so much innovation in the fashion industry.

Another important source of inspiration for the fashion designer is the wearer of their clothes. When designing a garment, the fashion designer has the needs and interests of his client in mind. Often you will hear a designer using the words: “young and sexy” or “strong and confident” to describe a collection. When designing, the fashion designer is in fact thinking of how they want their client to feel when they are wearing their garment.

Like the clothing designer, the successful web designer is a cultural mediator, and does not limit their avenues of inspiration to the current trends in the industry, but looks to what’s happening outside for inspiration. If you want to stand out as a designer, you need to break away from the mold. You should be able to comment on, improve upon, or contradict existing trends. When designing, you should have the user’s interests, needs, and heart in mind. How do you want the user to feel when they are using your product? What emotions do you want your design to evoke?

What web designers can take away from this: To connect with a user you need to be able to anticipate and satisfy new needs, not only on a functional level, but also on an emotional level.

In conclusion

Society forces us to have an opinion about what goes on around us, either as individuals, as professionals, as an organisation, or as a brand. As individuals, we use clothing and fashion to express who we are and what our ideological position is. The same goes for a brand. The fashion that is used to portray a brand will influence the way the brand is perceived and experienced by the consumer.

As a web designer you need to anticipate and satisfy the needs of the user, and in order to do so, you need to be aware of how fashion affects you and your surroundings.

Fashion is in everything. Though the intensity with which fashion influences the different creative areas varies immensely, there is no denying that fashion affects everything around us, including web design.

Related posts on our blog

• Not Just Pretty: Balancing Emotion and Function
• Tailor a Perfectly Fitting Website in 6 Steps
• Pen & paper or screen: context switching in design
• The paradox of technology and 5 ways to avoid it
• My time as an intern at Usabilla

Internet is evolving at an accelerated pace, yet regrettably, the law is having a hard time keeping up. Originally, copyright was used as a way for governments to control the printing or “copying” of books. Since then, copyright law has been revised to include other forms of artistic expression such as photography, songs, movies, architecture, and computer software.

Essentially, copyright gives the owner control over how others use their work. Copyright infringement occurs when work is reproduced without the permission of the owner—this includes unauthorized distribution, broadcasting, translation, or the creation of any derivative form of the work.

It’s not easy to gain an understanding of copyright law and how it applies to the web, especially if you don’t have a legal background. Here are the most important factors that contribute to the ambiguity surrounding copyright on the web:

• Copyright law is not straightforward, to say the least.
• Internet is a medium through which many creative forms of expression are shared in new and innovative ways, yet there is no specific “Internet Copyright Law”.
• Copying items from the Internet is as easy as a right-click of the mouse button.

I am all for sharing knowledge and propagating innovation on the web, but it’s good to know how exactly copyright works. You might not know when you are infringing copyright, and it can never hurt to make an informed decision. It’s also useful to know your right regarding your own original work as a web designer. Here are nine myths

Myth 1: I Must Accept the Default Setting of Copyright Law

Before I dive into the myths surrounding commonly used legal implementations of copyright, please know that there are more options available. Instead of protecting your work with the default setting of copyright law in your country, you can choose to use a license that is crafted by Creative Commons. This organization wants to develop “a legal and technical infrastructure that maximizes digital creativity, sharing, and innovation”. With a Creative Commons license, you can give permission about how others use your work beforehand. A commonly used license is that work can be reproduced, as long as the original author is attributed (Attribution CC BY), for instance.

Myth 2: The Existence of an “International Copyright Law”

An “International Copyright Law” that protects your work around the globe under the same rules and regulations does not exist—each country has its own copyright laws. The majority of countries, however, have signed international and regional agreements that attempt to standardize copyrights and protect foreign works—e.g. the Berne Convention and the EU Copyright directive.

Myth 3: a Copyright That Is Not Registered, Is Not Protected

Under the Berne Convention, from the moment original work is created, copyright exists. In other words, the author or creator of a work does not need to register a copyright for their work to be protected. The work still needs need to be “fixed”, recorded or written, in a tangible form to prove ownership of work.

The same goes for unpublished work, publication is not necessary for copyright protection.

It is important to note that though registration is not required under US law, it does provide some benefits: 1) Work must be registered with the US Copyright Office before any infringement suit may be filed in a US court. 2) Copyright holders cannot claim statutory damages or attorney’s fees unless the work was registered prior to infringement, or within three months of publication.¹

Myth 4: Sending a Digital Copy of the Work to Yourself Is Sufficient Proof of Ownership

Posting or emailing a copy of your work to yourself does not in itself prove ownership. There’s a lot of debate on this one on the Internet, but in my opinion, any method where only you hold the evidence of ownership does not make a strong argument in court.

Myth 5: Work That Does Not Have a Copyright Notice Is Not Copyrighted

If a country is part of the Berne Convention—which the majority of countries are—then using a copyright notice is optional. Online, adding “All right reserved” or the copyright symbol “©” to an artistic work can serve as a deterrent to those who think that everything on the Internet is copyright-free, but it is not a requirement.

Myth 6: the Website Owner Retains Copyright Ownership of the Work

This misconception is related to the term “work for hire” which is determined by the relationship between the employer and the person hired to do the work. Under the 1976 Copyright Act (PDF), if the web designer is an independent contractor, and no written agreement exists between the web designer and the owner of the website specifying that the work is made for hire, then the web designer owns the copyright to whatever he creates.

For clarity’s sake, it’s always a good idea to specify in the contract the rights the website owner has with regards to the graphics, images, source code, work up files and software provided by the web designer.

Myth 7: if I Don’t Make Money from It, There Is No Copyright Infringement

Not to be mistaken with “fair use”, an exception to the exclusive right granted by US copyright law that allows the use of work without the author’s permission when used in an academic or journalistic context.

Nonprofit or noncommercial does not necessarily mean “fair use”. One of the four factors determining whether the use of work falls under “fair use” is the effect of the use upon the potential market for or value of the copyrighted work.

In other words, if the use or publication of copyrighted work—whether it makes money or not­— affects the value of the work, then it is considered a violation of the copyright law. Again, this varies from country to country.

Myth 8: Sorry, That Name Has Been Copyrighted

As some degree of skill, effort and judgement has to go into a work for it to be copyrighted, copyright does not protect names, or for that matter, slogans, titles or phrases. However, a name may be trademarked if the name is used to promote or brand goods or services.

With regards to domain names, some countries, in an attempt to prevent cyber-squatting —registering, trafficking in, or using a domain name with bad-faith intent to profit from the goodwill of a trademark belonging to someone else²— have created specific anti cyber-squatting laws that go beyond the rules and regulations of trademark law.

Myth 9: If You Alter an Image, There Is No Infringement

One of the exclusive rights granted under copyright law is the right of the owner of the original work to make derivative works based on the copyrighted work. Altering an image without the consent of the owner is considered copyright infringement.

In some cases, where the modified image was altered beyond recognition, the court concluded that there was no copyright infringement. But this differs from case to case. The only way to guarantee that you are legally allowed to use an image and alter it is to contact the copyright owner and ask for permission, or purchase a license.

Interesting Links

• Your Design Is Infringing On My Patent: The Case Against User Interface and Interaction Model Patents and Intellectual Property
• UK Copyright, Designs and Patents Act 1988
• Berne Convention for the Protection of Literary and Artistic Works
• A History of Copyright in the United Sates

Related posts on our blog

• Lessons Web Designers Can Draw From the Fashion Industry
• How Beauty Brands Seduce You With Emotional Design
• Not Just Pretty: Balancing Emotion and Function
• Pen & paper or screen: context switching in design
• The paradox of technology and 5 ways to avoid it

It’s nothing new anymore and I bet by now everyone has at some point heard about it: User Centered Design (UCD). UCD is a way of designing with a constant focus on the user. Designers are no longer free to express themselves in their work for any means, but they are forced to focus on what the user will like. OK, so you all understand the idea behind user centered design. But is it really that simple?

Let me introduce you to 6 steps that will lead you towards UCD on a safe path:

Step 1 – Define your target group

I admit, this first step is obvious. But hey, who says we may not start off with baby steps? So let’s start with defining our target group. Find out who you are going to sell stuff to. How old are they? Are they men or women? Are they well educated or not? Are they long term customers or completely unfamiliar with your product? If your target group turns out to be anything but homogeneous, you might want to consider to categorize them. So for example you target mostly men, but they can be divided into experts and laymen.

Step 2 – Create Personas

Now this step is already a little bigger and requires either some practice or at least a good theoretical base. Personas help us to grasp our target group. See, we might have already defined typical users to be middle aged men with either a lot or little prior experience. But that is not enough to keep us on our path towards UCD.

If we really want to design for our prospective users, we need to get to know them ‘in person’. This might sound silly, at least to me it did when I first learned about personas, but trust me, it’s worth giving a try. Designing for 32 year old Pete, who can’t wait for the the product release with promising new features, requires a completely different approach than designing for 39 year old John, who would rather not get involved with technical staff but is required to by his job. Breathing life into a selection of characteristic users will make it so much easier for you to design for them. If you want, compare it with designing for any average middle aged man and designing for your friend, whom you know inside out. I bet it’s much easier to design for your friend, right?

Try to define your personas as detailed as possible but only include information that is relevant as a user. For example, feel free to mention if your persona likes sports, if physical activity is somehow relevant to your product. You can also use more indirect characteristics, like traveling. A love for foreign countries can stand for openness and an interest in new things.

Step 3 – Come up with user scenarios

Great, now that you have ‘met’ the people you are going to design for, it’s time to get some hands on user scenarios down on paper. User scenarios describe situations in which your users will actually use your product. These scenarios can be brief or very detailed, like a short story. They help you put yourself into the perspective of your users and truly understand what their goals are and how they use your product to achieve these goals. Besides, user scenarios pay attention to your users foreknowledge, their expectations, abilities, and limitations, but also environmental aspects that will help you to detect possible difficulties your users might encounter. With a series of thought through user scenarios, you made a big step into the right direction. And make sure you include all your personas as they probably all have their own way to approach your product.

Step 4 – Create use cases

While user scenarios describe the whole situation in which users interact with your product, use cases describe more specific actions. Usually a use case can be split into single tasks that a user needs to complete in order to achieve a defined goal. These tasks can be as specific as (1) clicking a menu button, (2) selecting one of the pull-down menu items, and (3) clicking on the selected item. You see, we start big and then we get step by step closer to the core.

Step 5 – Create prototypes & test with prospective users

You are about to take your last but not less important step towards UCD. According to everything you have found out so far, you should go ahead and create your first prototype. This first prototype does not necessarily be of high fidelity, but make sure you can justify every detail that you do include with what you know about your users. Remember that only now you start your first cycle of an iterative design process. Meaning based on the hypothetical knowledge about your users, you come up with a design. However, there is still a chance you got it wrong, so you do need to test what actual users think of your design. After a first round of feedback, you know if you really are on the right path. Then add more details and test again. Implement feedback and test again.

Conclusion

User Centered Design is great, but there is more to it that just including your prospective users in user tests. UCD starts long before you build your first prototype, even before you should think about the design. Defining and getting to know your users is an essential start of UCD. Being familiar with your users’ goals and how they will go about these goals is very important before you start your design. Test your design repetitively and with real users to verify your concepts.

Related posts on our blog

• From Plain User Testing to an Integrated UX Approach
• Web Designers Should Just Become Designers: an Interview With Don Norman
• Tailor a Perfectly Fitting Website in 6 Steps
• Pen & paper or screen: context switching in design
• The Usability ABC – part 7

In order for you brand or product to be successful, you need to appeal to your target group. There are countless appeals you can use: fun, friendship, relaxation, luxury, beauty, or sex, to name only a few. As long as it’s reasonably linked to your brand, anything can be used to draw attention to your website. With clever use of appeals, you can draw your customers in and take charge of their will. I admit this sounds a little scary, but really it is rather helpful for everyone designing for the Web.

Appeal to your target audience

Appeals can obviously be anything on your website that appeals to your target audience. With anything I mean really anything, from text, pictures, charts, testimonials, all the way to something simple as contact information. Elements that evoke any kind of feelings within your user, are potentially appealing. Most of the times you will want to make sure these feelings are positive. However, you can also use less positive appeals like disgust or pity to provoke your website visitors.

With appeals you can draw attention. This is one of the most important things when people first visit your site. You want to give them a reason to stay. Then, appeals can evoke emotions, awake desires, and even influence people’s actions.

Beauty brands appeal to us through emotions

Let’s have a closer look at how beauty brands use appeals to get to us. Major parts of their marketing are actually based on emotions. For example, the slogan of L’Oréal Paris is ‘Because you’re worth it’. Is there a better argument for purchasing a product? I don’t think so. This slogan does not only give us a good feeling because we treat ourselves, it also boosts our self confidence, because we are worth it. That’s fabulous. Another brand, Dove, used the perfect line ‘Real women have curves’ as slogan for one of their campaigns. In times of idealized body images of way too skinny models, Dove finally allows women to look normal again, to be happy with themselves. These brands sell much more than just their products.

For a better understanding of how beauty brands use emotions to seduce us, I took a close look at a selection of their websites.

L’Oréal Paris

As a classic and sophisticated beauty brand, L’Oréal Paris went for a simple, but elegant website with the picture of a beautiful woman in focus. In this case it is the perfectly styled Beyoncé. Her radiance and the intense look on her face literally draw me as website visitor into the page. L’Oréal Paris uses appeals like exclusivity, beauty, perfection, fame, popularity, attractiveness, elegance, and exquisiteness.

Dove

Then there is Dove. Real women have curves, remember? Dove is all about making their site visitors feel comfortable. I can almost feel the softness of their products on my skin by looking at the light and fresh design of their site. I’m joking, of course, but in some way their site really does make me feel good. I find appeals like comfort, harmony, balance, freshness, sympathy, and quality.

Nivea

I bet, we all know Nivea and we know it as a traditional and high qualitative brand. These emotions, I believe, are perfectly mirrored in the clean layout and color scheme of their site. I also detect appeals like harmony, trust, interpersonal relationships, beauty, and balance in their images. These are all emotions that Nivea wants us to feel, emotions they use to sell us their products.

Clinique

Next, I had a look at the website of Clinique. Clinique is a high quality and trusted beauty brand with a clean website that represents just that. The simplicity of the website reflects the pure and fragrance free composition of their products. I see appeals, like coolness, power, balance, purity, freshness and natural beauty.

Olay

Another popular beauty brand is Olay. Olay focuses on quality and uniqueness. The way they present the products on their site gives me a sense of superiority. They use appeals, such as exclusiveness, luxury, passion, and perfection to make people want their products.

Garnier

Garnier surprises with a very colorful and energetic website. The intense green and the quickly changing images convey a young and dynamic feeling. Garnier emphasizes appeals like youth, power, self confidence, freshness, nature, and beauty.

Axe

Axe, a brand that focuses more on their male customers than on the female, tries just as much to appeal to emotions than all the other beauty brands. I detect familiar appeals like coolness, attractiveness, resistlessness, freshness, and sex, but also different, maybe more male appeals like strength, fun, and play.

Untenable Assertion or True Perceptions?

I made a bunch of assumptions like Dove wants to make us feel comfortable, while with L’Oréal Paris we feel sophisticated. I identified appeals like beauty, passion, coolness, and many more. And I blamed the different brands to seduce us with these appeals so we would desire their products. I wonder, however, if I’m right with these assumptions and to be honest, I’m quite curious if you recognize any of them? To see whether I’m anywhere close to the truth and to check with your perception, I set up a test case with the different beauty brands. Please take a minute to participate in this quick Usabilla test, and you will shortly find the results here on our blog. I can’t wait.

Related posts on our blog

• How metaphors can improve your user experience
• Not Just Pretty: Balancing Emotion and Function
• The paradox of technology and 5 ways to avoid it
• How the leading Dutch news network was improved with user feedback
• The Usability ABC – part 7

In web design, getting the usability right used to be major goal. Now that most designers seem to master this goal, usability has become like a commodity: As basic requirement for a functional website, we find its presence throughout the Web. This shift of attention has created space in the field of web design and visual design has regained its central position. However, visual design in its new definition embraces more than just looking pretty. Don Norman split it into three levels; visceral design, behavioral design, and reflective design. Together the three can reveal the full power of visual design and guide you to a successful website.

The power of visual design. What is that?

The appearance of a design only makes up for one level of visual design, the visceral design. The other two levels describe how something works (behavioral design), and what the long term impact of a design is (reflective design). Combining these three levels, you can do anything with your design that you want:

• Make your design visual – Grab your user’s attention and influence their perception.
• Make your design effective – Lead your user’s attention and make sure they find what they are looking for.
• Make your design pleasurable – Allow your users to appreciate your website and have fun
• Make your design memorable – Build a relationship with your user, allow them to identify with you, and make sure they keep you in good memory.

Laying the foundation of your design

A good visual design does not fall from the sky. Before getting started with the different levels of visual design, there is some groundwork to do. You should have a solid foundation of knowledge about your internal design goals, the context of use, and of course your prospective users.

Start with drawing a clear picture of your internal design goals. Which image would you like to communicate? What are your values? Your visions? You need to have a good grasp of how you want people to see you, and how you can convey this image most effectively. A certain amount of predictability makes it easier for you to build a relationship with your users.

Second, define the context use. It will help you to know about the situations and circumstances in which your users visit your website. Which emotions might be involved? Which role do you and your users play? Being aware of the context of use will make it easier for you to reach out to your users.

Final preparation: Get to know your users. They are the ones who will purchase and use your product. So make sure you know what they want, how they are going to use your product, what matters to them, and what doesn’t. Without knowing your users, it is quite tricky to design something that’s easy for them to use and pleasurable at the same time.

Find the right balance

After figuring out what you want and doing your research about your users and the context of use, it’s time to find the right balance within your visual design. You can try to find a designer who is really good on all three different levels, but those are rare as unicorns. Your best bet is to get a team together with multiple designers with different strengths. It also helps to include designers in the user research and product development. This way, they are involved in the whole process, and they can include requirements in their creative process from the very beginning.

Here are some examples of websites that I believe have found a perfect balance between emotion and function. First of all, there is Adidas, a popular sports brand. With a brand like this, you can easily focus on emotions and offer a colorful, dynamic, fun, and memorable design.

Now if you offer funeral services on your site, you would want to be a little more sympathetic and use a very clear and usable design. Of course it should also be aesthetic, but mourning website visitors will most likely have their priority on discreet support and quickly finding what they are looking for.

Another example is a luxurious car brand, such as Porsche. You would want a clear website that is very easy to use to reflect the quality of your product. At the same time you want to evoke a bunch of emotions, like beauty, elegance, security, and so on. You also want visitors to identify with the brand build up a lasting relationship with you.

Of course, there are also some negative examples, where the right balance between emotion and function has not exactly been found. Jakob Nielsen is one of the most popular figures in the field of usability. However, his website really only focuses on usability and leaves aside all emotional aspects. A little emotion, I believe, wouldn’t do any harm.

Then there is Amazon. Sure, there is no doubt that this website works like hell and every single element has been tested for conversion before being placed for good. However, pretty is different, don’t you think?

Last but not least, there are websites like the webdesignerdepot. For sure this website looks nice and it is memorable because of this unique appearance. But most of what you see and especially of what catches your attention is not meant to help you use the site. You actually need to scroll down the page to find any sort of navigation.

Conclusion

When you design your own website, make sure you find the right balance between the different levels of visual design. This balance will depend on the specific context of your website. You don’t need to counterbalance the three at all costs. But you do need to beware of your own self image, who your users are, and the context in which these users visit your website. Then balance visceral, behavioral, and reflective design against each other to make them work for you.

Related posts on our blog

• The paradox of technology and 5 ways to avoid it
• How the leading Dutch news network was improved with user feedback
• 5 Quick wins for your website’s user experience
• The power of colors on the Web
• How user scenarios help to improve your UX

A fashion and a web designer have a lot in common. They both design. But they also try to make something that is practical and pretty for their user. They even follow the same steps to get there. However, designing fashion is much more hands-on than designing a website. Fabrics are physically manufactured into a tangible piece of clothing. A web design on the other hand is made of digital pixels that are arranged on a screen. So, where am I getting with this?

It’s simple. By applying the tangible metaphor of tailoring clothes to designing a website, we can make this rather abstract process more concrete and the different steps involved easy to follow. Let me show you how.

6 Steps to a perfectly fitting website

1. Take measurements

Source: jayespace.com

As a fashion designer, I start a new design by taking measurements from the model I want to design for. This makes sense, because I wouldn’t create something first, and then see who it fits, right? For example, I would like to design clothing for a female person between 20 and 35 years of age. This woman is of average height and weight. She likes trendy, but casual, and most of all comfortable clothes.

As a web designer, I kind of do the same thing. I do some user research to find out who my users are. I’m interested in their age and prior experience with my own or similar products. I’m also curious how they are going to use my product and which goals they have when coming to my website. I want to perfectly fit my design to their needs.

2. Decide on a piece of clothing

Source: fashiontechniques.com

Next thing I do as a tailor, I decide on a piece of clothing. You will agree that a shoe is a piece of clothing, but not all clothing are shoes. While shoes have a sole, some fabric around the foot and most likely shoelaces, a hat might be formed out of one piece of fabric.

As a web designer, I need to make the same decision. A website can have different purposes. There are web stores, blogs, social community sites, and so on. What is it that I want to offer? Do I offer information? Do I want to sell something? Do I have one product or many? Do I want people to just consume on my website or do I want them to act? Maybe even react? Or interact?

3. Know the trends

Source: centrefashion.com

One of the things that make me a good fashion designer is that I know what people want. However, this is not something that just comes to me. I have to keep my eyes open all the time and observe the world around me. What do people wear? What are the trends? Which colors go with the season? I get inspired and I want to make sure there is a market out there for what I do.

In web design, it’s the same thing. For a new design, I do a benchmark to see what others are doing. I want to know what works and what doesn’t. I look at successful or popular websites and sometimes I can adapt ideas to my own design. Other times, I learn what I should not not. Anyways, it helps a great deal to learn from best practices instead of reinventing the wheel over and over again.

4. Be authentic

Yves Saint Laurent’s 1960s Mondrian collection has never gone out of style (Source: barbaraanneshaircombblog.com)

As a fashion designer, sometimes I wonder why people still like my designs. There are a couple of things I can’t stand, like ruffles or silky fabrics. I never include these in my designs. On the other hand, I love buttons and zippers and I use them a lot. I guess the answer is simple. People who like my fashion, like my style. Probably they don’t like ruffles either, but they love buttons just as much as I do. So if I stick to my style, people will continue to like my fashion.

As a web designer, I also have my principles and I see it as my responsibility to hold on to them. Actually, in web design, it’s more a matter of ethics. There are things I wouldn’t do, like design for a political party I disagree with, or build a whole website with flash. At the same time, there are things that I think are very important for every website, like a clear structure and accessible content. I will always try to include these. Once people know your designs are authentic, they will trust you as a designer.

5. Sew and fit

Source: maisonsdumonde.com

When tailoring a piece of clothing, it is important to pause every now and then to see if it fits the model. Even though I have my measurements, I want to be sure I’m getting it right. Imagine I finished a pair of pants and later found out they are too short. I would have to do them all over again.

As a web designer I face the same risk. With early and repetitive user testing, I collect feedback on the different stages of my design. This way, I know immediately if I did something wrong, if something is not clear to my users, or if I missed something. I might just have misinterpreted some results from my user research, which I can now revise. This step can save me lots of trouble later on.

6. Conquer the runway

Source: finalfashion.ca

Finally, as a fashion designer, I proudly present my design on the runway. Here is where I get my recognition and final feedback. Did I do a good job? Do people like it? Will people buy it? If yes, I can make money with my design.

As a web designer, I also have this final evaluation. Once my design is live, I see if it works. Does it drive the traffic I expect it to? Do I reach the conversion I want? If yes, I can make money with my design.

Mark Twain knew it all along

• Clothes make the man. Naked people have little or no influence on society.

— Mark Twain (American Humorist, Writer and Lecturer)

The way people perceive us strongly depends on our looks. Just like we easily tend to judge others by their appearance. On the Web, its the same thing. Based on the design of you website, people will decide whether they like or trust you, or recommend you to others. Make sure your website gets the recognition it deserves, and tailor it so it perfectly fits your users.

Related posts on our blog

• Lessons Web Designers Can Draw From the Fashion Industry
• How the leading Dutch news network was improved with user feedback
• 5 Quick wins for your website’s user experience
• Re-order your test pages
• Towards User Centered Design in 5 Steps

Which approach to design works best for you? Design is a delicate matter. It is not only a question of taste, but just as much a question of approach. How designers go about their work is highly personal. Almost every approach will be different. At the same time, there is one thing I see all good designers do. They use pen & paper and digital media interchangeably, and they know when to switch between the two.

Yoeri is our head of design and a perfect example of this. He sketches like a madman and he is slowly taking over every wall in the office. In an interview I talked to him about his paper habits and his personal approach to design.

Interview with Yoeri Hokken, Web and UX designer at Usabilla:

When do you choose pen and paper over your mac?

During brainstorming sessions with the team, we come up with many fruitful ideas. I like to capture these ideas with pen and paper. This way I won’t forget anything and I can always go back and have another look. Besides, I can easily change or add something later on.

I always start a new design with pen and paper. If I could give fellow designers one piece of advice, this would be it. Hands on sketching offers so much more space for creativity than you will ever find on a screen. You can come up and catch many different ideas and variants in no time.

How do you sketch? Do you use anything else than a pen?

The way I sketch mainly depends on the kind of sketch. For example, if I sketch wireframes for a web page, I focus on the outlines and work with standard elements (such as a box with cross to represent a picture). When I sketch a button, I sketch in more detail or I add notes that later remind me of important features (like the ratio for rounded corners or the opacity for a gradient overlay).

I used to sketch with different colors, because I thought that makes it easier to add details, such as shadows. Now, I only use with a black fine liner and that works just fine for me.

Note: If you want to read some more about sketching techniques, check out The Messy Art of UX Sketching on Smashing Magazine.

When and how do you transfer your sketches back to the digital interface?

As soon as I’m happy with my sketches, or if I feel that I have sufficient sketch material, I start to work out a digital version. However, I never scan my sketches, but leave them next to my screen and use them as reference.

Do you only sketch once in a design process or do you go back and forth between paper and screen?

For me, both sketching and the digital design are a process of trial and error. I make a sketch, which I discuss with the UX team. Based on this feedback, I usually make some adjustments and develop a digital version. This digital version, I again discuss with our CEO. If there are minor adjustments, I adapt them in the digital version. For major ones, such as subsequent changes in the structure, I usually go back to pen and paper.

There are several tools available to e.g. digitally create wireframes and prototypes. Do you use any of them?

I used to work with a couple of these programs, but now I only work with Photoshop and Illustrator. My designs are then taken over by our front-end developer who creates both low and high fidelity prototypes in no time.

Where do you see the advantages of pen and paper?

I consider pen and paper essential tools for a designer. They force you to leave details, such as colors, gradients, and shadows for what they are and focus on the actual interface design. You come up with several versions in no time and you can go back to any of them later on. Besides, you can easily hang them up on a wall in order to compare and take in different versions.

When you design on your screen, you easily focus on one single, but detailed design, and you have limited possibilities to save different versions.

Do you also see disadvantages of pen and paper?

With paper scribbles, I sometimes get proportions wrong. I might be happy with my scribble and I see the perfect layout before my eyes. However, when I digitize it, there might just be too little or too much space, so it doesn’t turn out as perfect as I expected.

Digital layouts on the other hand are always precise. You can easily work it down to the pixel and implement all the details you want.

Have you always approached design the way you do now?

Actually, I have gone through quite some changes as a designer. For example, I have created my own style of sketching. This means I know how to read my sketches, while others might need some extra explanation.

My digital design process has also changed. I did not use to start every design with pen and paper, but I have learned that this turns a digital design into an endless process of trial and error. Besides, I now work with a lot of tools that make my life easier. For example, I create a color palette with Adobe Kuler and I use the info tab in Photoshop to position elements in my design. Besides, as a web designer, I have learned to I think more in terms of html code. For example, I already think what an h1, h2, a div or a link will be. This way, my work becomes more consistent.

Related posts on our blog

• Lessons Web Designers Can Draw From the Fashion Industry
• Not Just Pretty: Balancing Emotion and Function
• The paradox of technology and 5 ways to avoid it
• My time as an intern at Usabilla
• Many a little makes a mickle

Does our life become easier with every new invention on the market? I don’t think so. New technology presents us with great possibilities and limitations at the same time. Let’s have a look at this quote:

• The same technology that simplifies life by providing more functions in each device also complicates life by making the device harder to learn, harder to use. This is the paradox of technology.

— Donald Norman, The Design of Everyday Things (1988)

What Norman said about technology in 1988 is still valid today. Our economy, educational system and our social interactions have changed dramatically with available technologies. In order to stay competitive, products become more and more ingenious, their features adding up. The idea is to make our lives easier. But does it work?

New technology is a paradox: It is both liberating and confining at the same time. I will have a look at various aspects of this paradox and show you five ways to avoid them and still offer popular and innovative products.

The paradox of technology

In order to keep pace with the fast technological progress, we need to keep it rolling. We need to be open minded and flexible to get involved with all the new stuff in the first place. We need to use it a lot in order to learn it, and we need to filter features and put those that we can’t implement in our work process on our growing mental ‘ignore-list’. If we manage to do all that, if we can make a sufficient selection and focus on what is important, we can profit extraordinarily from increasing complexity. If we can’t, we get distracted, confused, and eventually pay with a decreased of efficiency.

New technologies enable us to access enormous loads of information. The Web, as an insatiable platform, offers information about pretty much anything. However, due to limited control of what people make available online, we constantly rely on our own judgement to select what’s relevant. This selection requires a certain degree of media literacy. If we don’t know how to efficiently approach the Web with all its content, the logical consequence is an information overload that we will most likely fail to handle.

We also get lazy using all these gadgets. I’m not saying this is a bad thing. I very much appreciate my smart phone and all the things that come with it. But every now and then, I get scared of how addicted I actually am and even worse, how dependent. I’m not sure if I can still manage to get things done if it wasn’t for all the to-do lists and reminders my phone keeps track of. I literary feel stripped down if I don’t have my phone with me and I almost panic if for some reason I can’t access my emails. I feel that using my phone as much as I do makes me stop using my brains.

The boundless and easy communication through social media also has its down side.
We tend to forget how great and valuable it is to talk to someone in person. When we communicate through different mediated channels, the messages we send will never be as rich and clear as those we send face to face. Besides, being connected with everyone at any time makes it difficult to live in the here and now and we loose focus of the people we really care about. We spend so much time in virtual worlds, not because we like it there so much, but because we have pushed to the back of our minds how great the real world is.

5 ways to avoid the paradox of technology

The keyword here is: focus. Focus on your users. Focus on your main functions. Focus on what really matters. More is not always better. Let me show you how to avoid the paradox of technology and still offer popular and innovative products.

1. Know who you design for

Know the people you design for. Never start programming or designing before you have defined the functions and features that your users really need. If you don’t know your users, you will never be able to minimize or even eliminate the paradox they see in technology. Create personas and get to know your users. Find out what they want and how they will use your product. Come up with use cases, create prototypes and test your ideas.

2. Don’t distract your users

Keep it simple. These three words can make all the difference. After you know what functions your users need, it is your task to combine them in a usable way. Make sure users find and recognize all functions. Omit features, that don’t increase the overall quality of your product but might lead to distraction or confusion. Don’t be scared or too proud to let ideas go. Even good ideas might just not work. By leaving some features out, others become more salient and possibly more intuitive. Ask users to prioritize and categorize features to be certain you make the right selection.

3. Keep information to the point

Only offer information your users really need. People come to your site with a goal in mind. Your job is it to make them reach their goal as quickly as possible. This includes anything from making your site easy to find in search engines, to a clear presentation of your content. Know what your users look for and then offer it to them the way they expect to find it. And keep in mind that their they are anything but simple.

4. Support your users, don’t make them superfluous

This might have some overlaps with what I wrote earlier, but I think it’s important enough to give it an own paragraph. No matter what you offer, be it a service, a tool, or a tangible product, make sure it’s relevant. With relevant I don’t mean extremely important or extremely innovative. I mean that you should offer something your users can actually use for something useful. Try to support your users in something they do or even do it for them, but don’t try to do something they can really do themselves. To some extent, you can look at this as the responsibility of a designer to support us with what we do, without making us superfluous.

5. Focus on the user experience

With the wide range of new technologies, our lives seem to become increasingly impersonal. We communicate, but seldom face to face. We interact, but not with each other. We consume, but we don’t pause to appreciate. As a designer, you have the chance to make products that are user friendly and therefore easy to use. But you can also make products fun and personal. You can create a user experience that makes us enjoy to learn new things and face new technologies. With a great user experience, you can convince anyone of your product, regardless how many features you had to leave out in the process.

I believe that new technology is a paradox. It offers us great possibilities and at the same time, it confines us in what we do and how we do it. Through a focused product design and the way we select and offer information, we can minimize and even eliminate this paradox for our clients.

Leave a comment below, or join the discussion over at Hacker News.

Related posts on our blog

• Not Just Pretty: Balancing Emotion and Function
• How the leading Dutch news network was improved with user feedback
• Transparent Usability
• 5 Quick wins for your website’s user experience
• The power of colors on the Web

Cultural characteristics, such as norms or values, influence product design. Most people can give an example of cultural influences when it comes to tangible products. For instance, toilet seats are designed differently in the US and Thailand. Online, these cultural differences might be less explicit, but this does not mean they don’t exist. Just as with other products, the way we interact with a website is in large part defined through our culture.

In order to ensure that web sites are globally accessible and equally appealing to different cultures around the world, user experience designers need to be aware of how culture affects the way we think, communicate, and consume information. I’ll explain how culture affects us in terms of visual design, navigation design, and information design.

Cultural UX differences - Worldwide Internet Usage

Visual design: metaphors and color preferences

Visual design is the graphic treatment of interface elements. It is the ‘look’ in ‘look-and-feel’ (Garett, 2000).

As in the real world, the digital world uses colors and metaphors to enhance user experience. Metaphors help users associate familiar ideas and concepts with less familiar ones, while colors have the power to influence the way we perceive something.

On the web, designers use color for various purposes—to draw attention to certain elements on a page, to make a page more visually attractive, to create a desired mood, or to make text easier to read.

However, research in the cognitive sciences has demonstrated that both metaphors and colors are culture specific. A good example are the different meanings associated with the color green in the Islam and Irish cultures.

While in Islam green has always been a sacred color and is used in a number of Islamic flags, in the Irish culture green has had various associations and meanings throughout history. The shamrock for example, was a symbol of rebellion against the English in the 19th century. The three-leafed clover has also been associated with Saint Patrick who is said to have used it to explain the holy trinity.

The official flag of Islam, the shamrock (Ireland’s most recognized national symbol), and the Irish flag (the color green symbolizes Irish republicanism)

Visual representations mean different things in different cultures. By being aware of these differences designers can communicate more effectively with their target audience.

Navigation design: culture and navigation elements

A clear and intuitive navigation helps users find what they are looking for as efficiently as possible. Various studies on how navigation elements are being used among different cultures show that these vary according to the communication style of the culture.

For example, a study conducted by Dormann & Chisalita (2002) which uses Hofstede’s masculinity cultural dimension to categorize web sites from different cultures, found that countries with a higher masculinity index (masculine countries) had fewer links per page than countries with a lower masculinity index (feminine countries).

Another study, comparing high context and low context styles of communication, found that Japanese web sites preferred to use images instead of text to represent links while Scandinavian web sites opted for plain text.

Culture influences how we access our memory, process information, and navigate through a website. UX designers need to be aware of these cultural differences to offer a navigation design that meets the specific interaction requirements of their target group.

Information design: culture and the organization of content

Ying Dong and Kun-Pyo Lee (2008) compared how East-Asian (holistic thinkers) and Westerners (analytic thinkers) perceive a website. The eye-tracking maps that resulted from the study showed that people from these different cultures browse web pages differently. While Chinese and Koreans scan the entire page to get an overall picture, Americans focus on information groups.

Chinese eye-tracking map. Green denotes the start of eye movements and red the end. Ying Dong and Kun-Pyo Lee (2008)

Korean eye-tracking map. Green denotes the start of eye movements and red the end. Ying Dong and Kun-Pyo Lee (2008)

American eye-tracking map. Green denotes the start of eye movements and red the end. Ying Dong and Kun-Pyo Lee (2008)

Based on their findings, Dong and Lee propose that when designing web pages for holistic thinkers (such as Chinese and Koreans), UX designers should pay attention to the harmony between the foreground and background as well as the relationship between the different content areas.

Sohu.com, a popular portal in China

When designing for analytical thinkers (such as Americans), Dong and Lee suggest to emphasize on independent content areas.

Yahoo.com, a popular American portal

How content is organized on a web page affects the ease with which users are able to consume and digest the information presented to them. By focusing on the target audience’s specific cognitive style, designers can enhance the perception and usage of a web page.

Cross-cultural challenge

There is no question that cultural differences pose a challenge to global web design. By understanding and paying attention to cultural preferences from the outset, user experience designers are better equipped to cater to an international audience. From a business perspective, developers are able to determine whether or not in some cases a localized design might be a better solution.

As the list for further reading beneath suggests, the information I covered on this topic is just the tip of the iceberg. I would really like your opinion on this cross cultural challenge. Did you ever have to adapt a design for another culture? Can you recall misunderstandings that were easily explained by cultural differences afterwards? Please let me know!

Further reading

Cultural theorists:

• Nisbett and Norenzayan (2002) Culture and Cognition.
• Riding & Rayner (1998) Cognitive styles and learning strategies: Understanding style differences in learning and behaviour.
• Hofstede, Geert (1997) Cultures and Organizations: Software of the Mind: Intercultural Cooperation and its Importance for Survival.
• Trompenaars, Fons, and Charles H. Turner (1998) Riding the Waves of
  Culture.

Web cross-cultural studies:

• Ackerman, S. K. (2002), Mapping User Interface Design to Culture Dimensions. Paper presented at International Workshop on Internationalization of Products and Systems (Powerpoint presentation)
• Callahan, Ewa, Cultural Similarities and Differences in the Design of University Websites.
• Dormann & Chisalita (2002), Cultural values in web site design.
• Schmid-Isler, S. (2000). The language of digital genres-a semiotic investigation of style and iconology on the World Wide Web.
• Würtz, Elizabeth, A Cross-Cultural Analysis of Websites from High-Context Cultures and Low-Context Cultures.
• Ying Dong and Kun-Pyo Lee (2008). A Cross-Cultural Comparative Study of Users’ Perceptions of a Webpage: With a Focus on the Cognitive Styles of Chinese, Koreans and Americans.

This post was written by Anneke Schapelhouman, our new online communications expert. Say hi to Anneke on Twitter, or leave a comment.

Related posts on our blog

• Update: Simplified feedback & enhancements in analysis
• Improving usability for participants
• How metaphors can improve your user experience
• How the leading Dutch news network was improved with user feedback
• Design for Conversion report – persuasion on the web in Cologne

If you like to read about UX, you probably have at least one book that was written or published by Lou Rosenfeld. Aside from being a publisher, Lou is stil going strong as an independent information architecture consultant. We thought it would be interesting to hear his thoughts on the development of UX as a field, and see what he is up to in general.

As a publisher of UX books and numerous UX-community related initiatives, you must have a good grasp of the UX community. What do you think are the most notable changes in this community and why? And can you predict how the community will evolve in the upcoming year?

The remarkable lesson for me regarding the UX community has little to do with where it’s going or where it’s been. It has everything to do with where it is now.

Gadflies like me are visible in UX-related publications, on related discussion lists, and at UX events. (In fact, I’ll publicly confess right here and now to being a conference slut.) But the vast majority of UX people—the “dark matter” of the community—aren’t even lurkers. They’re people who go about quietly doing their work—quite expertly in many cases—without being engaged in what many of us consider to be the UX community. In fact, I’d best that most of them don’t associate themselves with UX, or even know the term.

I imagine that Usabilla’s goal, like mine as Rosenfeld Media‘s publisher, is to reach that “dark matter” and make a case to them to engage more in the community. It may be a fool’s errand, but it’s worth the effort, as we’ll all be better off for it.

As an information architect, you work with messy information problems with big companies. Do you still touch base with UX designers in small companies and startups?

Sure, but mostly in contexts other than consulting—like at the UX happy hour I help organize here in Brooklyn. Or while gathering around the UX Bookmobile that Rosenfeld Media brings to many conferences.

What challenges and chances do you see in the rapid evolution of the information ecosystem (think API’s, Big Data, etc).

Two words: service design. APIs can help catalyze more unified information ecosystems, but they’re only a piece of the puzzle. You still need at least minimal design to imagine new possibilities and tie all these channels together in a meaningful, engaging way. I think service design may offer guidance to those of us who are trying to design the infrastructure needed for vibrant, successful information ecosystems.

Do you have any cool books up your sleeve?

Oh, gosh. Now that Search Analytics for Your Site is finally done, I’m finished with writing for the foreseeable future. But Rosenfeld Media has, at this moment, 14 cool books in the pipeline (and more new book signings on the way). Our next two titles, John Ferrara’s Playful Design and Rachel Hinman’s The Mobile Frontier, are looking fantastic. Not that I’m biased or anything.

How do you balance your work as an information architect and a publisher?

Oh, that’s easy: I work about 80 hours per week (much more on publishing than consulting). The good news is that I love my work, so I really don’t mind. The bad news is that I love my kids even more, meaning I’m constantly missing out on getting a decent night’s sleep. But you only go around once…

You must know a lot of interesting people. Who should we follow on Twitter?

That’s really not a fair question. I’m following 1,492 people. Many of them are, indeed, really interesting. Some who immediately come to mind—mostly because of tweets from the past 24 hours or so—are @aaroni268, @becbury, @james3neal, and @danachis.

Thanks for the great questions!

More about Lou

Lou Rosenfeld is an independent information architecture consultant for Fortune 500 corporations and other large organizations, and founder of Rosenfeld Media, a publishing house focused on user experience books. He has been instrumental in helping establish the fields of information architecture and user experience, and in articulating the role and value of librarianship within those fields. Lou is co-author of Information Architecture for the World Wide Web (O’Reilly; 3rd edition 2006) and Search Analytics for Your Site (Rosenfeld Media, 2011), co-founder of the Information Architecture Institute, and a former columnist for Internet World, CIO, and Web Review. He blogs regularly and tweets @louisrosenfeld even more so.

Related posts on our blog

• Not Just Pretty: Balancing Emotion and Function
• The paradox of technology and 5 ways to avoid it
• How the leading Dutch news network was improved with user feedback
• 5 Quick wins for your website’s user experience
• The Usability ABC – first definitions