ePortfolio

Hoboken Hoagies, a family-owned sandwich shop known for its handcrafted quality, was preparing to expand into 15 new franchise locations across New England. With growth on the horizon, the company needed a way to train new employees consistently and at scale without losing the precision and care that made its sandwiches unique. Every Hoboken Hoagie is built to order customers choose their bread, protein, cheese, condiments, and toppings. While this customization sets the brand apart, it also creates training challenges. Employees must learn to assemble sandwiches with accuracy, follow portioning rules, and handle customer preferences while maintaining speed and efficiency. To meet this need, I designed an interactive eLearning course in Articulate Rise 360. The course uses storytelling, real-world examples, and scenario-based practice to prepare employees for both the technical skills of sandwich assembly and the customer service skills required to keep guests satisfied.

Quick Snapshot

  • Client/Context: Hoboken Hoagies – onboarding for new franchise employees.

  • Audience: Entry-level staff with little food service background.

  • My Role: Instructional Designer, eLearning Developer, Visual Designer

  • Tool: Articulate Rise 360, Powerpoint, TalentLMS, Canva/AI graphics, Google Workspace

  • Deliverable: A self-paced onboarding course combining storytelling, interactivity, and real-world scenarios.

Overview

Two smiling men wearing Hoboken Hoagies aprons stand side by side in a sandwich shop kitchen. One is holding a freshly made sub sandwich, representing the family founders of Hoboken Hoagies.
Illustration of two sandwich shop employees wearing aprons, one holding a clipboard and the other preparing a sub, while interacting with a customer.
The screen displays an online course titled 'Crafting the Perfect Sub: Hoboken Hoagies Training' by Ursular Koranteng, showing two men in Hoboken Hoagies shirts smiling, one holding a large sandwich. A 'Start Course' button is visible.

Audience
The course was designed for newly hired sandwich builders and cashiers at Hoboken Hoagies franchise locations. Most learners had little to no prior food service experience, so the training needed to be accessible, highly visual, and easy to follow.

Problem
With the opening of 15 new stores across New England, Hoboken Hoagies needed to ensure that every new employee could deliver sandwiches with the same level of precision and consistency as its original location. Existing onboarding methods relied on shadowing and verbal instructions, which led to errors in portioning, inconsistent sandwich builds, wasted ingredients, and dissatisfied customers.

Objectives
The eLearning course was designed to ensure that every new employee could:

  • Interpret customer orders accurately by identifying bread, protein, cheese, condiments, and toppings.

  • Apply portioning standards (e.g., 5 slices of protein and 2 slices of cheese on a 6” sub) to maintain consistency and reduce waste.

  • Assemble sandwiches in the correct order, balancing flavor, texture, and presentation.

  • Handle customizations such as allergen accommodations and toasting requests with confidence.

  • Respond to customer complaints professionally, including escalating remakes when necessary.

  • Maintain efficiency and accuracy to support Hoboken Hoagies’ promise of handcrafted quality.

Responsibilities
I was responsible for the end-to-end design and development of this course, including:

  • Translating the business needs into clear learning objectives.

  • Designing a storyboard to outline visuals, interactions, and assessments.

  • Developing the full course in Articulate Rise 360, incorporating timelines, flip cards, step-by-step guides, and scenario-based knowledge checks.

  • Ensuring brand alignment by applying the Hoboken Hoagies style guide for colors, fonts, and visual consistency.

Summary

As Hoboken Hoagies prepared to open 15 new franchise locations, leadership recognized a critical gap: there was no standardized training program to ensure sandwich builders consistently applied portioning rules, assembled ingredients in the correct order, and handled customer customizations with accuracy. Existing onboarding relied on shadowing experienced staff, which often led to inconsistent subs, wasted ingredients, and customer dissatisfaction.

To fill this gap, I designed an eLearning course in Articulate Rise 360 that gave new employees a safe, interactive space to practice their skills. The course included step-by-step guides, drag-and-drop practice, and scenario-based knowledge checks that mirrored real kitchen and customer interactions. These features helped employees build confidence before entering a live store environment.

The design process was guided by ADDIE (to ensure a structured approach), Bloom’s Taxonomy (to align objectives with measurable outcomes such as interpreting, applying, and evaluating), and Universal Design for Learning (UDL) (to present content in multiple formats visuals, text, and interactive activities for diverse learners).

This approach not only addressed Hoboken Hoagies’ immediate need for scalable training but also aligned the learning experience with best practices in instructional design, ensuring long-term consistency and quality across all new franchise locations.

The Process

