Cath Ellis Learning Design Logo

How “Vibe Coding” is Changing L&D

Struggling to build complex interactions in Storyline? Discover “vibe coding.” Learn how I use AI tools like Lovable.io, Figma Make, Gemini, Claude Design and Devlin.ai to build custom eLearning components.

Reading Time: 7 mins

eLearning Designer testing a new Vibe Coding tool.

I had a discovery call last week with a client who was completely overwhelmed.

She was trying to build a course to sell her proprietary framework to the public. She had done what most people do: bought an Articulate Storyline license and sat down to build. And she was miserable. It was taking her hours just to create basic custom activities, and she was hitting a brick wall.

I stopped her and asked, “What are you actually trying to build?”

She explained she wanted a “Values Discovery” activity. The learner needed to look at 150 different values, select their top 10, narrow those down to 5, and finally select their core 2 to receive personalised feedback.

As an experienced eLearning designer, my heart sank for her. Doing this manually in Storyline as a newbie is a nightmare. Just the UX challenge alone, trying to fit 150 selectable, readable words onto a standard landscape slide is near impossible without it looking like a cluttered mess.

I asked her if she had considered Vibe Coding.

She said she didn’t know what that was. So, I showed her.

What is Vibe Coding?

Vibe coding is the process of using plain-English AI prompts to generate functional software, code, or interactive web components, without needing to know how to write a single line of code yourself. You just describe the “vibe” or function you want, and the AI builds it.

The 60-Second Solution (Lovable.io)

While on the call, I shared my screen and opened Lovable.io. I typed in this exact prompt:

“Create for me a values-based activity where the user selects 10 values out of 150, then narrows them down to the top 2.”

Within seconds, the AI spat out a fully functional, sleek web component that did exactly what she had spent hours crying over. Her head nearly exploded.

I explained how she could simply embed this HTML activity directly into her LearnWorlds platform. Learners could complete it there and then post their results in a community discussion board.

  • The Cost: Lovable is roughly $25 a month.
  • The Benefit: Aside from the speed, Lovable gives you great analytics from your components, letting you see exactly how users are interacting with your tool.

Alternative Options (Figma Make & Gemini)

Lovable isn’t the only player in town. I also showed her Figma Make. I pasted the exact same prompt, and it generated the same activity.

She left the meeting incredibly excited. She finally felt confident she could get these activities built, knowing that if she got stuck, she could reach out to me for help.

  • The Cost: Figma is free for 5 workflows and $24 on the starter plan.
  • The Benefit: Figma allows you to really dial in your branding, as you can tell it exactly what visual guidelines to follow.

Building Tools for Yourself

Vibe coding isn’t just for learner-facing activities; it is a massive workflow hack for employers.

Recently, I needed a complex calculator to help me generate column widths in a new authoring tool called Parta. Instead of doing the math manually every time, I went to Gemini. I pasted a screenshot of the Parta interface and prompted:

“Build me a calculator so I don’t need to do this maths.”

Just like that, Gemini spat out an .html file. With a bit of tweaking and branding, I hosted it on GitHub, and now I have a custom calculator ready whenever I need it. (Note: Claude has also had this functionality for a while via Artifacts, but has now split this off into a new tool called Claude Design. I’ll be sharing some more blogs deep-diving into that in the coming weeks!)

Soft Skills and Simulations (Devlin.ai)

AI generation isn’t just about building UI components and calculators; it’s also revolutionising how we practice soft skills.

Some of you know that I do some work for my beloved wife, who runs a Disability Service. She’s always open to me recommending new tools for her to try with her workforce. When I saw Devlin Peck‘s new tool, Devlin.ai, which creates AI-powered learning simulations for courses, I knew I had to try it.

I got a free trial and added the following prompt:

“Create me a learning simulation for Support Coordinators to practice having difficult conversations with NDIS participants who had an Acquired Brain Injury, mental health, or behavioural issues.”

It spat out an incredibly realistic, branching scenario. Now, the beauty of the tool Devlin has created is its flexibility. You can embed it into Articulate Storyline and add avatars that actually change states based on the learner’s responses. I didn’t need all that overhead; I just wanted to embed it straight into my Evolve course. I was even able to embed an audio version of the simulation, so the learner didn’t even need to type in their responses; they could just speak naturally.

  • The Cost: Devlin.ai has a free plan with limited credits, then $59/month.
  • The Benefit: Devlin.ai offers a great metrics function for each conversation which shows completions, pass rate, avg score, unique learners, total starts, completion rates and a details of every entry. This is something my clients have requested for years.

The Golden Rule: Components, Not Courses

I am seeing more and more people using AI to create interactive content. But here is my warning: Do I suggest you build a whole eLearning module using AI? Absolutely not. Why? Because AI is moving at lightning speed. The tech stack you use to vibe code an entire platform today could be obsolete or broken in six months.

However, if you use AI to create micro-components, a custom quiz, a calculator, or a Devlin.ai simulation, you will instantly get more buy-in from your stakeholders. You will save yourself hours of frustration, and you will push the boundaries of what your standard authoring tools are capable of.

There are lots of fantastic tools out there right now. I encourage you to give them a try. And if you have specific needs, don’t be afraid to reach out to the developers directly; they are usually very happy to hear feedback or take feature requests.

Because I think we can all agree: the companies that own the legacy authoring tools need to do better. Until they do, these new AI tools are our secret weapons.

Stop wrestling with clunky authoring tools. Book a coaching session with me to learn how to integrate vibe coding into your workflow and start building custom eLearning components that wow your clients.

Trusted by global brands, government agencies, and industry leaders:

Ready to create something exceptional?

I accept a limited number of projects to ensure every client gets my full attention. Let’s chat about what you need.
Cath Ellis Learning Design - White Logo
I acknowledge the Wurundjeri People of the Kulin Nation as the Traditional Custodians of the Country on which I live and work.
I honour their enduring connection to land, waters, skies, and community, and pay my deepest respects to Elders past and present, and extend that respect to emerging leaders.
I recognise that sovereignty was never ceded. This always was, and always will be, Aboriginal land.

About Cath Ellis

Cath Ellis is an eLearning Designer and Developer based out of Melbourne, crafting engaging and effective learning experiences.
ABN: 32 316 313 079
A Queer-Owned Business

Contact Info

Join My FREE Community

Sign up for my community to enjoy free eLearning tips, inspiration, and more.
©
2009 -
2026
Cath Ellis.
Made with
in Melbourne