I developed learner personas using data from 60 customer service staff across 5 stations, combining LMS insights (training records, results, feedback), on-site observations, SME interviews, and staff surveys to ensure a data-driven, learner-centric approach.

🔍 Two key learner groups identified:

• Less experienced staff motivated to learn and grow

• Experienced staff with lower engagement in non-mandatory training

🧠 Key Insights

• Mixed experience levels with strong baseline knowledge

• High English proficiency, eliminating language barriers

• Preference for self-paced, online learning due to shift patterns

• High digital accessibility (laptops and mobile devices)

• Varying motivation levels, requiring engaging and relevant design

🎯 Design Decisions 

These insights directly informed the learning design:

• Shift to self-paced digital learning to align with operational constraints

• Use of scenario-based design to increase engagement and real-world relevance

• Design for mixed experience levels, ensuring accessibility for all learners

I defined learning outcomes based on business needs and performance gaps, identified through stakeholder interviews, customer satisfaction data, and a review of existing training materials.

• Action Mapping was used to validate that the new GIFT steps addressed key behavioral gaps and aligned with business KPIs

• Learning outcomes were designed as learner-centered and measurable, applying Bloom’s Taxonomy (Apply level) to drive behavior change

• The ABCD (Audience, Behavior, Condition, Degree) framework ensured outcomes were clear, actionable, and performance-focused

📈 Outcome

• Learning outcomes directly aligned with business goals and KPIs

• Strong focus on behavior change, not just knowledge transfer

I translated training objectives into a structured modular framework, using a top-down approach to align each module directly with defined learning outcomes. Strong focus on behavioral change, prioritizing practical application over theory

• Modular structure designed for clarity and scalability

• Key emphasis placed on: Scenario-based application of GIFT steps

⚙️ Delivery Approach (How)

The delivery model was designed to ensure flexibility, scalability, and real-world usability.

• Adoption of self-paced eLearning (asynchronous) to accommodate shift-based schedules

• Use of the existing LMS for tracking, accessibility, and scalability

• Mobile-first design to enable access via smartphones and laptops

📈 Outcome

• Training aligned with real operational constraints and work environments

• Enabled consistent participation across all staff groups

After aligning on learning outcomes and macro design, I applied Cathy Moore’s Action Mapping to define the critical actions learners must perform to demonstrate the desired behaviors.

⚙️ Approach

• Translated learning outcomes into real-world actions and decisions

• Developed a structured action map (Miro) to guide content development

• Used the action map as the foundation for storyboarding and micro-level design

• I acted as Instructional Designer and SME, leveraging experience as a Senior Customer Service Supervisor

• Ensured alignment between GIFT steps, learner actions, and business outcomes

📈 Outcome

• Established a clear, action-driven learning structure

• Shifted focus from knowledge to practical application and behavior

• Created a strong foundation for scenario-based, behavior-driven learning experiences

I created the wireframe as a visual blueprint for the course, defining screen structure, flow, and dependencies. This allowed me to estimate development effort upfront and plan the build efficiently.

⚙️ Approach

• Structured using wireframe template and instructional design principles to ensure a clear, logical flow

• Defined sections, screen numbers, and prerequisites to support navigation and tracking across development stages

• Designed sequential progression, ensuring learners complete each step without skipping

🎯 Learning Experience Design

• Introduced an anticipatory hook to highlight relevance and value

• Designed an activation phase with recap activities to reinforce prior knowledge and increase ownership

• Implemented a toolkit and navigation layer for easy access to supporting resources

🧠 Scenario-Based Learning

• Applied the 3Cs (Challenge, Choice, and Consequence) framework to design branching, decision-based scenarios

• Developed challenging choices with consequences, enabling learning through action and feedback

• Enforced progression logic, requiring completion of each challenge

🔁 Reinforcement & Continuity

• Included a summary experience linking behaviors to customer satisfaction outcomes

• Defined next steps through microlearning and on-the-job assessments

• Provided downloadable GIFT reference tools to support real-world application

Once the wireframe was approved, I developed a detailed screenplan to define the purpose, content, and layout of each screen, ensuring a smooth transition into storyboard and development.

⚙️ Approach

• Developed a custom screenplan template, aligned with the storyboard structure to ensure workflow consistency and efficiency

• Defined course structure and navigation, including sections, screen numbers, and titles aligned with the wireframe

• Documented the purpose of each screen, covering learning objectives, interactions, and expected learner actions

• Broke down screens into Articulate Storyline layers and components, enabling a smooth transition into development

🎯 Design Details

• Mapped activity types and functionality using visual indicators to define required media (e.g. interactions, video, audio, drag-and-drop)

• Created low-fidelity (black & white) screen sketches to visualize layout and user experience early

• Defined audio and sound design elements to enhance engagement and feedback

• Implemented version control and tracking to maintain clarity across iterations

• Designed navigation elements (table of contents, footer, home) to support a seamless learner experience

📈 Outcome

• Established a clear, structured foundation for storyboard development

• Improved alignment between design and development

• Enabled a faster, smoother transition into the Articulate build phase

After the screenplan was approved, I used it as the foundation to develop a detailed visual storyboard for each screen, enabling a smooth transition into development.

⚙️ Approach

• Developed a custom visual storyboard template to ensure clarity and ease of use for developers

• Adopted a visual-first approach (vs text-heavy) to improve comprehension and development efficiency

