2. Zumiez

3. Martin+Osa

4. Target

5. Macys

Of course you don’t have to do it exactly right now now but do it. It is important. Repeat this exercise with few other shops you can think of. Or even better, google for e-commerce sites you haven’t seen before and test them that way.

In many cases your answer would be yes, with some you may not be so sure. You may even come across few shops where you will immediately say “no, I don’t think I trust them”.

And as you can imagine, the first impression you have may affect whether the shop gets the sale or not.

Is there a key to a perfect homepage then?
The first answer that came into my mind was “no, there isn’t”. And it is probably close to the truth although there are few things you should have in mind while working on your e-commerce homepage that can definitely help you.

A homepage should instantly inform the user whether he is likely to find what he is looking for in on your site as well as convince him to buy from your site.

How do you make sure that this happens?
There are many ways to do that. One is to simply ask yourself those 6 questions below when you work on your designs. But answer them from the potential visitors perspective. Or even better, run your artwork by someone and ask him to answer those.

1. Do I trust the site?
2. Do I believe in what they say?
3. Do they understand my needs?
4. What’s in it for me?
5. What do they want from me?
6. Is it worth it?

So what you should do to make sure that your site won’t get a “no”?

1. Build trust.
We discussed this already. The best way to build trust is to make a reassuring statement. This can be anything from how long your client has been in business and how much experience in the industry he has to how popular his products are and how much praise they received.
Testimonials are another great way to build initial trust. They simply say that someone else bought from your client and was happy with the outcome.

2. Show your hottest products.
Is your client going to be selling some hot products? Maybe he is known for a line of specific products? Show them on a home page. Make the user know straight away that they can find them there.

3. State your clients Unique Selling Proposal and Promise.
Every company has those, or at least every company should have them. USP and the Promise can help with converting your visitors to clients. So state them on the homepage, make sure they are easy to spot and written in an easy and understandable manner.

4. Build a clear and dead-easy to use navigation.
This refers not only to flicking through pages but also and the most importantly browsing products and their categories. The easier it is for the user to find out where they are and what they are looking for, the better.

5. Don’t forget about repeat customers.
Once someone purchased from the site there is a chance they will come back. Give those users ways to stay in touch. A newsletter or mailing list are a good idea, bookmark the site option is another.

What usually convinces you to buy from an online shop? What elements of the home page help you to build trust in the shop?

In my first post in this series I wrote about what you need to know to start drafting a scope of work for your e-commerce project. The next step then is to know what elements you actually need to design to make it all work.

I already mentioned in the last post one of my designer friends who was stunned how complicated e-commerce as a project is. As he had put it, it’s not just few pages and some text on them.

And that’s true. There is a lot more to that and the challenge is to know what you will need to design and what those key e-commerce elements are.

So, a typical online shop would be built of the following elements, starting with the obvious:

1. Home Page
E-commerce home pages can take various forms. Some look like typical website ones with only an indication of the shop. Others are a shops front window with promotions and featured products. But no online shop can exist without one, you simply can’t log into the shop itself straight away. Or at least it’s not a good practice anymore.

2. Product Listing
It can be a simple list of products in your shop or a complex one with ratings and comments. One thing is important though, it has to be designed in a way so the client will have no problems navigating between products and categories. So you have to cater for a lot of information to go onto this page.

3. Individual Product Page
You usually see this page after selecting a product on the listing screen. By standard it shows the product description along with some additional info on it and it’s pictures. Some advanced shops also allow for posting comments, reviews and ratings for the product.

4. Informational Pages
These could be any pages not related to products in your shop or the payment process. A good example could be your shops terms and conditions page or its FAQ’s. Or simply a page about the shop.

5. Shopping Basket
Every now and then your clients may want to see what’s in their shopping basket. Practically all e-commerce software allow them to do that via the basket screen. In general it simply displays what the client has put into his basket so far and how much he will have to pay for those goods.

