Embedded Files
Which blend of essential oils will benefit you the most?
Which blend of essential oils will benefit you the most?
An informative interactive exploration to engage customers
This project is a relaxing interactive eLearning experience designed for phones. Its business purposes are to engage the customers of a natural self-care entrepreneur, to identify the customers' needs, and to enhance customer retention.
Audience: Natural self-care customers.
Learning objective: Identify the essential oil blend best suited for one's mood and smell preferences.
Business value: Improve customer retention by gathering preference data to tailor the business offers to the market.
Responsibilities: Instructional design, including metrics extraction and analysis.
Tools used for the interactive prototype: Figma, Articulate Storyline 360.
Tools used for full development: Figma, Articulate Storyline 360, Google Spreadsheet, Google Apps Script.
The context
The context
Marie is a natural self-care entrepreneur proposing hand-made products and workshops for customers to make their natural self-care products. She is exploring how to grow her business online and is contemplating developing eLearning modules for her customers.
I offered her some ideas, and we decided to start with a simple module to help her customers with essential oil choices.
The solution
The solution
Marie and I had a brainstorming meeting to identify how to personalize the experience for her customers: The interactive eLearning experience will be designed for phones to promote casual easy viewing on the go. To further personalize the experience, a little questionnaire will guide the customers toward a blend of essential oils appropriate for their mood (anxious, restless, or depressed) and their scent preferences (aromatic herbs, citrus, floral, or woody).
An information page about blending essential oils was originally planned, but it was changed to two more useful pages: one about diffusing essential oils for inhalation and the other about things to consider when purchasing essential oils.
For her business, Marie is interested in gathering some data about the choices the customers make with the experience.
My process
My process
Marie, as my Subject Matter Expert, approved every design step and provided me with the pages' content.
In Figma
In Figma
I worked closely with Marie to determine the flow of the experience. I represented it with wireframes in Figma for her approval.
Then, I started to work on the visual aspect of the eLearning experience. I first started with a very soft color palette, related to the overall palette Marie had selected, as the experience needs to be both relaxing and gently uplifting.
When Marie came up with her new dark green logo, though, I had to review my copy to integrate it into the pages, making it pop while still blending it with the rest of the experience.
Each mood has its color: a greenish yellow for "anxious", a vibrant orange for "restless" and a vibrant blue for "depressed". These colors are used to select the mood ("the problem") but also to display the result of the choices meant to be uplifting ("the solution"), which explains their vibrancy.
Each scent type also has its color: washed-up green for the aromatic herbs, yellowish orange for citrus, dark soft pink for floral, and light brown for woody. The experience is about choosing a blended scent and these colors are meant to help evoke that odor.
Here is an overview of the visual choices for the experience:
For the result pages, showing which two essential oils would be a good blend according to the questionnaire input, I gave the customer the impression of being enveloped in its scent through two half-page photos. I then dulled the plants' photos to keep the relaxing atmosphere.
Marie started to give me the texts for the result and the how-to pages. With a prototype in Figma, I validated with her the look and feel of the experience.
I planned to design the how-to pages differently as they had a lot of text for a phone screen. For the result pages too, Marie went on to reduce the amount of text she had planned per page.
In Articulate Storyline
In Articulate Storyline
I quickly reproduced the design from Figma in Storyline. There, I disabled the player and selected a 9:16 ratio (540x960) adapted to vertical phone viewing.
For the how-to pages, I used markers in Storyline to incorporate more information while keeping the pages engaging and interactive.
After a first review, Marie reduced again the amount of text displayed on some of the result pages in order to adapt better to a phone's screen size.
Extracting metrics from the experience
Extracting metrics from the experience
Marie is curious about her customers' choices in the experience: What mood do they seek to improve? What scent are they most attracted to? Marie would like to use these answers to prioritize the content of the in-person workshops she offers and to adapt more closely to her customers' needs on her blog.
While using the experience, each time a customer gets to a result page, the following non-identifying data are extracted from the experience:
The order of the customer's choice: Assuming the customer may be tempted to explore multiple options, and therefore get to various result pages, in which order do they get to each one? Which one do they prioritize, and which ones do they explore afterward? I call this order variable, computed in Storyline, "Iteration".
The mood they were trying to improve: I call this variable extracted from Storyline "Mood".
Their first scent preference: I call this variable extracted from Storyline "Choice 1".
Their second scent preference: I call this variable extracted from Storyline "Choice 2".
The day and time of their choices: I call this computed data "Time Stamp".
I used JavaScript to extract these data from Storyline. I then sent them to automatically populate a Google spreadsheet, using a Google Apps Script Web App.
From now on, using her familiar Google account, Marie has access to this spreadsheet in real time, containing the data she can visualize through charts I set up for her on the dashboard.
Adding voiceovers
Adding voiceovers
Optional voiceovers have been added to the result pages to make the experience more relaxing. They use two soothing AI voices from Articulate Storyline.
Ready to turn knowledge into action with learner-focused, effective learning experiences? Let's chat.
Ready to turn knowledge into action with learner-focused, effective learning experiences? Let's chat.
Page updated
Google Sites
Report abuse