in , ,

Tomando Bottles: The Product Centered E-Commerce Experience

Tomando Bottles is a unique bamboo bottle manufacturer with one product to launch. CodeTactic made their E-Commerce to sell it.

Tomando Bottles

Tomando Bottles is a unique bamboo bottle manufacturer with one product to launch. CodeTactic made their E-Commerce to sell it.

The E-Commerce Challenge

Tomando Bottles needed a website to focus on one thing: Selling that one released product with low inventory life on the shelves.

The E-Commerce design and experience of the user had to be centered in that product allowing the visitor to fast understand it, see it’s features, and add it to the cart.

1. A simple homepage. What do we want the visitors to see and click on?

So, let’s take a look at the two main actions here:

Within the first 2 seconds of the homepage showing off to visitors, you can tell two things:

Primary Focus: The Bottle, image and description title. 

Secondary Focus: Contact info (e-mail, Free Shipping Notice, Social Media Icons, etc. All relevant but not necessary.

2. Descriptive Product Page

This product centered web design carries on the goal within the product page. A simple page that has the product focused in the middle and descriptive icons with titles at the left.

No big paragraphs explaining the features of the product, etc.

Once the customer adds the product to the cart, two things happen:

  1. The visitor gets automatically re-directed to the checkout process.
  2. If in case they want to come back, their cart follows them in the form of the sidebar “Mini-Cart”. Say the customer wants to check out the homepage a little more. They would see this:

3. Custom Checkout Process

We implemented what we call an “isolated check-out page”. This means essentially that we take all other “distractions” or elements from your website once the visitor gets to the crucial part: The Checkout where a sell is finalized.

This is done to achieve key things:

  • Get rid of distractions or possible “secondary focus” links.
  • Focus on the always tedious task of filling out details. It’s true, there’s no way around this and it is a pain point for the customer – So, isolating this makes it look cleaner, faster, easier.
  • Guide the customer. The step by step tells the customer exactly what there is to be done and this leaves less room for the user to not knowing where to go.

All of these are simple ingredients to maintain a product focused web design. As Tomando Bottles grows, the homepages adapts in terms of the slider showcasing other products, or perhaps giving more space to “Similar Products”.


Written by Gonzalo


Leave a Reply

Your email address will not be published. Required fields are marked *



The Perks of Using Online Advertising

How to manage and edit my websites by CodeTactic