Sam Horbury
Level 05
BA (Hons) Graphic Design
Leeds College of Art

OUGD 504 - Studio Brief 2

Design For Web:

Our introduction into design for web started with a bit of background information about its history. Much of this I didn't know and was unaware of so this was very useful for me.
  • The internet was created in 1991 by Sir Tim Berners-Lee, a British computer scientist. Whilst working in Switzerland at CERN, the European Organisation for Nuclear Research, they needed a way in which they could share information online; thus leading to the creation of the world wide web.
  • Steve Jobs created the first ever NeXT computer which was the worlds first web server. These are used to store the information for websites and are still used today, although they are much larger and capable of much more.
  • The first image on the internet was in 1992 and was an image promoting the band 'Les Horribles Cernettes'. This is the image:

File:Les Horribles Cernettes in 1992.jpg


After we now knew the origins of the web, we began learning the correct terminology that we would need to be aware of in order to create design for web.

  • HTTP - Hyper Text Transfer Protocol: The process of transferring code into website.
  • URL - Uniform Resource Locator
  • HTML - Hyper Text Markup Language
  • CSS - Cascading Style Sheets: Allow you to 'design' website
  • FTP - File Transfer Protocol - For once you've finished
  • CMS - Content Management System: Allows you to manage and change the site making the content dynamic, as opposed to 'static' sites

We then looked at the term 'Skeuomorphism' which refers to design that imitates something that it isn't. Examples of this include when reading books online; when the pages turns it imitates the way in which a real book page would turn. Johnny Ive, one of the designers for Apple Computers, still uses skeuomorphic design, as shown below:

http://wpuploads.appadvice.com/wp-content/uploads/2012/05/ibooks-ipad-642x481.jpg 

We then moved onto 'responsive' design, or 'reactive' design as it is sometimes referred to. This is where the content responds i.e. it can be adapted to a variety of media using screens of various sizes. We spoke about the way in which the grid system, a characteristic of Massimo Vignelli's work, can be applied to almost every website. 'Responsive grids' is where the grid adapts to the size screen it is viewed on. 

Before designing, there are 3 main considerations that need to be taken into account:

  • What is the purpose?
  • Who is the target audience?
  • What do the target audience need?

We were then given a list of various different types of resources that will aid us in learning about design for web and guide us throughout our brief.

Books:
  • HTML & CSS, Design and Build Websites
  • Design for Non-Profit Organisations - Massimo Vignelli
  • Scratching The Surface - Erik Spiekermann
Websites:
  • www.awwwards.com
  • www.piccsy.com/everything-design
  • www.aisleone.com
  • www.fivesimplesteps.com

As a whole group, we then were asked to look at certain websites and to give our initial thoughts and feelings. It generally takes around 2.5 seconds in order for someone to make their mind up about a website, so by not thinking and just giving our honest reactions we could see which sites worked and which didn't.

Apple:
Reactions - Slick, Clean, Expensive, Modern, Bright, Simple

Leeds-Art:
Reactions - Thin, Boring, Busy, Cluttered

BBC:
 Reactions - Busy, Cluttered, White

My Own Bike:
Reactions - Minimalist, Modern, Clean, Shiny

Slavery Footprint:
Reactions - Colourful, Engaging, Confusing, 'What?'

Lings Cars:
Reactions - "Urgh", Cluttered, Teletext, Cheap

Evangel Cathedral:
Reactions - Game show, American

No Limit Arcades:
Reactions - Crazy, Confusing, Cluttered, Busy

Ideas By Music:
Reactions - Innovative, Clever, Appropriate, Insightful, Modern


TASK: Find examples of websites and note initial ideas and reactions towards them. Think about the three considerations and whether it is successful.

No comments:

Post a Comment