L2 Page 5

Requires a Java Enabled Browser.

E-Commerce Tutorial Lesson 2 Page 5 by Kevin Hakman

— The Design of a Storefront ---

Denise's design is clever and straightforward (you can see it for yourself at ramforless.com). The first part of the shopping experience enables customers to quickly find the products they want and add them to their shopping carts, right there on the front page. The second part processes the orders and securely sends them to the fulfillment center, where they're packed and shipped to the customers. The third section offers a summary of their orders and functions as a printable receipt.

Denise's first interface asks the customers about their equipment and then tells them which RAM chips they need, using the configurator:

The display is designed to up-sell and cross-sell the chips against one another by displaying all the options and prices at once and highlighting the savings the customers will get when they place larger orders. The shopping cart always displays what items are in the order. The same page is actually loaded into the browser again and again, each time with additional information. This results in a fast, smooth experience for users.

The second interface is modeled after an order form:

When customers click checkout, they see this page. All the items in their shopping carts are itemized and subtotaled. Billing and shipping addresses are captured first, allowing tax and delivery costs to be calculated and added to the bill.

The final costs are totaled and displayed, along with the warranty and guarantee policies from legal. Payment information is requested and then processed in the background. If everything is correct and acceptable, order confirmations are created, complete with your company's phone number and tracking numbers for the customers' reference:

As before, the site is cycling through the same page repeatedly so that users don't have to take time to find their way through a new interface every time the screen is loaded.

So ramforless.com is taking shape and looking good. The design team has put together a great interface that matches your requirements, and management loves the ease of the "1-2-3 Buy Now!" concept. (You may not be so lucky; most site design processes take quite a bit more discussion back and forth.) The next step is to implement the backend, making sure Denise's buttons actually work and customers receive the products they ordered.

You see, just because a site looks slick doesn't mean it works. A simple interface can hide a complex and powerful set of tools. So which tools should you use? In Lesson 3, we'll help you assemble your requirements for the more technical stuff and hook you up with the right solution for your particular needs.

On to Lesson 3