6. Checkout
When it comes to checkout screen the situation is a bit complicated. Many online shops use only one screen for the checkout process although more advanced ones may have the process broken into a few steps.

In general a checkout is a screen on which you can review your order, input your personal details and then proceed with the payment.

7. Payment Page
Depending on your payment method you may have to design screen on which the user inputs their credit card information. Some online payment merchants offer an option to customize their payment screen. In Ireland, Realex allows that and as far as I know PayPal has an option for their US customers where they can customize their payment screen*

8. Search Listing
As in every shop we sometimes may want to ask a store assistant to help us find the product we are looking for. A search facility seems to be the online counterpart to a shop assistant and many of your users will want to use it. Search listing can look similar to a product listing. So depending on how you want to design that you may not have to create this element from scratch.

Some shops would also require:

9. Client Area
This section is not required for every shop although more advanced e-commerce systems would offer the option of setting up a client area.

Client area would generally comprise of a login/user registration screen and admin screen on which the user can manage their personal info as well as payment options and past orders.

Some advanced shops, again, may also offer various statistic tools, order tracking and extensive help system. The inclusion of those will largely depend on the size of the shop you are working on though.

In the next part of the series we will look how all those elements work and the usability of e-commerce projects, common issues and solutions.

* this is unverified information. That service is definitely not offered in Ireland so my statement is based on what I have heard, not seen.

Nowadays the situation seems more complicated. The world and a workplace demand more and more and even the design profession hasn’t escaped that.

I recently met with a good number of my design friends and clients and most of them mentioned a slight discomfort they feel with the more demanding web work they are being asked to quote for. It’s one thing to price a simple website but it’s something completely different to imagine how much work is involved in a bigger web project like e-commerce for example.

What really struck my friends was the complexity of the work involved. It’s not just a layout and content placed on a page as one of them put it. There are way more things to consider even before you begin.

So in order to make things easier for them and many of you I decided to create a short series of tips for designing for e-commerce.

We start off today with a list of what you need to find out from your client before you even decide on the full scope of work for the project.

When you look closely at most average shops, at first glance they all seem to work the same. There is a product listing, detailed overview of a product and a checkout. And that seems to be it.

Well, in most cases it is. Although in order to know exactly what functionality you need to design for, you need to find out few things from your client:

1. Why do they want e-commerce site in the first place
As silly as this question sounds it actually makes sense. I guess in order to create a perfect shop for your client you need to know what are their reasons and most importantly their plans for the new shop.
Is it going to be selling few products only or will it grow and expand over time. This will certainly affect your designs so it’s better to know it from the start.

2. Is it going to be e-commerce alone or will other website functionality be required?
By default e-commerce systems apart from their standard functionality allow very limited, if any content management features. Therefore find out whether your client does not require a Content Management System to manage additional pages in the shop.

Your client may also want to run a blog, or set up internet forums to interact with his clients and these obviously increase your scope of work considerably.

3. Try to find out how many products do they expect to be selling

Depending on the answer you will have to design product presentation that can handle whatever number is mentioned and also allow for the shop to grow if needs be.

4. How many categories do they foresee for their products.
A major part of e-commerce interface is categories listing and in order to design it right you need to now roughly how many categories there are going to be. Will there be any subcategories as well? How does your client want to structure their categories listing? You may have a say on that last one but still it is your client who may dictate the shops structure.

A tip, always assume that the number of categories will change and design thier listing to allow for that.

5. Does your client plan any user interaction

• will they require user registration
• user reviews
• recommended products
• product of the day/week/month

These obviously have to be included in the design as well and very often interactive elements are the most problematic to design for.

It is easy for things to go wrong when you work with e-commerce project. Unfortunately one of the characteristics of the medium is that it can grow and in most cases it will. Your design has to reflect that.

When designing for e-commerce, just like with creating layouts for CMS sites you design for change and that can take a considerable amount of your time which you should factor in for.

Nonetheless if you have all the information you need then unless there is a considerable change of plans you shouldn’t have any problems with creating your layouts.