Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

MY website has the following buying flow:

Select a product > Choose the product specifications > Additional Options / Choose delivery method > Shopping Cart > Log-in > Payment Page.

I'm trying to implement a simpler version of the website header along the flow, so that the user gets more focused and that way, try to increase the conversions. like Amazon does:

http://puu.sh/4oCju.png

From which stage do you think I should implement the simpler version?

From

  • Additional Options, or
  • from Shopping Cart?
share|improve this question
    
How related are "Additional Options" and "Choose Delivery Method", since they take up the same block in your buying flow? To me, "Additional Options" means things like adding a warranty or selecting an upgrade for a feature. –  Arman Sep 11 '13 at 14:44
    
Can your customers purchase more than one product in a single transaction? In other words, can they loop through the select product/choose specifications bit multiple times before going to the checkout and placing the order? –  Matt Obee Sep 11 '13 at 14:54
    
On Additional options & delivery the user can: a) select shipping option b) choose the kind of production (since its an online printer website) c) select the type of file that is going to be selected d) ask or not for a printed proof. –  tambourine Sep 11 '13 at 14:55
    
Yes, they can add as many products as they want. –  tambourine Sep 11 '13 at 14:57

2 Answers 2

up vote 0 down vote accepted

The header from Amazon describes steps in a flow and is meant to visualize the steps and if I recall correctly, lets you go back to a previous step.

If you have a predetermined linear flow (with only one option of a step to proceed to from each current step), then you can visualize it in the same manner. In the case, you should start the visualization from the first step in the flow from which there is only one possible way to continue.

Specifically, in your case, the flow you described does not seem to be linear or to make much sense. The flow should start with the user clicking on "order now" or alike on the basket and if you require login, then perhaps the user should log in before hand. If the login is only for payment, then perhaps the login is redundant (even in PayPal you don't have to login in order to pay).

share|improve this answer
    
Yes, the flow is not great. We bought a specific software that has some limitations, but right now we can't change the flow. It is something that I really want to work on though, whenever there's the chance. –  tambourine Sep 11 '13 at 15:23
    
@tambourine It is unclear when the items are added to the basket - before or after choosing specifications or both. –  Danny Varod Sep 11 '13 at 15:25
    
On "Select a product" you choose a Business Card and on "Choose the product specifications" you choose the format, paper, finishings, quantities, etc. (The communication/text is not as I've added in here, as I'm translating from the original language which is not english.) –  tambourine Sep 11 '13 at 15:27
    
Is there some point after which the flow is straightforward? E.g. after adding all cards to basket and configuring them all you click on "buy now" and continue until payment? If so - that is you point of start for the wizard header. –  Danny Varod Sep 11 '13 at 16:48
    
After having all products on the shopping cart, I go to Payment Page. That's it, no other pages in between. –  tambourine Sep 11 '13 at 17:08

My personal rule of thumb for simplifying a website's chrome (header, footer, navigational items) is do it whenever it makes sense. Amazon was one of the first to do it because they understand that conversions increase the less chances users have to exit the process with other links.

Bred out of necessity, simplifying or even header a website's chrome became fairly popular within mobile apps. The Pinterest iOS app is a great example. They hide the top bar and bottom navigation bar as a user scrolls through content, revealing it again when a user moves up stops moving for a period of time.

Within the last few months, this design pattern has started resurfacing within desktop websites. MailChimp does this (Example: Features) with their new website. Apple's new website also employs this within their new iPhone websites, hiding the overall site navigation as you start scrolling down the page, leaving only pertinent links and focusing on the content.

In all of the above cases, content was removed that could hinder users from completing the primary task. In your case, I would look at ways to start focusing the user as soon as they choose a product. At that point you know they're interested and want to convert them as quickly, easily and effortlessly as possible.

share|improve this answer
    
Agree with that design decisions on likes like Amazon's should be tied to business decisions and good UX. Wont' hurt to A/B test after the design changes too. –  Jin Sep 13 '13 at 19:02

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.