Stellar Driven Sales Mastery

Immersive, scenario-based training focused on helping sales associates to close sales effectively while achieving high customer service ratings.
E-Learning

Overview

Applying the ADDIE model along the way, I iterated each step of my process until the content, the look, and the feel of the learning experience satisfy the expectation I have for this project.Β 

The Problem

The Solution

How I arrive at the solution above? And what happen after that?

Analysis

Part of the analyses conducted for the project

Based on the analyses, here is what going to happen next: designing the solution.

My full design and development process then started from: creating an action map β†’ scenario development β†’ drafting a storyboard β†’ designing visual mockups β†’ to building an interactive prototype and the full course.

Within each iteration and before moving onto the next stage, I had collaborated with the project sponsor Cloud9 Facial Manager for product information and approval. Once all approved, I fully developed the project with Articulate Storyline 360 and made final changes according to feedback collected.

Design

Action Map

Scenario Development (using CCAF Framework)

Immersive Context and Challenge

β—Œ The actions performed by the beauty consultants will take place inside an outlet of Cloud9 Facial, at the reception desk area where the consultant make conversation and recommendation to customers.
‍
β—Œ In their daily work routine, they will typically meet customers who are either first-timers without prior booking or someone who has made a booking via their page. Regardless of the personas, the majority of customers preferred to have a personalized treatment recommendation. Some may take it, some may not.Β 

β—Œ The challenge is to not only ensure bookings (i.e. sales eventually) are driving up, but also to keep customer satisfaction at the top of mind, such that the customer really feels that they are being well taken care of - to show them that you really care!

β—Œ These personas and challenges will be presented in a form of two customer encounter and engagement sessions.

Action Branching

β—Œ The sets of actions the beauty consultants supposed to take are developed within the context of customer encounter and engagement.
‍
β—Œ High priority actions identified in the Action Map process are the focus here as learners will need to make the right next action in order to ensure customer satisfaction while keeping their sales in.

β—Œ Learners will have unlimited try for these actions until they get the idea and logic behind. Hints are provided as part of the session to ensure even novice-learners will have good learning experience.

Strategy Feedback

β—Œ Each action choice will lead to a different consequence in a form of customer response (happily or negatively) and review left on the company’s website (Rating from 1 to 5 star with 5 star being the highest).
‍
β—Œ These feedback are strategically presented as customer response and review to let the learners experience real life scenarios when customers are dissatisfied, what would happen and how would that affect the learners individually as beauty consultants and the company as a whole.

β—Œ From there, the learners will be able to recall the experience every time they face such real life situations and know what they are supposed to do or how they are supposed to react.

Full Overview - Flowchart of the Course Scenarios

β—Œ To help learners internalize desired behaviors, I included consistent – yet varied – storytelling scenarios that resulted in meaningful rewards and consequences. I conceived the characters, their storyline and plots, as well as included a mentor to guide the learner through the scenario.
‍
β—Œ Review the full storyline developed based on the framework: context, challenge, action, and feedback (CCAF) below.

Development

Storyboard

Visual Mockups

Mood Board/ Brand Guideline

β—Œ Based on the audience analysis, salon analysis (matching salon brand vibe) to create familiar environment and determine the choice of colors.
‍
β—Œ Font size has the most to adjust. Some choices or scenarios rather have more texts to deal with, within each choices, so I had to reduce the font size for body text, from 20 to 18 to ensure there is enough white space, not too clustered, yet not too small for the audience with at least a 13 inch screen (when they do the e-learning on their laptop).

Background Design

Backgrounds are built based on the storyboard. Estimated amount of backgrounds needed as basic foundation are 5 different backgrounds: the Facial Outlet from outside point of view (first and last slide), the counter view for Mentor introduction and instruction throughout the course, the employee view for most of the interactions in different scenarios, the treatment room
‍
β—Œ The Facial Outlet from outside point of view (for the first and the last page of the e-learning course)
β—Œ The counter view for Mentor introduction and instruction throughout the course
β—Œ The employee view for most of the interactions in different scenarios and questions
β—Œ The treatment room view to show subsequent events happened after each answer choice
β—Œ Subway/ MRT view for customers to leave reviews after patronizing the service (consequence slide)

These backgrounds are built from scratch, element by element, depending on the needs of each scene.

Character Design and Animation

β—Œ Based on the CCAF design and storyboard developed, I have developed 3 characters
‍
β—Œ They’re created based on the 2 customer personas built - who their ideal customers will be and how the expert will look like
‍
Persona 1: A college student whose purchasing power is rather limited as compared to the second persona.
β—Œ Behavior: Their money is earned through their side hustles so they often research in advance the treatment they want (to ensure price is reasonable for them) and book in advance.
β—Œ Their appearance: Maintaining a bright appearance is usually their priority. They would like to appear more feminine and gentle.

Persona 2: female professional or business owner who is busy and have little to no time for researching.
β—Œ Behavior: They usually make use of their in-between meetings/ working time to rush over for a facial treatment. Their purchasing power is higher and they are open to book any treatment as long as it suits them and their time, regardless of the treatment cost.
β—Œ Appearance: Prefer to look not only beautiful but as an empowered woman who leaves a strong impression.Β 

