Wednesday, March 25, 2009

IA: Wireframes and directions.

Wireframe 1. This is my favorite direction out of the three.

This is what you first see when you open the website.

When you click on the "Keep the Change" the collection appears.

When a mouse rolls over the three symbols on the left, the coins that belong to that specific category (lions, eagles or objects) change color.

If you click on the category (lions, for example), the coins that belong to the category show up in a row.

After that you can look at the info graphics that give you information about each coin, as well as compare the coins in the category. If you click on "Lions", the site will take you back to the previous step.

Wireframe 2.

The page shows the name of the website, the sorting methods and the collection. If you click on the coin, you will get basic information about it.

If you choose "lions", countries that have that symbol show up on the screen. You will be able to click on the country and info graphs connected to that specific coins will appear. If you want to go back, click on "lions" and it will take you back to the main screen.

Wireframe 3.
Same principle as in the wireframe 2 but different layout. I like this one better than wireframe 2 because the navigation is more logical and easy to understand.

No comments: