Research on 5 websites

For this research, I chose two sites that I visit frequently, and three less frequented sites.
This is so I can give my opinions as a long-term visitor to that particular site, or from a perspective of a new user.

1. http://www.neopets.com


I think this is a spiffy site : )
Registered users can have pets, earn money by playing games, holding shares and much more!

Having visited it for more than a year, I personally think the navigations are very organized. They even let users change between four color moods.

The hierarchy is normal: the title, with a sidebar, contents then disclaimers.

Here are some examples.

This is the 'pet central' page.
It's like a library to many other pages, yet the hierarchy is kept, and boxes are used to keep everything in order.
Gutters are still there so users can breath from the amount of information given.


This screen shot is actually a map of shops in Neopia ( the shop central in Neopets ).
They could've used normal texts and made the page longer, but they used this single picture instead.
It saves much more space and is more interesting to interact with.


I don't think there's anything bad to the site - I mean, they could use more amazing graphics for the navigation bar and less advertisements - but that would mean more bandwidth used.
Also, less advertisements would mean it won't be free to play anymore.

Perhaps they could change the background color to something instead of just white.

Otherwise, I'm quite okay with the site : )

2. http://www.beautifully-webdesign.net/#



A site with links to other artsy, creative sites.
Looks a bit messy at first glance, but the navigation is actually quite smart.
The navigation bar is on top - a single button.
When you click it the whole bar comes out.
I think it keeps the whole site neater.


Same goes with the sidebar.
Whenever you click on one, it slides to show the links.
Saves space, looks simpler, neater.

Title and logo are on top, but I can't see any disclaimers.

Whenever you rollover on the thumbnails, the name of the site and a screen shot of it shows.
I think it's a good way to let users know what they're expecting of the site they might click to visit next.

They also update the links at the sidebar.
The first one is called "Last Link". It's still slightly ambiguous to me, as I'm not sure if it refers to the last link another user clicked, or the last link I clicked on that site.
The second option is something like a featured site from their many links.
I think it's a good way to get people clicking on the links, as some people might just not know which site to visit.

Overall, I think the site can improve on the navigation.
It is a good thing they did with the button sliding - but it's a bit ambiguous at first glance.
The advertisements on top should also be put to the bottom of the page.

3. http://lftovr.projectsd.net/index.html

A joint portfolio of Eric Sin and David Garvin.

The usual hierarchy: title ( in this case the logo ), a sidebar, contents then disclaimer.

Where is the navigation?
Well, if you did read through the long block of text - it states that when you click that little red "x" above - you can go to other pages (namely home, and the two artists' individual pages).

Not very clear navigation, in my opinion.
Here's the screenshot of the navigation one you rollover.
It's so tiny!


But otherwise, the site is pretty neat and decent.
The gutter, margins are all very organized.
Not too spacious, not too cramped.
The graphics are a major bonus too!

4. http://www.onemanga.com/directory/

An online manga site is STILL a website >)
A very useful one at that.

One Manga - I think the layout is very, very neat and easy to navigate.
All the manga titles are there, and you can even browse with the scroll-down bar at the top right corner.

There's not much I would ask to change, except maybe they can make the overall design nicer with more graphics.
But that would mean it would take longer to load the pages - very annoying if you want to read manga.

When you click on a specific manga, it will bring you to this page.

On the sidebar, there tons of information about the manga.
A cover of it, a summary, the mangaka etc.

After you choose which chapter you want to read, you reach this page.
On the top, it lets user go to other chapters and pages.
Ot also lets the users go to the previous and next page.


Nothing's perfect.
I guess in this case the function of the site is the priority compared to the design.

5. http://www.undoboy.com/flashSite/cokeZero/index.html

Awesome motion graphics.
From the loading bar to the transitions, the site never lets the user have a dull moment while waiting.

Just three main colors: whit, black and the red from the product.
Yet they compliment each other so well, it doesn't look as if the site is dully-duotoned.

The frosty design gives out the "cool" feel to compliment the product.

Here's the loading for the main page:

It's basically random shapes making up the bottle.
I was so interested in it I wished the page would take longer to load x)

Here's the transitions from the main page to a sub-page:


The hierarchy is totally different from normal websites.
The title is on the left, followed with the navigation, slogan on the right.
Content comes after you click the buttons.
And when you're at the content page, the hierarchy is different.
Still the navigations are clear and you won't get lost.
Here's the screenshot of a page:

You'd notice the label is slightly larger than the bottle itself.
It's actually a rollover effect to let the text and details on the label clearer.
This, on it's own has proved that simple, boring things can be made into something interactive and interest the user.


Except for the slight confusion of the navigation at first, I think this is a pretty awesome site :)