WEB DESIGN : THREE GOOD EXAMPLES

NETFLIX

https://www.netflix.com/pt-en/

This website for me is synonymous with the expression point, blank, period.

It is mostly composed by only one webpage, and when you enter, even if the user doesn’t know anything about Netflix, it is immediately perceptible through the background image that the theme is about movies. This one, as it is faded, does not enter in visual shock with the other components.

As expected, we see the logo (even if it is on the left and in a smaller size than usual) and a call to action for the service consumer – Sing In” (Principle of Expectation).

Regarding the visual language, the red and black tones (colour of the Netflix logo) are highlighted, which also complement with the colour, size and font of the letter that is used throughout the website. According to the importance and intuitive action intended by the potential consumer (user), it is also played accordingly with the font size.

Regarding the information content, is used a straight-forward and clear language, answering the potential consumer’s initial questions – what it is, how and on which devices I can see and whether I can cancel the service.

In addition to the Sign In button we can see another call to action directed at the user – Try 30 Days Free – which also diverts attention from the question “what is the price of the service”. It is also curious to see that the blank field to fill in the email is both directed to those who want to start the trial version of the service and simultaneously to those who want to re-use it. In terms of efficiency, it is like killing two birds with one stone, whether for the creator or consumer.

As the information is arranged in a single webpage (which is not long), the user is immediately prompted to scroll down. As we go down, we start to realize the sense of hierarchy of the information.  It presents other ways to use the service and how to access it, always using a single image or video efficiently.

It ends with the FAQ’s, where instead of using the acronym, the creator chose to put the actual description – Frequently Asked Questions – not giving space to cause any doubt to the user. Also, the creator gathered all the information regarding to each question – Hick’s Law Principle – where it’s  in a more complete than what were previously mentioned and take the opportunity to inform the price and payment plans of the service.

Again, right after the FAQ block, they strategically put a call to action – try 30 days free. It is the perfect place for a new opportunity to subscribe to the service.

Lastly, we have the remaining information that we intuitively expect to be on the page footer (contacts and corporate information), returning to the Principle of Expectation

The simplicity of the website – Ockham’s Razor Principle – makes the content very accessible mand easy for any individual who wants to navigate through the page, where it gathers all the main and most important information about the website.

MIXCLOUD

https://www.mixcloud.com/

This website is more dedicated to a niche group, more precisely the DJ’s and/or creators of different radio shows, regarding the genre.

For that same reason, you can see that the navigation is oriented in a sense of discovery. It is almost like saying that the structure of the website is the one that guides me in order to find what I want according to my tastes and affinities.

Proof is that after the brief initial introduction, where the next group of displayed on the main webpage directs me to choose a specific genre of music.

The website besides following the model of a single webpage (not too long), also plays more with the colours, as well as incites to a better interactivity with the user – as for example the change of colour when passing the mouse over the different styles of music presented.

The header which is fixed and clearly follows the principle of expectation. As for the footer, it also follows this principle, but with less information than usual.

Along the initial webpage we can also see the aggregation of different groups of information – intro, discovery/search from other channels, introduction to other followers, download of the app – back to the Hicks Law Principle.

Simultaneously introduces the user to the navigation in social media mode, presenting followers and hashtags of music styles connected to each one of them.

FARFETCH

https://www.farfetch.com

This is a leading e-commerce company for luxury brands.

By navigating on the website, you quickly realise that compared to the more affordable shop websites, there is a respect for the way the user navigates on it. Instead of bombarding with different campaigns, it reserves more space for the user search for what they want.

Starting with the homepage, there is a “calm” that is combined with the white background and neutral tones, as we are dealing with various images and videos as content.

It immediately separates the navigation choice by gender – women’s wear and men’s wear – with two images that are clearly representative and fit visually well according to the profile of the brand and the action intended by the user. Right below these same images, we can notice the Hicks Law Principle, adding by line the clothing/accessories categories and some brands (probably the most purchased).

In this whole block, the Principle of Hierarchy is also clearly noticed.

To help even more with an easy navigation for any user, right after we can see everything regarding this – FAQ’s, How To Shop and Need Help?

We also can see clearly the Principle of Expectation, starting with the (fixed) header that has the company’s name, login icons, shopping bag and wishlist and search bar. On the left side, we find the different categories of clothing (already including the option for children) and the language. On this last feature, it shows again the access to any individual. Since this is a website that delivers to several countries, by choosing to place as an icon the flag of each country, draws more attention to the user. Clicking on it, gives us the option to choose the shipping destination, language and currency of the country simultaneously (again the idea of killing two birds with one stone).

Also on this topic, another option that I found extremely interesting, is that when we choose the UAE flag, since the Arabic language is read from right to left, then the display of the page display changes accordingly.

Regarding the footer we then see all the contacts, corporate information, social networks and other necessary info.

Navigating through the other pages, I notice that they make sure to give the most complete and essential information about each item, whether it is regarding the composition or shipping details. All aggregated in the corresponding tab, but easy to navigate from one to the other.

When we only navigate through the sales items, we can filter through different features.

There is also a great combination of editorial content in images and video (reminiscing fashion magazines or blogs) with the articles for purchase, that are also organized according to each theme.

Leave a Reply

Your email address will not be published. Required fields are marked *