illustration essay book

16
M INIMALIST D ESIGN W EBSITE N AVEED A SHRAF

Upload: naveed-ashraf

Post on 13-Feb-2017

169 views

Category:

Education


0 download

TRANSCRIPT

Page 1: Illustration essay book

M IN IMAL IST

DES IGN

WEBSITE

NAVEED ASHRAF

Page 2: Illustration essay book

This essay will focus on how minimalist web design draws the viewers’ attention and guides the eye

showing why minimalism is important in web design within the complexity of today’s design world.

Is contemporary minimalism important in web design within the complexity of todayʼs design

world?

M IN IMAL IST

Page 3: Illustration essay book

The essay will address the challenges of why

minimalism is still important in web design in

a complex contemporary design industry,

addressing seven key pillars of minimalist

design. Case studies of various uses of

minimalist design will be used. These will be

compared with uses of complex design to

argue that minimalism has a crucial place for

competitive web design in a world full of

distraction and busy lifestyles.

Web design used to be very simplistic or

minimalistic due to limits in coding language

(HTML) then got more complex with more

intricate codes (CSS and Flash Action Script)

and now has gone full circle to be simple

again but using more complex scripts.

However, the focus of this essay will address

visual minimalism. Although coding language

is more complex web designers are choosing

to make web pages simpler. In the past, for

example in the ‘Art Nouveau’ period, design

was very complicated and decorative. The

1960’s designs became simpler, using straight

lines inspired by the Bauhaus movement,

using black and white

and primary colours.

Minimalism was even

simpler, designs were

spacious and made use of

light.

Minimalism had a great

influence on architecture,

using clean lines, straight

edges, space and light.

Surroundings were

important and often

complimented the

minimalist design. This

goes hand in hand with

minimalist philosophies of

living focusing on the

statement “Omit needless

words” (Strunk, 2015)

Strunk & White’s theory of

minimalism.

“IN THE 1960’sDESIGN BECAMESIMPLER”

1

Page 4: Illustration essay book

The essay will address the challenges of why

minimalism is still important in web design in

a complex contemporary design industry,

addressing seven key pillars of minimalist

design. Case studies of various uses of

minimalist design will be used. These will be

compared with uses of complex design to

argue that minimalism has a crucial place for

competitive web design in a world full of

distraction and busy lifestyles.

Web design used to be very simplistic or

minimalistic due to limits in coding language

(HTML) then got more complex with more

intricate codes (CSS and Flash Action Script)

and now has gone full circle to be simple

again but using more complex scripts.

However, the focus of this essay will address

visual minimalism. Although coding language

is more complex web designers are choosing

to make web pages simpler. In the past, for

example in the ‘Art Nouveau’ period, design

was very complicated and decorative. The

1960’s designs became simpler, using straight

lines inspired by the Bauhaus movement,

using black and white

and primary colours.

Minimalism was even

simpler, designs were

spacious and made use of

light.

Minimalism had a great

influence on architecture,

using clean lines, straight

edges, space and light.

Surroundings were

important and often

complimented the

minimalist design. This

goes hand in hand with

minimalist philosophies of

living focusing on the

statement “Omit needless

words” (Strunk, 2015)

Strunk & White’s theory of

minimalism.

“A sentence should contain no unnecessary words, a paragraph no unnecessary sentences, for the same reason that a drawing should have no unnecessary lines and a machine no unnecessary parts. This requires not that the writer make all his sentences short, or that he avoid all detail and treat his subjects only in outline, but that every word tell.” 2

Page 5: Illustration essay book

his means that designers are less

busy, and ‘cluttered’ but still keep

their meaning.

Carl Andre (1935) is an example of a minimalist

artist. He used to make sculptures from wood.

He then moved on to more industrial material

such as pipes and bricks. Carl Andre

(www.tate.org.uk, 29.10.2015) John McCracken

was another

minimalist artist who used industrial materials.

His art work became known for its reflective and

smooth surfaces. This also represented the

minimalist idea of space and light.

(www.davidzwirner.com, 2015) It would seem

that minimalism in art and architecture uses

similar ideas of space and light.

According to online magazine/ newspaper

article www.Time.com (2015), Frank Stella was a

key figure in the minimalist movement. He was

a painter and used primary colours, he used

abstract designs and shapes. In the

contemporary world this may have also

T influenced the minimalist trend in web design

along with the White Cube exhibition spaces in

fine art exhibition and other areas of

philosophical theories of

