Final Bookstore Webpage Layout Design

So like I said before, I designed this piece around my experience with my favorite bookstore (that is no longer in business) Borders Books. For me online shopping was my favorite thing to do since I always loved to travel as a kid. My computer was my BFF!  I designed the layout to match the  portrait/tablet (1024 x 664). The color pallet is centered around the gift card. The gift card (see below) had a certain texture quality and I really wanted to keep that theme around my web pages. The Border's colors are Black white and the dark red.

My First page is the obvious Home Page. Here you have the option to look at books,e books,toys, mags,electronics,home and gifts.etc. On the left side of the page I decided to show a teaser of the store's bestsellers. Due to size the user would have to ether scroll down or click on the number pages below. On the right side is a daily calendar that would update (in flash duh!) showing the hottest book to hit the shelf. This will keep readers easily informed.

For my second page is meant to be a specific search. I chose my favorite books Harry Potter by J.K. Rowling. As you can see when you type HP several items show up such as DVDs and Books. I also created a "mini advertisement" promoting the Nook opportunity.

The Third page is designed to follow a certain book. I chose Harry Potter and the Prisoner of Azkaban. At the top of the page shows the original cover art (I turned into b/w), customer ratings, and a piece of the movie promotion clipping ( Have you seen this wizard?). I really wanted to harness a darker theme, since this book is (in my opinion) the beginning stages of Harry learning to mature and  handling more darker evils aka You Know Who's rising.

Under related subjects are a series of links that the view can click on to examine the book further. Under that section is the other suggested books that readers may enjoy. Then finally I decided to conclude this piece by showing the available formats. I didn't want the ending part of this page to be so "bottom heavy" so I used a simple text to list pricing and options.

Overall I really enjoyed this project. Heck I may have even liked it more than the Craig's List. It is rather personal because it reflects on the way how I shop for books. :)

Bookstore/Music Store Experience Project

So my favorite book/music store that has been shut down was Borders. I knew about these guys before Barnes and Nobles. I loved this place so I deiced to use them as my project. 

 logo

 store

 store sign

gift card

Final Images of my Hickory Dickory Project

Rooms for Project

My style for this project is a mix of Jibjab animation and realism. Think of the Angela Anaconda clip. I deiced to add my own personal spin on the backgrounds by creating a scrapbook (cutting,editing, and pasting) format.

Story line Flash Characters

Hero: The Mouse
Villain: The House Cat
Damsel in Distress: The Princess from the Grandfather Clock

Hickory Dickory Dock Flash MAP

Characteristics of Good Interaction Design

Clever:
Clever is being intelligent without being condescending and using humor without being obnoxious. Clever products can be delightful and pleasing. Websites I find somewhat clever are Grooveshark.com and Last.fm, free music streaming sites where music is uploaded by users to be shared; the sites also recommend new music to users based on their interests.

Appropriate:
Different cultures and audiences will react to things differently. Designers wouldn't use the same technique to design a child's toy as they would a military communication design. In the same sense a website targeting kids would be approached differently than adults.


Smart:
Products need to be smart to do things for us that we have trouble doing; detecting patterns, memorizing things, performing calculations. For example, your cell phone can store more phone numbers than you can remember, so you don't have to. Another example is a GPS system that not only tells you where the closest gas stations are, but lists their prices so you can find the cheapest gas nearby.


Responsive:
The product should give some sign that the action was 'heard,' such as an hourglass or loading bar to let us know somethings responding. Responsiveness should be characterized by four levels: Immediate, Stammer, Interruption, Disruption. Responsiveness makes users feel understood. It's important that shopping sites be responsive, otherwise users may become impatient and hit buttons more than once causing unwanted purchases, or in other cases a wanted item may not have been purchased at all even if the button was hit.


Trustworthy:
A site or product needs to be trustworthy in order for users to more deeply examine, interact, or purchase a product. In particular shopping website should be especially trustworthy and safe to not jeopardize the personal and financial information of it's users.


Ludic:
Refers to playful design. It doesn't necessarily mean game or toy design, but often users that seek out new products would like to try them first. The user must feel relaxed and there should be a lack of serious consequences. Many software products offer free trials, so you can test drive before you buy. It allows a user to 'play' around and discover all the product has to offer before they commit to a purchase.


Pleasurable:
If a product or service isn't pleasurable users aren't likely to use it unless absolutely necessary. A product should be pleasurable both aesthetically and functionally. Users are more likely to be forgiving of mistakes if a product is aesthetically pleasing. Websites that feature interesting loading pages are more likely to keep the interest of the user. It helps to pass the time, they may not even realize the page takes so long to load if something is there to keep their interest while doing so.