alphabetdeals.com

Alphabetdeals.com Project Summary

Google Analytics reports were showing a 65% bounce rate from users on the checkout page. Conducted a competitive analysis to understand what competitors are doing and how they are achieving their goals. Create wireframes based on the research. Re-design the checkout page of the item page, checkout page, and sign-up page.

My Responsibilities

  • User Research
  • Experience Design

Timeline

3 Week Project

 

Interesting Facts

The team comprised the CEO, the developer who lived in India, the project manager who lived in Canada and myself.

Heuristic Evaluation

I began with a heuristic evaluation of the checkout process and I was able to uncovered inconsistency with the process. I discovered the user’s confusion and frustrations, aplahbetdeal.com created various buttons and various ways to sign up and check out items.

Take Aways

  • The checkout process uncovered inconsistent terminology and visual design layouts.
  • Too manny buttons which was confusing and it did not guide users to the next step of the check out process.
  • The Sign-up page was incredibly overwhelming, and I wasn’t sure where I should go.
competitive analysis

Competitive Analysis

The CEO of aplhabetdeal.com did not want to conduct a usability test do to cost. Then I was left to conduct a competitive analysis of other e-commerce businesses, Macy’s and Overstaock.com to observe their strengths in the checkout process. I was able to discover what these bigger e-commerce sites were doing so well. I was able to observe what their strengths were and how we can improve on the checkout experience for our customers. Conducting a competitive analysis I was able to gain a greater insight into what competitors are doing and how to achieve the same success.

Take Aways

  • Themes that worked well for Macy’s and Overstock.com were having Call to Action button the most prominent button on the page for users.
  • Layout design was simpler and guided the users to the next step without any confusion or frustrations.
  • Having the product most prominent image on the page.
Low-Fidelity Mock up​

Low-Fidelity Mock up

I proceed to create a lo-fidelity wireframe based on the data I retrieve from the competitive analysis and I start sketching different layouts on how we can decrease our bounce rate and better our user’s experience. The reason I created lo-fidelity wireframes is to understand how the layout will view in mobile as well as on desktop. Starting with this method allowed me to create multiple wireframes very quickly which guided me to create med-fidelity wireframes.

Take Aways

  • I was able to collaborate with my team members who, to discuss what was the best avenue to go with.
  • I learned how to work with team members who are working remotely and different insights of the designs.
Med-Fidelity Mock up

Med-Fidelity Mock up

After creating my sketches, I was able to begin creating med-fidelity mockups to understand the placement of the elements and the size of the fonts as well as how the layout will be easier for the users.

Take Aways

  • I was able to design a higher quality layout which allowed users to have an easier checkout experience.
  • After developing lo-fidelity wireframe,s I was able to collaborate with our project manager and CEO to discover the best layout based on my previous research and designs.

Hi-Fidelity Mock up

When creating the hi-fidelity mockups I wanted the “Add to Bag” to be the dominant element on this page. Encouraging users to add this item to they bag to proceed to the check out page.

Take Aways

  • After I created the layout I was alble to add color, fonts and images to observe how the layout would look.
  • After developing hi-fidelity wireframes I was able to collaborate with our project manager and CEO to discover the best layout based on my previous research and designs.

Final Design

Unfortunately, I left the company before I was able to see the performance of the new checkout experiences. I also gain a lot of experience in learning how to work in a start-up environment, understand how to solve problems more effectively with little to no budget, and how to collaborate with stakeholders. My contract was up before I could view what the end result was.

Final Take Aways

I learned how to work with team members remotely and how to work with some of my team members who do not speak English.