Wednesday, 16 October 2013

OUGD504: Design for web; Designing for web

Simon introduced us to 'Design for web' and gave us a quick over view of the history of the internet and terminology which is used in web design.

The World Wide Web was created in 1991 for the scientists to transfer information at CERN by Tim Berners-Lee.


"In August, 1984 I wrote a proposal to the SW Group Leader, Les Robertson, for the establishment of a pilot project to install and evaluate TCP/IP protocols on some key non-Unix machines at CERN ... By 1990 CERN had become the largest Internet site in Europe and this fact... positively influenced the acceptance and spread of Internet techniques both in Europe and elsewhere... A key result of all these happenings was that by 1989 CERN's Internet facility was ready to become the medium within which Tim Berners-Lee would create the World Wide Web with a truly visionary idea..."


Steve Jobs created the first Web server which was used by Tim Berners-Lee:





The first websites consisted of just text:

The first website at CERN - and in the world - was dedicated to the World Wide Web project itself and was hosted on Berners-Lee's NeXT computer. The website described the basic features of the web; how to access other people's documents and how to set up your own server. Although the NeXT machine - the original web server - is still at CERN, sadly the world's first website is no longer online at its original address.











Les Horribles Cernettes (French pronunciation: ​[lezɔʁiblə sɛːʁˈnɛt], "The Horrible CERN Girls") is an all-female parody pop group, self-labelled "the one and only High Energy Rock Band", founded by employees of CERN which performs at CERN and other HEP related events. Their musical style is often described as doo-wop. The initials of their name, LHC, are the same as those of the Large Hadron Collider which was later built at CERN.

This picture of Les Horribles Cernettes was the first photographic image to be published on the World Wide Web in 1992. From left to right: Angela Higney, Michele de Gennaro, Colette Marx-Neilsen, Lynn Veronneau.




Web terminology

HTTP - Hyper Text Transfer protocol

URL - Uniform Resource Locator

HTML - Hyper Text Markup Language

CSS - Cascading Style Sheets

FTP - File Transfer Protocol

CMS - Content Management System


Digital Skeuomorphism


*Wikipedia:


Many computer programs have a skeuomorphic graphical user interface that emulates objects in the physical world. An example of this trend was the 1998 RealThings package. A more extreme example is found in many music synthesis and audio processing software packages, which closely emulate physical musical instruments and audio equipment. Functional input controls like knobs, buttons, switches, and sliders are often careful duplicates of those found on the original physical device being emulated. Some software even includes graphical elements of the original design that serve no user interface function, such as handles, screws, and ventilation holes.
Even systems that do not employ literal images of some physical object frequently contain skeuomorphic elements, such as slider bars that emulate linear potentiometers and tabs that behave like tabbed file folders. Skeuomorphs need not be visual. The shutter-click sound emitted by most camera phones when taking a picture is an auditory skeuomorph: it does not come from a mechanical shutter, which camera phones lack, but from a sound file in the phone's operating system. Another example is the swiping hand gesture for turning the "pages" or screens of a tablet.

Arguments for skeuomorphism in digital design

The arguments in favor of skeuomorphic design are that it makes it easier for those familiar with the original device to use the digital emulation and that it is visually appealing. Interactions with computer devices are purely cultural and learned, so once a process is learned in society, it is difficult to remove. Norman describes this process as a form of cultural heritage.

In some cases, such as the pilot interface of digital avionics, familiarity to veteran pilots could even be (potentially) a safety issue.

Arguments against skeuomorphism in digital design

The arguments against skeuomorphic design are that skeuomorphic interface elements use metaphors that are more difficult to operate and take up more screen space than standard interface elements, that this breaks operating system interface design standards, that it causes an inconsistent look and feel between applications, that skeuomorphic interface elements rarely incorporate numeric input or feedback for accurately setting a value, that many users may have no experience with the original device being emulated, and that skeuomorphic design limits creativity by grounding the experience to physical counterparts.

Apple Inc., while under the direction of Steve Jobs, was known for its wide usage of skeuomorphic designs in various applications. The debate over the merits of Apple's extensive use of skeuomorphism became the subject of substantial media attention in October 2012, a year after Jobs' death, largely as the result of the reported resignation of Scott Forstall, described as "the most vocal and high-ranking proponent of the visual design style favored by Mr. Jobs". Apple designer Jonathan Ive, who took over some of Forstall's responsibilities and had "made his distaste for the visual ornamentation in Apple’s mobile software known within the company", was expected to move the company toward a less skeuomorphic aesthetic.With the announcement of iOS 7 at WWDC, Apple officially shifted from skeuomorphism to a more simplified design, thus beginning the so-called "death of skeuomorphism."



Examples of skeuomorphism:







Responsive Website: Adjusts to certain proportions. For example, a website which can be viewed both on a laptop and iPhone.

We were asked as a task to find a variety of websites and write the first word which comes to mind when looking at that specific site:

SpaceJam:

http://www2.warnerbros.com/spacejam/movie/jam.htm

The SpaceJam website has stayed the same since 1996. The website is very outdated and very tacky. The concept actually works well but again, its very old. The purpose of the website was to inform people of the film 'Space Jam' and offer a variety of extras. The audience is children. For 1996 the website is pretty decent and definitely caters for a younger audience. 

Stumbleupon:

http://www.stumbleupon.com

The website looks a bit cluttered but its labelled clearly and very easy to navigate around and understand. It's quite a basic layout, but for what its used for it works brilliantly. The purpose of StumbleUpon is; as a discovery engine it recommends web content for users, the audience for this type of website is very broad but I'd say mainly teenagers use the website. It's very handy for procrastination and can actually help with finding new designers and design blogs.

Youtube:

http://www.youtube.com

The website is clean, easy to navigate and easy to understand. It's clearly labelled and the design is professional. Youtube's purpose is to share videos from all over the globe in an easy-to-use and easy-to-watch manner. Youtube allows users to upload videos they've taken so others can see! Youtube's audience is so vast, everybody uses it, obviously you need the internet to access it.

Google:

https://www.google.co.uk

Clean, professional, easy to navigate and very simple. Google has become the main search engine for the World Wide Web, its purpose is to help you search and find the websites you're looking for. Googles audience is the users of the internet, so every ages group.

WestLothianCouncil:

http://www.westlothian.gov.uk/1210/1054/recycling/recyclingcentres

The colour scheme is horrible, the website is cluttered. It's not so hard to navigate but the design is very outdated. The West Lothian Council websites purpose is to provide the user with information about recycling centres/ information. The audience for this I would expect to be older people and young adults.

Fubiz:

http://www.fubiz.net

The website is clean, a pretty standard web layout. It's easy to navigate around and the simple colour scheme is very professional and works very well. Fubiz is a design blog and offers examples of designers work and information on existing and new design. Audience for this website would be all designers looking for inspiration and keeping up with whats new.




No comments:

Post a Comment