Problem
New starters with no experience slow service and put pressure on staff. After speaking with a café manager who often hired people with no experience because of tight budgets, it became clear that the first few weeks were always a bit of a struggle.
Experienced staff had to stop what they were doing to answer simple questions which slowed everything down. The early basics took the most time and support but staff did not always have the capacity to help.
Solution
As a result of those earlier conversations with the café manager, we felt the most helpful approach would be to prepare people for the early basics before they join a café. Reading docket shorthand, understanding the recipe cards, handling different customer needs and knowing which orders to prioritise during busy spells. Usually the points where a senior barista gets pulled in.
That led to creating an interactive café simulation in Rise that feels like working through two short shifts. The shifts reflect how a café actually runs. The first puts learners front of house, taking orders, keeping the queue moving and asking for clarity when something is unclear. The second moves them behind the counter where they read dockets properly, use the recipe cards, notice allergies and prioritise orders when several customers arrive at once. They learn by doing which mirrors a real barista experience.
The outcomes reflect real life too. Serve a customer well and they might leave a good review or a tip. Handle it poorly and you may deal with an angry customer or someone who quietly never returns. Miss an allergy and they witness a full blown health emergency. Seeing the impact of their choices helps the learning stick.
Why a cat café?
The cat café theme makes the experience feel warm and low pressure. Learners can try things out, make mistakes and explore different outcomes without feeling judged. It also helps the learning stick. It is easier to remember a situation when it has a bit of personality, even though the challenges reflect real café life.
Bringing it to life
Using the Mighty Plugin and Claude AI, I vibe coded custom interactions throughout the two shifts to make the experience more immersive, realistic and engaging. This included styling, sound and custom elements that Rise cannot do on its own.
Custom multiple choice with customer reactions
I extended Rise’s default multiple choice questions so learners see how customers respond within the feedback. I embedded images, carried the colour palette through and added a hints pop up system where the café mentor, Mr Purrkins, offers support just in time.
Transitions
I used Mighty transitions to break up the content and give the experience a sense of movement. Each shift reflects a different time of day which helps it feel like the café is opening, getting busy and winding down.
Fixed reference tools
The docket guide and recipe cards stay in place during Shift 2 which mirrors how staff naturally check information on the job.
Sound effects
I added sound effects through JavaScript because I wanted actions to feel a bit more tactile. Small touches like this help the experience feel more alive and encourage learners to interact with it.
Coffee builder
The biggest experiment was the coffee builder. I created the imagery and built a system where the drink layers stack in the cup. JavaScript provides personalised feedback based on choices and there are 31 possible outcomes which keeps the experience varied and encourages learners to try things out.
What this taught me
I learned how to work within the structure and limitations of Rise 360 and how to use custom code effectively in that environment. I also saw how theme and tone can encourage learners to explore without feeling judged which helps the learning stick.