Website Design:
Scholastic Book Fairs
Client: Scholastic Book Fairs
Orlando, FL
In 2010, I was hired as a contractor to redesign the Scholastic Book fair's (yes, that Scholastic Book Fair) eCommerce website. I researched both eCommerce design at the time, as well as the best practices for eCommerce. Since Scholastic's book catalog was large, we used Amazon's organization system as inspiration. It was a system we knew users would find familiar and it gave us a couple different ways to offer up search results. Users could search by genre, series, book title, top sellers, etc.
We also had a collapsible list left hand menu with categories and titles users could navigate to on their own. The home page had a carousel that cycled between featured books, and offered up suggestions based on the user's past searches. I stuck with the Scholastic branding of red and blue and made sure the big, candy buttons were kid friendly and easy to read. I also drew up faux 3D icons for our shopping cart and links. The goal was for it to be inviting and friendly enough for kids to use it, and also streamlined for parents to be able to easily make the orders. While design trends come and go, much of the eCommerce concepts we used here are still eCommerce components utilized today.
Applications Used
🔧 Adobe Photoshop
🔧 Adobe Dreamweaver
Project Breakdown
Home Page
The header utilized dual navigation bars. The top navigation allowed the user to easily and quickly get to their account, wish list, and cart. The main navigation bar linked to different ways to sort through and find books.
Login
Basic sign up/login form and screen for parents and teachers.
Series Page
After you clicked on the series tab, we gave an image of the cover art and a brief text description of what each series is about. Giving kids and parents a quick visual to see what they were looking for, or to see if it was a series that they may want to read.
Category, Age, and Grade Pages
These pages utilized a grid layout with an image of the book cover, title and pricing. We added buttons for users to quickly add a book to their shopping cart or wish list, or they could click on the image or title to go in for a larger cover image and book description.
Product page
The product page gave a larger view of a book's cover art, the author's name and a brief description of what the book was about. Users could add a quantity if they wanted to buy more than one copy. Standard add to cart and add to wish list buttons, as well as a "Continue Shopping" button for users to back out. Below the product, we showed users any books that may have been related to the book they were currently viewing, as well as a list of what they had recently viewed for easy callback.
Wish List
Users could create multiple wish lists either for multiple children or to send to others via email.
Shopping Cart
Checkout and Billing
Order Confirmation
