S4

Station Four had a much more corporate design to its interface, however this suited the business itself. Colours were used well, with bold colours being used to make titles or small graphics stand out from the mainly black and white composition.

It could be argued that navigation around the site is a bit confusing, however with the graphics used to show different pages being so cleanly designed with block colour and good rollovers, it doesn't irritate to much.

I was also drawn to the way facts and stats were shown in the site. Considering I will most likely have to show statistics in some way in my Flash Site, this was interesting and useful, giving an idea how you can make this information more visually engaging and enjoyable.

http://www.stationfour.com/Company

Yodabaz

A really interesting website, displaying the portfolios of an online designer. The background is a looped video, with a person in - obviously the designer himself. The video footage has a grunge feel to it too, which is a nice touch and is slightly blurred with colour.

The navigation is simple, with the home screen being the whole nav. Rollovers are tidy and the portfolio neatly designed. When clicking on the portfolio, the background movie becomes black and white, creating more vibrant colours from the work. When rolling over each piece, the rest then becomes duller, highlighting the chosen piece. Another great addition is when a piece of work is chosen, the rest of the projects fall away, which is really fun and interesting for users.

Overall, the transitions from pages are really strong, as well as the simplicity created throughout. For a designers webpage, the interface would really engaging and impress potential clients.

http://www.yodabaz.com/

Waterlife

Waterlife is a site designed to educate and inform the user about the last great supply of fresh water in the world. It is highly interactive, with great visual aesthetics and smooth transitions, as well as a load of well presented information.

Some of the pages run background videos which is somewhat unique. The home screen of water moving and changing light is very eye catching.

The user can either interact with the images to navigate their way through the site, or the thin bars at the bottom. When rolling over these bars, they ripple upwards, which is a nice visual effect rollover.

Transitions are great, with the images spreading once clicked on and other pages using creative ways to remove the information on the screen and show new information.

http://waterlife.nfb.ca/#/

Western Themed Websites

My initial ideas for an Interactive Map that shows the levels of gun crime in each US state has gone down a Western Theme for the visuals. I do not want to be too stereotypical of cowboys and gun's etc, however I felt it necessary to check out some websites with iconography and designs of the same type.

Team Fannypack
Although this may be very Western themed, I like the visuals of having a vintage, retro newspaper as the basis of the site. The background is dark wood, and using wood in my visuals has been an idea of mine, with this showing it can work. The typography is perhaps a bit too varied and obvious in my opinion, however the site is a great idea of how to use the theme to create an interesiting site.

http://www.teamfannypack.com/

Cascade Brewery

A much cleaner take on a vintage look with a hint of western within. Again the edges and background use a dark wood texture and I liked the organisation of the images with rollovers. Because I am doing a rollover map, organisation of each rollover button will be necessary and an appropriate  clean, understandable rollover will need to be created for each. The typography is perhaps a bit to plain and thin for my liking, as I have visions of a thicker font - such as Rockwell.

http://www.cascadebreweryco.com.au/

Hillcrest Gun Shop

I have had an idea of creating a gun shop like background to go with this western theme, and despite its very crude nature, this website uses some visuals I'd like to use and obviously improve. The worn wood as a background and perhaps bullet holes relates a range and more importantly American gun shops. I am also looking into find visuals for having rifles hung on the back of the wall, as in a shop.

http://www.hillcrestgunshop.co.za/

An idea of a background image

Jubes

A refreshing take on interactivity and navigation, Jubes provides a fun way to find out information about the sweet product. With a playful character in the centre of the screen, the user picks up the small cubes - which are essentially the sweets being advertised - and place them in the characters mouth. Each cube is a different part of the navigation, and as the character chews on the sweets we a directed to the chosen information.

 The sound effects are playful and the ability to change the background colour also interesting. This is not a serious site, however I was just interested in the uniqueness of the interface - as many others would be. As an advertising quirk for the product I feel it is great, and certainly needed a mention in my research into different interfaces for my projects.

Despite the small size of the actual site, I find it different from conventional sites - therefore another quirk of the design that is fun. The background around it is not just plain white, but a grid, which makes it not as boring.

http://www.juicycubes.com/main.htm

The Bullitt Agency

The Bullitt Agency is a website of a DJ agency, allowing users to browse the top international DJ's they have to offer. Users can find out recent news, about nearby events, book DJ's or check out their blogs. I found this site highly interactive and well built, with the black and white design having continuity throughout.

