Designing for the User: 5 Websites with JQuery and/or Javascript implemented

Hi,

Task 1 :

As apart of our assignment and actually the building of our final website they has to be some documentation with the website that is highlighted on the blog. Task 1 is clearly stated that you have to write a review at least 5 JQuery and/or Javascript websites and write a couple of sentences about it.

So here is a write up in the first 5 websites i found implementing certain features like Picture Slider etc.

1. Florida Flourish

scr_floridaflourish1

http://www.floridaflourish.com/

Features: Mouseovers with transparency, slideshow, Navigation Rollovers
Description: The brilliant colors and detail of the illustrated tree on this splash page are immediate attention-grabbers. Click on any of the categories branching from the tree and you’ll get not only descriptive jQuery-driven content but a completely different tree, too.

2. Orange Label

scr_orangelabel1

http://www.orangelabel.com/

Features: Image pre-loading.

Description: Image pre-loading is the extent of Orange Label’s use of jQuery. As you scroll down, portfolio items are added to the page (with a rotating graphic telling you that they’re pre-loading). The illustration at the top is big, colorful, highly detailed and delicious eye candy.

This is something we also used in CATS when we are talking about people and their online avatars and creating little worlds for themselves online.

3. Tomas Pojeta

scr_pojeta1

http://www.pojeta.cz/

Features: Sky, ocean, underwater.

Description: Pojeta adopts a motif (a motif is where as you scroll down the page something happen. For example gets lighter or some sort of events) that goes from high altitude to below the surface. The top of the website is in outer space, with its highly detailed rocket and monkey. Scroll down and you’ll see aliens and balloons in the lower atmosphere. Further down is an Easter Island-looking piece of land in the middle of the water, which leads to an underwater view with a submarine. Each illustration fits, and the transitions are about as seamless as it gets.

4. James Anderson (England Cricketer)

26

Features: Flip chart images resulting into his figures. Lines in the center of the page represents hawk eye but then cross matches with his figures with balls instead.

Description: Seen as Jimmy Anderson is a cricketer and the old ways of recording the statistics for a game that’s what James has tried to represent on his Personal Page. Also as the website kicks in a bowler line in the middle of the page forms like in a real life hawk-eye and then balls along that line also generate his statistics from his cricketing career.

5. Tori’s Eye

scr_toriseye1

Features: Origami birds flying horizontally.

Description: The creators of Tori’s Eye have built a website with any one of those features and you’d have something completely original. The website insists of blue origami birds to represent tweets instead of just have static pictures. For these creators, having all of these features wasn’t enough. They made the counter-intuitive decision to do all of the animation without Flash!

Thanks.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s