Falling snow flakes

This is a seasonal site for Dublin on ice! the really nice feature about this site is the snow flakes falling along the screen.

http://www.dublinonice.ie/

Amazing Graphics

This web site is really cool, the most interesting features and sound! It reminds me of the secret garden, the graphics used are amazing!

Interesting websites.

http://www.blast.co.uk/
Design company specialising in branding identity/ communications. London

www.complot.com
Clothing company

http://www.itsnicethat.com/

cool website with loads of interesting stuff!

http://www.thecoolhunter.com.au/12

Another cool website with lots of different designs!

http://www.nationalgeographic.com/

nature, wildlife!

http://www.treehugger.com/

Cursours

Cursors that reflect the movement of the mouse onto the screen. There are 3 standard cursors: pointer type and selection.

When the cursor is moved over a hyperlink, the system changes the cursor from an arrow to a hand , the cursor is moved over text it changes to an type cursor.

The wedding shop website shows how a cursor can be used in a different way. It is a elegant website using timeless black and white features. 4 elegant black love hearts follow the cursor around the page like a elastic string. The love hearts really add a lasting effect and encourages you to stay on the site longer even if it is to move the mouse around the page!
http://www.theweddingshop.ie/

Helvetica

HELVETICA



















Helvetica was designed in the late 1950's by a man called Max Miedinger from Switzerland. The type face was originally named Neue Haas Grotest but was changed to helvetica meaning the Latin name for Switzerland. Helvetica is a san serif font similar to Arial. A featured length independent film calledd Helvetica was made about the typography, graphic design, advertising and psychology communication and global visual culture.
This is a nice little clip of the film on the production of helvetica!
http://www.youtube.com/watch?v=DrR-P5M1hRY

Font & Typeface

"Font
The physical means of typeface production. A Set of type of one particular face and size.

Typeface
A group of characters, numbers, symbols and punction which have the same distinct style. A particular design of type.



Pictured is a typewrighter whose keys constitute a font, that is, the physical means of printion letters onto a substrate. The letters produced are a type face.

This is not a font, it's a type face."

(Ref: The visual Dictionary of graphic design, Ambrose & Harris 2006)

Kids site

