RP5 Websites that Break The Rules

Brutalist Design in modern architecture

An example of brutalist design in a cafe interior. The raw functionality of the interior components become a feature in this environment. In brutalism the exposure of industrial materials are celebrated instead of being covered. In the example above the air con wires and housing are exposed, metal beams and a brick wall are simply glossed over and a concrete slab roof, with lighting and hanging plants to compliment the above features. This type of design in a cafe setting showcasing simple industrial features creates a new point of interest for the viewer, changing something functional or nostalgic into an interesting raw and simple form of visual expression.

The same principles can be applied to brutilist design on websites, where developers purposefully create websites which are minimal in functionality, raw, nostalgic with simple features.

Embassy Of Internet

The Embassy of Internet can be termed as a brutalist website. It is a simple website layout with basic interactivity. The page has a limited colour pallete of blue, white and grey. The text is non decorative and plainly informative. When accessing the other pages, a simple numbered list is used, in most cases in descending order of size, which is unusual of a normal list. It uses roman numeral and numbers to list, this could be to create a visual point of interest or as a purposeful mistake to make the website more memorable. The information on the page is limited with no images, links, video, animation, contact information or call to action. It could give the impression of a website in the making, with the bare information of a website that is yet to be fully developed.

When looking at the HTML of the page, the code is short at only 64 lines, with a basic structure. There is no use of cascading style sheets (css) and modern website template layouts. No advertisements. The websites could be designed by people with little knowledge, able to deliver the message quickly and easily.

There are many benefits for utilizing a brutalist design in this website example. The lack of high resolution images and videos means that loading times are reduced, this could be beneficial to users with poor internet connection or old devices.

Studio Job

The Studio Job website could be classes as a brutalist style as it defies the normal design principles of an eCommerce website. This page is highly interactive, colorful and fun, with a mixture of photos, icons, interactivity and animation. Most notably the mouse button changes icons. It is a middle finger, which bends as if breaking when clicking on a menu, changes to a basket when hovering over the shop. Depending on it it’s hovering over the shop and there is even a small interactive game where the mouse in a target and can be used to shoot letters. This creates feelings of nostalgia for the user, it is reminiscent of using the internet in the early 2000’s, where it was common to use HTML to edit MySpace for maximal personalisation.

This page is completely full and over stimulating, it seeks to be memorable to the users. Every space on the website has been utilised to maximum capacity, even with consideration for resizing the page (image 3 shows a penguin resizing loading graphic) There are no clear layout rules followed as grids are overlapping and different shapes and sizes, creating an eclectic. Even the HTML code is decorative, with the actual code for the website condensed into line 25, making it difficult to read.

Hotel Shanghai

Hotel Shanghai is a nightclub events website. The most noticeable brutalist website design is the use of a mouse parallax to display 2d images cropped into geometric shapes and layered to give a 3d effect. these move quickly in response to the users mouse movement, making the website striking but difficult to navigate, this would be particularly difficulty for users with accessibility issues.

The website has a scrapbook cut and paste aesthetic which has an early 2000’s nostalgia. It doesn’t follow the usual polished templates of modern custom build websites.

References

Home. n.d. [Online] Available at: http://embassyofinternet.org/ (Accessed 01 November 2022)

Home. n.d. [Online] Available at: https://www.studio-job.com/shop (Accessed 02 November 2022)

Home. n.d. [Online] Available at: https://hotelshanghai.de/club (Accessed 02 November 2022)