3

minimalist living, such

as Strunk’s.

There are strong examples of web design using

minimalist design.

Page 6: Illustration essay book

Minimalism brings the most important content to the forefront and minimizes distractions for the user. If a page has too many elements, the viewer

will be confused about where to look or misinterpret the priority of each element. A minimalist design puts the focus squarely on the content. Complexity within web design can be overly busy because of resizable type, line lengths and contrast.

(designmodo.com, 2015) Yet in a world full of distraction, hurrying web viewers take little time

deciding what to focus their attention on. It has been shown that users will judge websites within

1/50th of a second to 1/20th of a second. (conversionxl.com, 2015) If you have to rush into finding

three topics at the same time and do not have time, then you pick the website that engages

you most quickly.

Minimalist design focuses information on necessary contents, so that there is less

information to take in and so can be digested more quickly as stated above.

It is suggested that simple is scientifically easier to process because it is

easier to process information that does not entail the eye and brain

to materially work hard to take information back to you.

“Basically, your retina converts visual information from

the real world into electrical impulses. Those

impulses are then routed through the

appropriate photoreceptor cells to transmit

the colour and light information to the

brain. The more colour and light

variations on the page (visual

complexity) the more

work the eye has to

do to send

information

to the

brain

4

Page 7: Illustration essay book

5

Basically, your retina converts visual information from the real world into electrical impulses. Those impulses are

then routed through the appropriate photoreceptor cells to transmit the colour and light information to the brain. The

more colour and light variations on the page (visual complexity) the more work the eye has to do to send

information to the brain.

Page 8: Illustration essay book

Therefore because minimalist and web design

has less content and writing, rather than

complexity it is easier for the brain to process.

Further, “visually complex websites are

consistently rated as less beautiful than their

simpler counterparts.” (http://conversionxl.com,

2015) In fact in a study by Reinecke (2013) et al

the research found “that the more visually

complex a website was, the lower its

visual appeal” This may be

because of ‘cognitive

fluency’ (The brain

prefers easier

concepts),

“Fluency

guides our

thinking in situations

where we have no idea

that it is at work, and it affects

us in any situation where we weigh

information.” (UXmatters.com, 2015)

If scientifically simple is far easier to process

then keeping the design simple (Minimalist), this

means that the web site is more likely to draw

attention quickly. Simplicity also has the benefit

of minimising the amount of content on a

screen. In the contemporary world there are

mobile phones with internet to view websites,

because of this they are viewed on a smaller

scale. Minimalist navigation allows the

simplifying and compacting of websites for

The simplicity of minimalism may seem simple enough, but under the surface lies far more than just, the bare minimum.

mobile phones and tablets. There are

techniques that are the building blocks of

minimalist web design. According to

thenextweb.com (2015), there are seven main

pillars of minimalism in web design.

The first point states there are spaces used to

draw the viewer in by focusing them on a

specific objects or the content by enhancing

the use of negative space. Negative spaces

guide the viewer’s eyes, this helps the

cognitive fluency as discussed earlier.

“In interaction design, white space serves

three main functions: improving

comprehension, clarifying relationships, and