• Ensured full alignment with the wireframe and screenplan, maintaining consistency across all stages

🎯 Design Details

• Defined on-screen text (OST), including button labels and learner instructions

• Specified visual elements for each screen/layer, providing clear direction for UI and interactions

• Documented programming logic (animations, triggers, user prompts) to support development

• Included visual mock-ups/screenshots to represent final look and feel

• Designed audio strategy, using immersive sound effects while avoiding voice-over to reduce cognitive load

• Implemented version control and structured navigation (table of contents, screen references, footer)

📈 Outcome

• Delivered a developer-ready storyboard, reducing ambiguity and rework

• Enabled faster prototype and build development in Articulate

• Ensured strong alignment between design intent and final product

I developed visual mock-ups alongside the storyboard to ensure alignment between design intent and final user experience.

⚙️ Approach

• Translated the wireframe and screenplan into high-fidelity designs, incorporating branding, typography, color, and UI elements

• Used Adobe XD to prototype screen flows and ensure visual consistency across the experience

• Developed multimedia assets using Vyond and Canva to support engaging content

🎯 Design Strategy

• Focused on key screens as reusable templates, improving efficiency and scalability

• Established core layouts (e.g. main interface, dialogue screens, scenario screens) for consistent reuse

• Maintained consistency in layout, text hierarchy, and interaction patterns

🧠 Key Features

• Designed dialogue screens to simulate realistic interactions with the character (Gwen)

• Built scenario-based (3Cs) screens to visualize challenges, choices, and consequences

• Ensured all visual elements supported clarity, engagement, and learning outcomes

📈 Outcome

• Delivered a consistent, scalable visual system for Articulate Storyline development

• Reduced design time through reusable components and templates

• Ensured a cohesive, high-quality learner experience

Once the storyboard and visual mock-ups were approved, I led the end-to-end development in Articulate Storyline, starting with an Alpha prototype (without audio).

⚙️ Approach

• Built each screen in Articulate Storyline, ensuring full alignment with the wireframe, screenplan, and storyboard

• Leveraged advanced Storyline features (layers, variables, conditions, drag-and-drop, custom navigation) to create interactive experiences

🎯 Process Optimization

• Aligned screen numbering across all stages (wireframe, screenplan, storyboard, Storyline) to enable:

  • efficient tracking and navigation

  • clear stakeholder communication

  • accurate version control and documentation

  • faster development with reduced errors

📈 Outcome

• Delivered a fully functional, user-tested learning product

• Improved development efficiency through structured workflow and alignment

• Strengthened advanced Storyline capability through hands-on implementation

Using an Alpha prototype (without audio), a pilot test was conducted with SMEs and frontline staff, collecting structured feedback aligned with Kirkpatrick’s Level 1 (Reaction) and Level 2 (Learning) to evaluate both effectiveness and overall experience.

Based on this feedback, the design was iterated to develop a fully functional Beta prototype with audio, followed by a second round of pilot testing.

🎯 What I Validated

• Learner engagement and usability

• Clarity of content and instructions

• Effectiveness of interactive elements and design

✅ Key Feedback (What Worked)

• Strong engagement driven by personalization features (e.g. learner name input)

• Effective intro and recap activity as a learning hook

• High value of GIFT reference card and toolkit for real-time application

• Realistic scenarios and design aligned with the actual work environment

• Visual design and branding enhanced relatability and immersion

🔧 Improvements Implemented

• Introduced a “Previous” button to allow learners to revisit scenarios without disrupting progression logic

• Simplified content-heavy screens (Challenge #3) to improve readability and reduce cognitive load

📈 Outcome

• Improved usability and learner control

• Enhanced content clarity and engagement

• Delivered a more refined, learner-centered experience

📢 Official Launch

After final validation, I led the official rollout of the learning module via the LMS, ensuring a smooth and scalable deployment.

• Published the course on the LMS, enabling global access and progress tracking

• Aligned with stakeholders to ensure clear communication and adoption across teams

• Supported rollout with guidelines and expectations, ensuring timely completion

📊 Measuring Success (Kirkpatrick Model)

A multi-level evaluation approach was implemented to measure learning effectiveness and business impact:

Level 1 – Reaction (Learner Experience)

• Collected learner feedback and satisfaction scores via LMS surveys

• Achieved 100% completion rate and 100% survey response rate
  👉 Result: High satisfaction (4.9/5), confirming strong engagement and relevance

Level 2 – Learning (Knowledge & Skills)

• Assessed learning through knowledge checks, scenario-based decisions, and assessments

• Tracked improvement in understanding of GIFT steps and service standards
  👉 Result: 100% pass rate and completion, demonstrating strong knowledge acquisition and application

Level 3 – Behavior (On-the-Job Application)

• Partnered with supervisors to evaluate on-the-job performance using OJT form

• Introduced microlearning and observational assessments
  👉 Result: Improved 98% consistency in customer service behaviors aligned with GIFT steps

Level 4 – Results (Business Impact)

• Measured impact using customer satisfaction data and performance KPIs

• Linked training outcomes to service quality and operational efficiency
  👉 Result:

  1. • +18% increase in customer service score (exceeded 15% target)

     • Improved training efficiency and scalability

     • Positive contribution to overall business performance

🎯 Outcome

• Delivered a scalable, high-impact learning solution.

• Demonstrated end-to-end ownership (design → build → launch → measure)

• Ensured direct contribution to measurable business outcomes