The choice of using 2D characters instead of 3D is because of the learning audience analysis - beauty consultants who are also in their 20 - 35s and their preference over a beautiful design, look fun (basically similar to their work environment vibe too, as opposed to something boring) and not a trainer face up there and speak from start to end (lecture style)
β†’ Something they can remember for a longer time, like watching a movie (like black mirror), an interactive type.
Haven
Sales & Customer Service Expert
Customer 1
Creative Lead
Customer 2
Creative Lead

Visual Mockup Iteration

β—Œ Visual Mockup was done briefly on PowerPoints because the authoring tool as I’m using Articulate Storyline to develop the full course later on. This helps with the facilitation of import and it is efficient to re-iterate on PPT when I have all the PNGs and images and the backgrounds.

Interactive Prototype

Full Development

Other Learning Experience Enhanced Features

Engaging and realistic sound effects

β—Œ I integrated a range of sound effects into the experience to enhance immersion and realism for the learner.
‍
β—Œ Specifically, the sound effects in the cash "cha-ching" sounds (representing 5-star reviews and thus booking coming in) and correct answer videos serve to offer positive reinforcement, encouraging the learner when they make the right choices.

β—Œ At the same time, when learner makes the incorrect choice, they will "face the consequence" immediately. This "realistic, adverse impact on the business" is depicted using the unsatisfactory sound from the customers.

Removal of background soundtrack

β—Œ Initially, background music was added to mimic the realistic ambience, especially in a spa setting

β—Œ Upon UAT (user acceptance testing), I figured that it was creating more of an β€œannoyance” toward the learners such that the soundtrack got paused constantly many times throughout due to other sound effects like the incorrect or correct answers, the videos of characters moving, etc.

Thus, I decided to completely remove this background soundtrack. This helps with the loading speed too while not impacting adversely and heavily toward the learning content and in turn, improve learning experience.

Downloadable job aid

β—Œ In the real setting, these are product knowledge that each beauty consultant needs to know inside out. However, the amount of information might be overwhelming at times.

β—Œ Thus, to replicate this while making it easier for the learners to refer, and learn on the go, the Facial Quiz Guide was crafted to swiftly and effectively aid the beauty consultants in guiding customers to choose the ideal facial for their skin type and skin concerns. Upon completion of the e-learning course, learners have the option to download the job aid, enhancing the accessibility of the learning resources and facilitating ongoing learning beyond the course.

Progress bar

β—Œ Every learners would appreciate the ability to track their learning progress and how far they have come or completed the course. Thus, including a tracking or a progress bar would be ideal and intuitive.
‍
β—Œ The challenge and "fun", creative part I gave to myself was to make the progress bar on the screen as smooth and native as possible so it looks like a part of the background setting, instead of "just another progress bar" for a "learning course". Since this is designed to be an immersive experience, the progress bar should be part of that experience as well.

β—Œ Leveraging on the screen that I have designed in the background and the goal that the course is designed for (stellar review, aka star system), I decided to add the star tracking system as a progress bar and added it on that screen.

Certification of completion (as badge of honour)

β—Œ I set myself a challenge to add a personalized certificate to the end of the learning experience. Using Canva, I made the certificate template (with the name and date portion to be personalized) and then added JavaScript to automate its creation. It took more time and effort than I expected, but I enjoyed the problem-solving and felt really proud when I finished.
‍
β—Œ This part of the project is what I'm most proud of because it pushed me to learn more about Articulate Storyline and boosted my confidence as a developer.

Implementation

Split into 2 phases: trial launch and actual launch

Trial Launch
‍
Get around 10 nominees who are good representatives from the learner pools from different teams (if applicable) and give advance access to the course. The trial nominees need to experience the e-learning course thoroughly and give thorough feedback using a form prepared in advance.

Actual Launch
After making necessary amendments and getting the approval

Experience Project

Evaluation

This is a concept project so the course itself was not subjected to evaluation. In the real world, I would evaluate the effectiveness of this learning solution by using the four levels of the Kirkpatrick Model: Reaction, Learning, Behavior, and Results.Β 

Do note that the evaluation metrics, goals, and measurements have already been determined beforehand so that I could collect necessary data, which makes the evaluation phase possible here.
‍

Testimonials and Takeaway

The e-learning course was well received by users who experienced it. Some testimonials from users included:
"Wow, I am seriously impressed by this project! Right from the get-go,you can tell Jamie put a lot of thought into picking out those colors, fonts, and layout. And those consequence slides? Totally kept me hooked!"
Samantha
Operations, Gov Co.
β€œIt’s like playing a game, very fun and the content is really interesting."
Guan Yean
Ensign Co.
β€œI am hooked and right when and where I want to continue learning, the scenario ended. This kept me wanting for an extended course!”
Melissa
Associate Partnership Manager, Trusting Social

Throughout this project, I've acquired valuable insights into the instructional design process.
I'll carry these lessons forward as I continue to enhance my skills and develop further learning experiences to demonstrate my abilities.

Learner First

Design e-learning courses with a learner-first approach to prioritize their needs and enhance engagement.

Trial and Error

Embrace trial and error as a natural part of the design process to refine and improve e-learning experiences iteratively until satisfactory.

Embrace Challenges

Embrace challenges encountered during design as opportunities for growth and innovation in crafting effective e-learning solutions.

Endless Creativity

Cultivate endless creativity in designing e-learning courses to captivate learners and deliver dynamic, engaging content.

Hello, I am

Jamie!

If you like what you are seeing, let's connect.
Let's chat