Prototyping with Vibe Coding Demo

In this demo, you can see how easy it is to generate a prototype app from a wireframe using an LLM (Anthropic's Haiku model), using pre-approved wireframe images.

Instructions

• Choose one of the pre-approved images below (which are wireframes for the homework app) and download it.
• Open the downloaded image and have a look at the wireframe.
• Use the Lumen window below to generate a web app prototype for your chosen wireframe (the student, teacher or parent view).
• You can download the HTML file generated by Lumen and open it a browser, like you did for the vibe coding activity.