Kids websites are set out in a more simpler use ability but brighter colours, fun friendly, big and childlike typography and an example of these chartists in a website is PBS kids (http://pbskids.org/)

Lots of links and interactive for kids, with videos, games, colouring in projects and fun ways of learning with educational games. The site is based on animation characters made from simple forms.

Serif & San Serif

Serif
Serif fonts date back to when people first took chisels to stone. Serif feature horizontal and vertical detail to the end of each stroke. Serif is divided into 3 categories: Old-Style serif, modern serif and slab serif. Serif fonts are suited to long text so that the eye can follow the horizontal stroke.

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z
0 1 2 3 4 5 6 7 8 9

Sans serif

Sans serif do not feature the serifs. Sans meaning without. These have more variety of weights and widths. Sans serif work best on websites because they have limited amount of pixels, more legible, bold weight and consider proportion.

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z
0 1 2 3 4 5 6 7 8 9

3D Website

These two websites have a 3d feature, interacting sound and is user friendly. The website uses simple colour and layout so its less confusing to use. When the mouse is moved over the pallet it move in a 3d motion.

Alienology: http://www.alienology.com/

Pinko is a clothing company which uses the same features to view the clothing line. This site has an interesting introduction page using video imagery

http://www.pinko.it/home.asp?LN=UK

Scroll tool

This is a website for a Burger restaurant in Rathmines. Apparently Jo Burger has gone into administration but is still open. So we are going to head on Fri night just in case the place goes belly up! And ill let you know if the restaurant reflects the website! 

The website gives the impression of a cool, funky, retro place to eat and hang out. The background music gives the website a mellow atmosphere but will it reflect the restaurant! Again we see the use of hand illustrations on the web site and the use of one page no links just the use of the scroll tool! also the use of animation  of a little character walking along the bottom of the screen directing you where to go is quite clever! http://www.joburger.ie/

Shopping on line

Shopping on line is really popular. You can avoid the crowds, stress, noise, compare prices and features and no pressure to buy, while doing it all from your own home. Even with next day delivery!

Shops have to keep there website up to date, have all the latest fashion trends even before the shop. The site should reflect the retail store and has a matter of minutes to make an impression on the user. the site should be user friendly and allow the user to view clothing from all angles.

A really good website that reflects these qualities is Zara! website http://www.zara.com/

Colour: RGB (Red, Green, Blue)

RGB (Red, Green and blue) these are the 3 colours used for our television screens and computer monitors. These 3 colours reproduce a broad array of colours.

Icons & Logos

ICONS AND LOGOS ARE NOT THE SAME?

This is interesting i didn't know there was a difference!

From what i can pick up logo and icons are the same visual vocabulary which may lead you to thinking they are the same but they are 2 separate design disciplines.

Logos are graphic elements, trademark or a company brand, set in a special typeface/font or arranges in a legible way. Having distinctive design element ,colour and shape.Also logos are scalable you are not confined and they have no boundaries so you are free to experiment with shapes and size. This is a example of a recognisable logo which has all the elements.

Icons is a graphic symbol which is usually a simple picture or a representation of an image for example the folder below. Icons denote a program, or a computer file. Icons are not scalable, they operate within a complete square canvas which they are restricted too. Logos can easily resemble an icon form. Icons need to be simple images so that they are recognised and a distinctive interpretation to the word.

So they are different!

Seems to be allot of conflict about the two!

http://pixelresort.com/blog/icons-and-logos-are-not-the-same/

Fonts for web

http://www.elysiumburns.com/
This site is an example of good font. Heading and text are clear and legible. The main use of Sans serif fonts in a white colour on a black back ground which high lights the typeface more.

Turn Over Page

This website is done in a book style format. It is a replica of the wedding brochure for trim castle Co. Meath. The book has 14 different pages which can be used with the turning page motion by clicking and dragging or click on the toolbar buttons at the top of the screen to go directly to a page. It is more interactive using the turn page motion it gives the realistic motion of the page turning with the curling of the page and shading effect it leaves on the page when turned to the next.
The site is neat and simple. Sound effects would add allot to the site and maybe if the book could close completely and appear like a wedding album cover!

A example of another turn page site is: http://nozebra.ipapercms.dk/Nilfisk/Nilfisk/UK/Catalogue2009/
This has a front cover and back cover and has the same page motion. but the pges are not readable you have to zoom in on the text, unlike the Trim castle site.

The turn page motion would be a really good idea for a portfolio!

Consistent Layout

http://www.pizzaza.ca/restaurants/wine_cellars.php

This website is advertising a piz'za-za restaurant in Canada. The site is very consistent, each page having the same grid layout and tool bar position. But using different images for a background and colours. There are two main tool bars one at the top right hand cornor using text another other three quarters way down the page.

Using interesting images which look like hand drawn icons. A image of the menu direction to the menu list and the camera directing the user to the photo gallery. When hovering over these icon a bubble appears to indicate what is on that page.

The use of style sheets may have been used to develop this website.

Scroll

www.wallswaps.com











This is a really cool site with no buttons for navigation just one huge pin board to scroll around with loads of posts, t-shirts and images.




At the bottom of the screen in Caps: IMPORTAMT INSTRUCTIONS- on how to use the site I wonder how many people leave before they ever figure out how to move the screen.

Colour

Colour has an incentent impact to the viewer in a room on a graphic image and even on you computer screen. Color can effect how your feeling it can make you relaxed, secure and comfortable weather it be in a room or looking at colour on a screen. Although the computer monitor displays colour differently to printed images. Computer monitors display RGB files (Red Green and Blue) these colours combine produce white light producing images that can be clearly seen on the screen. Images are printed in CMYK (cyan, magenta, yellow, and key, or black) Colours have different meanings for example:
Red represents love, danger, speed, strength, and blood.
Green represents good luck, jealously, rest full.
Blue represents calm, harmony, trust.

Websites need to make an instant impact on the viewer. The contents of the site 8-10 seconds of visual appeal. The colour should reflect the companies profile and personality. Cream a graphic design company based in Dublin. Their website uses colour in a very clever way. The background is in a dominate lime green color which is very over powering but is contrasted with the gray images. When hovering over a image it changes to color, which allows you focus on one image, and look at it in detail i think this is very clever to grab the viewers attention.

http://www.creamgraphics.ie/

Colour: CMYK

CMYK (cyan, magenta, yellow and key, or black)
These 4 colours are combine to reproduce RGB (Red, Green, Blue) in the printing process

Bebo V's Facebook

Bebo V's Facebook

Facebook, bebo, Msn, Twitter and My Space are some of the most popular global social networking, today.
A means of connecting old friend from school,college, work and allowing people to connect, share links, videos, instant message, and one of the main reasons i use these social networking is to share photos!

Facebook has a fixed blue grey and white layout, the screen is divided into 3 colums

Facebook looks more professional, less cluttered and easy on the eye. Facebook does not let you customise it’s appearance. It's almost like a grown up version of Bebo.

Bebo gives you a similarly simple default layout, but in red and white.

Bebo allows you to apply new "skins" to stylise your page and can be changed or even make your own. Bebo is target at the younger generation which make it more user friendly. there is allot of applications that can be added to your bebo site which make your page look cluttered.

With facebook there is less pressure to pimp your page! Facebook is more common worldwide as I've notices from travelling. A grown up way to social networking, maintains it layout and easy to keep up with.

Facebook wins for me!

Which do you prefer?

Navigation

Mr. Brainwash is a well established graphic designer, his work is influenced by Andy Warhol. You might recognise his work he done for Madonna's Celebration Album that was released this year. I looked at Mr. Brainwash site navigation point of view it is directed through interactivity, this is a different approach than using drop down tool bars. The approach is simple by pushing buttons and entering through doors, there is an element of surprize. By entering to doors you are faced with a panel of buttons to choose from. Each button is connect to a different link some are there for the novelty too. This approach is simple and reflects on his work and personality. The site is effective in navigating you around the site. There is little room for error in the navigation throughout the site. But i did find a little confusing when returning to the button panel there was no indication what link you had just entered. this is where it can be confusing in remembering which link was entered and which was not.

www.mrbrainwash.com

Interactivity with sound

Karim Rashid is a well established designer, his website has similar characteristic as a Mac computer for example the bottom tool bar directing the site to different links. The use of sound when the mouse scrolls over the bottom icons is very humorous, making tunes can keep you occupied before you even get to explore the site.
Check it out, make your own tune!
www.karimrashid.com

Interactivity

http://www.nike.com/nikeacg/?sitesrc=GBLP#dispatch

Interactive websites engage people to using their website, which encourages the user to visit the site more often and it is also fun for the user.
The nike website (www.nike.com) is targeted at sport minded people, to keep them up dated with new clothing,new challenges, how to make the most of training sessions, for download motivational music to work out too and many much more.
This is an example of one of many Nike websites.
Nike ACG allows you can explore 2 options :Gear and Sweetpots. Gear browses the latest collection from NikeACG and the Sweetpot follows athletes as they search for first descents and new experiences in stunning locations worldwide. The gear option is broken down into different categorise eg Men and women then into city or terrian style clothing then broken down further into categories of clothing for example shoes, t-shirts, trousers and so on. The theme of the site is based on a spider web effect, opening one option leads to another and so on..... also with the sound effect and and motion on the selected buttons when hovering over also has grabbed the attention of the user. The has used a 3d effect of globes set in the back can be brought to the front for closer view. The other option for the sweetpots is also interactive, it allows you to orbit around the world and select different countries and watch video clips of athletes as they search for first descents and new experiences in stunning locations worldwide.the site is always been udated with new clothing and video clips. The site is very easy to use. And works very well.

Try it out!