I enjoyed the mix of mouse interaction and keyboard interaction. You were able to scroll using the arrow keys through a parallax, and then scroll up and down to see the different stories on that part of the navigation. When on the artists page, the site was set up as a large page, with the user being able to explore artists by moving the mouse around the page. All of the images were neat and cleanly organised, with rollovers being a simple coloured box coming up at the bottom of the image.

I think what was really noticeable from this site was the clean and fresh look of the site as a whole. The interaction was sometimes confusing, however the neat look of the site was really appealing - especially to the target audience in my opinion. I think I will take this idea of creating a site that is not harsh or crude, but is somewhat corporate but fun at the same time.

This will be essential for the brief, as it states the interface should be clear and educational for older, more mature users.

http://thebullittagency.com/

Interactive Maps

http://www.theatlantic.com/misc/global-report-card/

This site is an idea of what I wanted to create for my project. Obviously this a simplified version, however the concept is still the same. The map of the US is split into its states, and the user can interact and click on the state they want to find facts about. The rollovers are just changes in colour, with the state name highlighted. This is something to build on and improve for my Flash site - especially the visual aesthetics.

There is a button to give users help on how to use the map, possibly something I could look into.

Slavery Footprint

The site is putting across a serious message, in a somewhat playful manner. It is engaging, as it needs the user to read all text about what is actually happening in the world.

As you scroll, small bits of information are put onto the screen by hands - perhaps to show that other people are doing things for you. Other bits have imagery related to the information or a pulled onto screen in another playful way. 

The end of the site - when you reach the bottom - you are asked to take a survey. It is obvious most people would, as they have just scrolled through and read some perhaps shocking information, and would want to do as much as they can to help.

There is also great little slides of how this charity came about and how we have the power to change this - all accompanied by cartoon animations and pictures.

Every Last Drop

http://everylastdrop.co.uk/

Every Last Drop

This is an excellent example of an interface that does not need any clicking in order of the user to find out information. The site is simply one long page which you scroll down. When you are scrolling the man on screen moves into different scenes, as if you are being taken on a journey with him. The information, which is about using less water in your day, is given to you when the man is in the scenario related.  

The best part of this interface is the smooth transitions from scene to scene with the man. The object around him slide in different directions out of shot, before the background colour slides up and a new set of object roll in. Throughout the site there is a clear continuity in the cartoon styles drawn, the pastel colour scheme and typography used.

With all this in mind, this is a great alternative website that is fun for the user to play with, and is also sending across a serious message - something which I will have to look into for the Tolerance/Intolerance Flash Interface.

Form. Follows. Function

http://fff.cmiscm.com/#!/main

This site is predominantly a collection of interactive experiences, designed on HTML 5, which are intriguing and playful. The set up of the website is great, with a spinning colour wheel used for the navigation of each small experience. All typography is stylish and simple, with rollovers being neat and   transitions slick.

 The interactive pieces themselves are a lot of fun, with all being enjoyable to play with, and very well designed. It is noticeable that all of them are intuitive  with users of all ages being able to experiment and play with each one. I feel this site has shown me that being simple but precise with design can have some great end products.

For example the typography window wiper may be considered a quirky idea, with not much of a point to it, however the ability to change the direction and speed of the swiper with your mouse makes the user interested. Obviously if this was designed in a crude and unprofessional manner, it would be nowhere near as fun, so it goes to show how much the user relies on presentation. I think that throughout this site, colour has a very important role - with vivid colours catching the eye of the user for each experience.

Hidden Heroes

This is a site designed to show the history of objects we use every day. It is a unique site, allowing the user to choose their own exhibition. The home screen is neatly laid out, with coloured rollovers each representing a different object. When rolling over each slice of colour, there is sound and a picture of the object in the middle of the screen. Once you have chosen your exhibition objects, the tour then begins.

I found this a neatly designed interface, with great use of colour and type, as well as simple interactions which were intuitive to any user. I particularly enjoyed the sliding bar which let you browse your exhibition. When you choose the object you want to learn about, the bar rolls around - showing a 3D effect, before displaying the information in a tidy manner.

http://www.hidden-heroes.net/

Colour Scheme Website

As well as a truly helpful site, for designers to chose complementing colours that go together well in a project/piece of work, this is a nicely designed website.

Move the mouse around the interface to find the exact colour your looking for, before clicking to save it. This is a very simple, but effective way of letting the user explore and chose the exact colour they want. The colour is then put to one side, and it allows you to compare the next colour with the previous. With neat typography and minimal design, this site is a great example of clean, intuitive interaction.

http://color.hailpixel.com/#5769C7,