drawing attention”. (StudioUXPin.com, 2015

6

Page 9: Illustration essay book

Nevertheless, in the contemporary world at the

moment, pictures are in all places and mainly

photography that can be vital. This second pillar

of web design answers the challenge of

necessary photography with the use of vivid

and large photography. Usage of one large

‘hero image’ that retains the minimalist

expression within the photo can “add a touch of

familiarity without dominating the

foreground… enabling an entire world of

emotional connection and atmospheric

settings”. (thenextweb.com, 2015)

Typography is a vital part of web design and

essential to keeping a minimalist look to a

website. Below are three case studies, which

show examples of minimalist typography in web

design.

The first typography had a simple, cleaner

design to it than the third typography. This had

clean lines and not much content to it and finally

the last typography had much better, cleaner

lines and a simpler design.

The typeface for the websites looked at have a

simple and clean line to them. They have one

whole colour throughout the website. The

content had less writing in it and just focused on

‘to the point’ information. All these features

make these websites successfully minimalist.

7

Page 10: Illustration essay book

The use of dramatic, bold typefaces is the third

pillar of minimalist web design suggested by

Nextweb. This typography uses bold, striking

typeface for headers balanced with neutral text

for the content preventing the boring appearance

suggested by some anti-minimalists.

The forth pillar states that the use of beautiful

contrast, if used well and not too often,

compliments the white background, which is the

main choice of minimalist design. This keeps the

hierarchy information that contemporary

designers think necessary:

One of the key principles of design is visual hierarchy. Visual hierarchy is the organization and prioritization of content as a means to communicate a message.

The fifth pillar stated suggests the use of simple

navigation in minimalist design aids with the

“discoverability of navigation items”, especially

for older viewers. Navigation of websites can be

“less clear to people over 44 years-old (as Linn

Vizard of Usability Matters points out).”

Further proving that minimalist design has many

positives for user friendly viewing as well as being

more appealing to look at.

The sixth pillar stated shows how minimalist

design keeps visual harmony. By using versions of

symmetry such as; horizontal symmetry,

approximate symmetry, radial symmetry and

asymmetry this design can be simple and

streamlined and interesting.

The last seventh pillar shows minimalism can be

complimented with flat design:

“Because flat design is a visual aesthetic whereas

minimalism is a design philosophy, you can enjoy

the best of both worlds when you combine

techniques from each discipline. Your design

remains hyper-focused on the content, but still

appears visually rich thanks to the aesthetic

values of flat design”.

8

Page 11: Illustration essay book

9

Page 12: Illustration essay book

In contrast to minimalist web design, the trend

of ‘maximalist’ design in architecture is a

growing one. Following the swing to minimalist

design in previous periods.

“After a ten year-plus reign of austerity an

aesthetic shift celebrating variety and plurality is

being experienced with gusto” Cuito, A. (2002).

It is also

suggested

that

maximalist

design is a

trend in

contemporary graphic design:

“Graphic designer Yehrin Tong has a smart new

website which gives free rein to her fantastic

maximalist creations. The Central Saint Martins

graduate has no time for the clean, crisp

reductive approach so on-trend right now, rather

her patterns, motifs and type treatments for both

commercial and editorial clients revel in colour,

repetition and optical illusions.”

(http://www.itsnicethat.com, 2015)

This design is not in keeping with the minimalist

style look because it is far too bold with heavy

colours and patterns. In web design this may

strain viewer’s eyes by looking at complex style

design especially when looking at it on the

mobile phones where screens are small. As

mentioned before it has been shown that, unlike

other design mediums such as illustration, users

will judge websites within 1/50th of a second to

1/20th of a second. Because of the complexity of

design, it is far too much information to absorb

in a shorter matter of time. For example, in the

1 0

Page 13: Illustration essay book

following website - http://www.007museum.com

(as referenced on

http://www.topdesignmag.com, 2015) there is

too much busy and the content does not really

fit into the minimalist clean line style look.

This website (http://www.topdesignmag.com,

2015) has examples of bad web design, all of

which is not in keeping with minimalist style

because it has had various different fonts,

colours, background and images. This can take

time to absorb information and the eye is not

guided to the content.

In conclusion, minimalism as an

influence across different artistic

areas suggests how it is important

across art and design. In web design

the development of smaller screens

requires a more simplistic approach,

so minimalism is well suited with this task. By this

the contemporary design looks clean and simple

on a smaller screen. The world can be full of

distraction and hurrying, but minimalist design

can aid the speed that we must use to process

information from websites.

The seven pillars of minimalist web design

explored illustrated how minimalism can answer

contemporary challenges to web design. Hence,

showing that minimalism is important in web

design within the complexity of today’s design

world and that minimalism has a crucial place for

competitive web design providing many benefits

for web users and companies.

1 1

Page 14: Illustration essay book

1 2

Page 15: Illustration essay book

The fifth pillar stated suggests the use of simple

navigation in minimalist design aids with the

“discoverability of navigation items”, especially

for older viewers. Navigation of websites can be

“less clear to people over 44 years-old (as Linn

Vizard of Usability Matters points out).”

Further proving that minimalist design has many

positives for user friendly viewing as well as being

more appealing to look at.

The sixth pillar stated shows how minimalist

design keeps visual harmony. By using versions of

symmetry such as; horizontal symmetry,

approximate symmetry, radial symmetry and

asymmetry this design can be simple and

streamlined and interesting.

The last seventh pillar shows minimalism can be

complimented with flat design:

“Because flat design is a visual aesthetic whereas

minimalism is a design philosophy, you can enjoy

the best of both worlds when you combine

techniques from each discipline. Your design

remains hyper-focused on the content, but still

appears visually rich thanks to the aesthetic

values of flat design”.

Page 16: Illustration essay book