Magento Installation Process Redesign

A wholistic user experience redesign of Magento first-time installation process.

In the current Magento Installation process, business owner with little technical knowledge often needs to hire someone to set up the store for them. Our goal is to simplify the installation process such that a small business owner with little technical knowledge can install Magento. The design challenge is the limitation of existing technical process. This project was not just re-designing of the installation wizard, we looked at the whole process starting from downloading the code base, having the environment set up, to the configuration interface (installation wizard).

Target User: Do-It-Yourself Business owners with limited technical knowledge.




Persona Groups


Persona Group 1: Experienced-to-Advanced and Technical - “Hardcore” fans

Who?
Knowledgeable in Backend development
Highly knowledgeable in Magento
Contributes to the community
Relies on Magento for a living
Probably goes to Magento Conferences and stay up-to-date

Why?
Faster and easier Magento installation means more clients and faster work process.

Needs?
Full control over all components installed, flexibility
Has access to the Magento server
Good service to their merchant clients or customers
Important to Magento because they advance our community, share knowledge, and contribute to codebase.


Persona Group 2: New and Technical (want to learn Magento)

Who?
Technical developer
Knows how to figure out technical stuff
Doesn’t know Magento System
Possibly looking at other platforms to get into as well

Why?
Motivated to become Magento developer: doing freelance or getting started as Magento extension writerr

Needs?
Learn and build expertise in Magento
Work faster in Magento to get more clients or to get things build faster

Important to Magento because there are not enough developers on the market. If SI can hire more people, they can take on more projects and reduce barrier to use Magento.


Persona Group 3: New (want to have a working store)

Who?
Decided to give Magento a try
Very little to no backend technical background
Could be a merchant wanting to open up an online store

Why?
Merchant - Wants a free and flexible solution
Have to set up Magento themselves
Low budget to hire developers

Needs?
To have a working store / magento instance

Important to Magento because of the upsell opportunities through Paypal and Marketplace revenue.

View persona research


Painpoints

A design workshop was held to evaluate the current version of Magento Installation and figure out our goal. The workshop was participated by Product Owners and Engineers.





Make Errors More Helpful...Improve Language + Logging (2 marks)

  • Reasonable errors + workarounds( 1 mark)
  • Help for multi-host deployment
  • Onscreen help (tooltips, etc)
  • Automatic Logging, Prferrably to one place
  • Help me understand when something fails, how to fix? ( 1 mark )
  • Error Messages are too technical, no clear direction of how to solve it. ( 3 marks )
  • Language use in downloader wizard is not self-explanatory & no instructions
  • Ability to actually delete first time install UI and code

Help w/ MySQL & PHP

  • Provide better experience during insallation: provide info for the hobbyist merchant. (List of PHP Extensions, List of System Requirements, Hosting Provider)
  • Instructions for users for more technical process (install PHP, DB setup)
  • Need to install PHP in beginning could be frustrated.
  • Getting Started. How to begin installation? ( 5 marks )
  • Remove of MySQL DB Requirement.
  • Help me with Dependencies PHP? MySQL? Huh? ( 1 mark )

Simplify Workflow

  • Easy VS Advance mode
  • Rollback or failure
  • Time and complicated, during installation application, too many settings ( 2 marks )
  • Make Extension Manager directly available as a page of admin, Should allow them to install extension without getting out of admin page

Sample Data

  • During 1st setup,can install sample data ( 4 marks )
  • Easy Install Sample Data (Reference Store)

Integrity Check & Compatibility Check before committment ( 3 marks )

  • Validation/Info on what might not work for install/upgrade
  • Automatically check for core upgrades
  • Host Validation ( 1 mark )
  • When upgrade a version, if can’t upgrade now because extensiosn ( 2 marks )

Quick + Easy Install & Upgrade

  • SOLR Redis
  • One quick install like wordpress?
  • Upgrade Process: 1-click install for upgrade, (provide interface)

Interface Improvements

  • Information hierarchy is not clear in Connect Manager.
  • Make Extension Installation More wizardy
  • Progress Indicator ( 2 marks )
  • Estimate Install or upgrade time

Credentials

  • Too many credentials (.com, admin, DB credentials)

Research of Existing Solution



User Flow of the End-to-End Process



User Experience of the Installation Wizard



Usability Testing of the Installation Wizard


Format: In-person interviews. We guide the user through the test scripts (10 questions) while letting the users walk through the prototype.

Prototype: x3lib5.axshare.com

Participants: 7 participants total, 2 technical-background users, 5 non-technical background users

Test Results:



Recommendations

  • Improve ‘getting started guide’ system requirements. (add screen shots, described in a less technical term, provide specific URL for user to navigate to the wizard)
  • Provide more specific helps on the Readiness Check screen (explicit commands, directions)
  • In option 1 of Database Set Up step, explain what the system will do if user select this option and communicate clearer about which username/password is required.
  • In Database Set Up step, explain ‘table prefix’, ‘host’, and database related fields.
  • Improve the way we communicate relationship between ‘find it for me’ and explain to the domain URL to user. (provide example of format)
  • Explain more clearly that these sample data are fake data.
  • Rethink how we present Allowed Locales to users.
  • In Create admin account, explain that this is new account that need to be created and provide supporting info. (password detectors).
  • Provide input validation in each of the steps before user move forward to next step.
  • Think about whether we should show information in the first screen of installation for users to confirm before they click “Install Now”
  • If possible, provide a more specific solutions right on the screen when error shows up.


Final Design

Strategy 1: Easy/Advanced Mode

The goal is to make the installation process simple and fast. Therefore, we will hide any unnecessary info. The Easy Mode is all the necessary info. we need (technically) from the users to complete the installation. The Advanced Mode is for advanced users who want to be able to configure Magento. In other word, we show the information as needed.

Strategy 2: Communicate Clearly to the User on a Need-to-Know Basis

The installation process is highly technical and the users doesn't need to know everything. However, we want to keep the user inform and give the user feedback to what the system is doing. An example is the animation to show the environment checks that the system perform. We categorize the checks, and show them progressively to not overwhelm the users with all information at the same time.

Strategy 3: Be as Helpful as Possible in Error Cases

Errors handling was a huge painpoint. In this new design, we are being more clear and more helpful about the errors. We will try to resolve errors for the users. But if not possible, we will provide simple and friendly error messages plus any helpful wiki links.


Customer Journey Research


After the product launched, we interviewed 9 participants about their overall installation experience. The results are shown in the customer journey map below. The installation wizard received many positive feedback. Users commented that it is a great improvement from the original installation wizard.

Goal

Discover the pain points in the installation process from “the moment the user decided to use Magento” to "successfully installed Magento.”

Test Script

https://www.dropbox.com/s/g0qxoqtdostmqhr/InterviewScript.pdf?dl=0

Persona Groups

Persona Group 1: Experienced-to-Advanced and Technical - “Hardcore fans”
Persona Group 2: New and Technical (want to learn Magento)
Persona Group 3: New (want to have a working store)
View persona research