MEUBLL, our first Front-Commerce’s Custom Theme – Part 2

By 26 June 2018 Non classé

MEUBLL, our first Front-Commerce’s Custom Theme – Part 2

By GRENIER Johanny - Publish on June 26, 2018
Test utilisateur

Involve your (future) users

Wireframes are done, it is now time to organize the first user test session.

Receive user’s approbation on basic features early in the process, after the conception phase, is very important! It avoids starting the UI Design phase without any idea of what users think about the application.

Gather feedbacks early in the conception phase allows to quickly and inexpensively redefine, if needed, the purpose of the app.  It is easier (and faster) to make changes on wireframes (grey levels) rather than HD mockups, meticulously created and with pixel perfect finitions.

Testing on wireframes, users will be less disposed to only concentrate on the graphic appearance of the app. They will give more importance to features and accessibility, critical and needed points of a perfect User eXperience. Gather feedbacks on these points is one of the core objective of these first tests.

The test consists in directly observing the participant while he's using the application.

- Interfaces Ergonomics, 5th Edition -

Obviously, users tests should be well prepared! Finding target users, preparing questions to ask, administrative documents, having a functional prototype, audio/video material… that’s a lot to check in before starting to test anything. 

In this second part, I propose you to explore how, at Front-Commerce, we’ve organized these tests. However, it is important to mention that we were not used to do this kind of things. We did our best with our abilities, getting inspired a lot by other’s works. The result is a perfectible methodology, which however allowed us to learn and improve a lot.

This is not a perfect methodology to use in all cases. You should adapt it to your own context and issues.

Ready? We’re off! 🙂

Our methodology

First step: have a clear vision of the objectives. This step is crucial is you’re hoping to get relevant results.

What is it about? It is about being able to define and justify the following points:

  • What are the test objectives?
  • Who are the target users we want for it?
  • How is it going to take place?

To do so, three documents are essential: a test plan, a recruitment grid and a test protocol. These three documents are very easy to complete and very useful overall. You’ll find some templates further away in the article. Let’s go into the details.

The test plan

To me, this is the most important document.

Once it is completed, you’re supposed to have a global overview of your test process. This document is like a roadmap you’ll follow during the entire iteration.

This is a generic document, it does not detail as much as a test protocol, but give you keys to conduct successful tests. It also allows external people to clearly understand core objectives of the approach.  Take your time to complete this document, it will be the corner stone of your iteration.

Download : Test plan – Clean

The recruitment grid

Having a clear idea of what type of users you want to be testing your app is important. Test with inappropriate profiles can conduct to counterproductive decisions. Of course, you want to avoid that. Please welcome the recruitment grid.

It allows to rationalize users profiles who are going to participate in the tests. It should contain the following informations: 

  • participants criteria requirement (Who are we recruiting?)
  • retain/rejected values for these participants (Why do we recruit them?)
  • questions to ask to users during the recruitment to evaluate their positioning regarding the criteria (What will we ask them?)

Once the grid is completed, you’re supposed to have a clear vision of users profiles you want to recruit for your tests. Obviously, each project, even each feature should have its related recruitment grid. Adapt it following your goals.

Example : 20 persons answered positively to participate on a test session concerning a checkout process. Following the grid, out of these 20 persons, only 5 will be retained because they matched our wanted criteria and values for this project.

Download : Recruitment grid – Clean

The test protocol

Last but not least, the test protocol. It is your best friend for your incoming test session. It contains all required informations needed for a perfect test proceedings, once you’ve recruited your participants. It is composed with the following parts:

  • tasks to realize, clearly defined. Objectives are clear, easily understandable and everything required to do each task is provided to the user.
  • questions to ask, following test objectives’. Needed to define what can be directly asked to the user.
  • behaviours to observe, verbal or non-verbal. Needed to define what cannot be directly asked to the user.

Examples: activities and tasks, time to complete each one, every screen users will have to study, users failure and success, comments…

Download : Test protocol – Clean

Once these three documents are completed, you’re ready to start to recruit your users. Then, it will be time to test!

Before we start telling you about our own test session results’ for our theme, here is a cat picture.

Relaxant non ?

Feedback: MEUBLL theme's test session

Concerning our first theme, test results has been really promising. They allowed us to validate and improve our wireframes with some relevant user feedbacks, especially concerning the wording we used. Let’s have a look on how it went, and what we’ve retained.

Objectives and participant recruitment

MEUBLL theme’s objective is to highlight grouped product purchase, through products collections. This objective encourages us to think about an alternative way to navigate across the site, and also a better way to highlight our products with an interactive image. User tests were implemented to help us validate these concepts, and improve them with relevant modifications based on user’s needs. All of it before the beginning of the UI Design phase.

Concerning participants recruitment, we decided to select people which already had bought something online on mobile (because tests were made on the mobile version of the theme), people with a sensitivity for decoration and home arrangement, and people confortable with new technologies. Somebody being able to come out to our office also was an important criteria.

Two people met our criteria, and they both accepted to come out and test the theme. Two people might look like a little number, but it is fair enough to obtain really relevant feedbacks. The “ideal” number for a test session is around 5 persons, but it really depends of what kind of project you’re actually on.

Combien d'utilisateurs

What we've learned with these tests

The interactive image must be easy to interact with. The feature was really appreciated, because it gives users a clear vision of how products balance together. Users can project themselves, and don’t have to visit each product page to have an overall vision of the collection. Visual is very important here: it is a part of the user experience. A usable and beautiful interactive image is required.

Effective filters. The lack of effective filters and the impossibility to perform custom searches has been point out during tests. There are a lot of different rooms to customize, with a lot of possible products and styles for each one. So we decided to add a complete filter system, asking users to select a specific room to furnish, and then ask them to choose among different styles for this room. It allows users to filter collections at the start, and so lighten the search process.

Gathering feedbacks during the conception phase is interesting to insure yourself you’re going in the right direction. Users are responsible for your future product: involve them from the start increase your chances to create an application which will answer their needs.

In the next part, we’ll talk about the design phase, and how this one took advantage of users’ feedbacks we obtain during our test session to create a relevant design.

Introduction 

Part 1 : Develop an idea, create value, stay inspired

Part 2 : Involve your (future) users You’re here ? 

Part 3 : Create a tailor-made user experience COMING SOON

By GRENIER Johanny - Publish on June 26, 2018