Infographic showing the needs analysis for Hoboken Hoagies training: business goal, performance gap, training need, and success measures.

Needs Analysis

This needs analysis identified the core business goal, performance gap, training need, and success measures that guided the design of the Hoboken Hoagies eLearning course.

Text-Based Storyboard

I created a text-based storyboard to map the learning objectives into lessons, activities, and assessments. The storyboard outlined narration, visuals, and interactions for each section of the course, ensuring clear alignment between objectives and learning activities.

Screenshot of a text-based storyboard for the Hoboken Hoagies training course. The storyboard includes columns for screen title, on-screen text, graphics, and interactivity notes. The example shown outlines the course introduction and sandwich-building steps, detailing what learners will see and how they will interact with the content.
Screenshot of a text-based storyboard for the Hoboken Hoagies training course. The storyboard includes columns for screen title, on-screen text, graphics, and interactivity notes. The example shown outlines the course introduction and sandwich-building steps, detailing what learners will see and how they will interact with the content.

Design Style Guide

To create a cohesive and branded learning experience, I established a style guide tailored to Hoboken Hoagies’ training:

  • Colors: A bold orange for section banners and calls-to-action, softened with peach backgrounds, balanced by black text and clean white cards for clarity.

  • Typography: Lato font family throughout Black for headings, Bold for subheadings, and Regular for body text and labels to ensure readability and consistency.

  • Layouts: Grid-based layouts with cards and step-by-step sequences, reinforcing the process of sandwich building.

  • Accessibility: High-contrast color pairings (orange/black/white), descriptive alt text for all visuals, and responsive design for mobile learners.

Infographic showing the Hoboken Hoagies training style guide with four main colors (orange, peach, black, white) and Lato fonts for headings, subheadings, body text, and labels.

Prototype Development

Screenshot of Rise 360 prototype showing flip cards labeled Protein, Cheese, Condiments, Toasted, and Toppings for learners to explore ingredient categories.
Prototype screen explaining the importance of handling customer customizations such as toasting and allergen requests.

After finalizing the storyboard and style guide, I began developing a working prototype in Rise 360. The prototype allowed me to test interactivity, visual consistency, and learner engagement before moving into full development.

Key prototype elements included:

  • A Sub Build Cheat Sheet with flip cards for ingredients.

  • Layering and assembly lessons guiding learners on the correct order of sandwich building.

  • Interactive order tickets where learners could click on ingredients to explore details.

  • Knowledge checks and short quizzes to reinforce accuracy and customization skills.

These early builds provided stakeholders with a clear preview of the learner experience and ensured alignment with Hoboken Hoagies’ training goals.

Screenshot of a clickable order ticket activity where learners can select ingredients to simulate fulfilling a customer’s sub order.

Full Development

After refining the prototype, I developed the complete Hoboken Hoagies eLearning course in Rise 360. The final build integrated interactive activities, scenario-based practice, and accessibility features to ensure an engaging and inclusive learning experience.

Interactivity Highlights

Flip cards – Learners explored breads, proteins, cheeses, condiments, and toppings.

  • Flip cards – Learners explored breads, proteins, cheeses, condiments, and toppings.

  • Click-to-reveal interactions – Ingredient details and portioning rules were presented in small, digestible steps.

  • Scenario-based questions – Learners practiced handling customer complaints and special requests.

  • Knowledge checks – Short quizzes reinforced accuracy and customization skills.

Accessibility Features

  • Alt text included for all images and graphics.

  • High-contrast color palette for readability.

  • Lato sans-serif font for clarity across devices.

  • Responsive design optimized for both desktop and mobile.

  • Step-by-step layouts to support diverse learning needs.

Results & Takeaways

Since this course was created as a practice project, it was not tested with real learners. However, based on the design and interactivity, the anticipated outcomes include:

  • Improved accuracy in sandwich assembly and portioning.

  • Faster, more consistent onboarding across new franchise locations.

  • Increased customer satisfaction through better handling of customizations and complaints.

  • Reduced food waste by reinforcing portion control standards.

Reflection

What worked well:

  • The use of flip cards and click-to-reveal activities made ingredient practice engaging and easy to remember.

  • Scenario-based questions gave employees a safe space to practice real-world interactions.

  • The clean, branded design created a professional and cohesive learner experience.

What I would improve next time:

  • Incorporate branching scenarios with multiple customer service paths for deeper practice.

  • Add video demonstrations of sandwich assembly to complement text and graphics.

  • Gather pilot feedback from actual food service employees to validate the effectiveness of the course.