We implemented a new checkout on one of our client's BV sites, Patio Gallery. We used Cliff's Quick Checkout as the starting point. We'd like to think that this is a best-practices implementation, though I'm sure that it's not perfect for everyone. I would love to get some feedback from some of the merchants here. Below is a list of the changes from the typical one-page checkout process. Thanks for your help!

http://www.patiogallery.com


Create Account link (header) -- this link has two states. If you are not logged in it says "Create Account" and links to the account creation page. Once you are logged in it says "Your Account" and links to your account pages.

Sign In link (header) -- this link also has two states. If you are not logged in it says "Sign In". Once you are logged in it says "Sign Out".

Login page -- the goal with the design of this page is to make it very clear what the user should do. The side-by-side login/create account forms carried over from BVC2004 isn't terribly clear.

Checkout button -- when you "Checkout" button in the cart you are taken to a login page similar to the one above, except that if you do not have an account you are permitted to continue to the checkout page. Again, the goal was to make it very clear what the user should do at this point. If you are already logged in than you are taken directly to the checkout page.

Checkout page
The design of the page is similar to Cliff's original design except the forms are arranged in a single column. The idea was to make it very scan-able and linear. The open left column is intended for the merchant to add any explanatory text that might be helpful to a customer, though this client has not yet taken advantage of that.

The email address field uses AJAX to validate that the user does not already have an account. If they do, they are given a message and a link to the login page.

We added the promo/coupon code box to the page giving the user another opportunity to add any discount to their order.

Finally, we have the user account creation as the final step of the checkout process (assuming that a user doesn't already have an account). The user's email address that they entered at the top of the page is restated for clarity above the password fields. We changed the functionality of BV so the email address is used as the username, like it was in BVC2004.

Too early to tell. We just rolled this out on Monday. I'm not sure that a one-page checkout is ideal for everyone, but I think the ideas applied here could easily work for a multi-page checkout.

Maybe I'm a bit dim, but at first glance on the login page, I didn't see the "Don't have a Patio Gallery account?" option (yes, I know it's right there in front of me). Personally I think a side by side set of options (Returning, login "OR" New, create) is more obvious.

John

I see how you could miss the initial "don't have an account"....make that stand out more if possible.

Also, I can see the account creation/password choice being a problem. Having the text for the account email there, but not the box or an explanation of "we'll use the email address you provided" will screw people up.



By the way don't thank Cliff, we paid for that mod which he then made public and which you're all using as your base. :) Still not sure how I feel about that, but what's done is done.

OK, so we made some changes to the login page per everyone's comments. Take a look and let me know if you think it is easier to understand.

https://www.patiogallery.com/login.aspx?ReturnURL=~/checkout/checkout.aspx

Aaron

I agree, this is much better, (although not a good "blind" test given I saw the original!). I also think changing the order of optons is better (New first, Returning second), by definition, returning customers will be a little more savvy and less likely to miss the option relevant to them. A good example of smart design making a difference I think.


John

Derek,

I wasn't planning on it, mostly because the change of using the email address as the username requires changes throughout the source code. If we removed that change, it would be possible to offer it as an add-on. Honestly, though, I think using the email address as the username is one of the biggest improvements.

It sounds like there is some interest in offering this as an add-on, even if the email address is NOT used as the username. So, we'll look into packaging this as an add-on. The username field will need to be added to the bottom of the page allow with the password field.

Aaron said..."I wasn't planning on it, mostly because the change of using the email address as the username requires changes throughout the source code."

[/quote]
I dont know if I agree with that. We phased out user names long ago. Change the site term for username to email, change any hard-coded "username" labels to "email." On the 'create account' pannel, add a validator to the usersame input to validate it as an email, and and change the second input (which formerly was email) to "confirm email." You lastly add a validator to ensure your email (formerly username) and confirm email (formerly email by itself) match. Done!


The only hitch comes if a customer changes their email. You must make a code snippet to change the 'username' too.

I'd strongly vote in favor of email for this purpose.