Real-time Conversational Avatars with Interactive Visuals

In the background there's a real-time stream of the realistic AI avatar, combined with a web canvas rendered on top of it. This canvas visualises information using pre-built web components — lists, topics, images with title and description, links, and charts.

They can also be interactive, letting you click a topic to hear more about it or visit a link that was just presented.

The most exciting part of the project was figuring out how information should be visualised when there's a ‘human’ presenter involved. Topics are placed around the presenter in circular bubbles — some can even go partially behind the presenter, without hiding information, to emphasise that they exist in space.

They're clickable to advance the conversation, and have wobble physics so they gently move as you glide your cursor over them. This makes information a living, interactive part of the whole experience.

A separate project let users create videos with AI. You could prompt the LLM with what to create, or upload a document as the source material, and add interactive elements like quizzes and branching along the way.

The initial idea was to combine every video-creation path into a single interface. You could upload a file, prompt the LLM, or write an exact script — all from one screen.

After a round of user tests we realised this segmentation actually made things harder: users struggled to find the correct tab for their use case.

The next step after specifying what to create was choosing a template that defined the look of the video. I reworked the template selector and introduced sorting options based on the characteristics users cared about most, taken straight from our metrics.

The generation itself took a while — so I turned the loading screen into a tips-and-tricks slideshow that surfaces useful hints in video format, prioritising the tips that drive our activation metric.

I also experimented with a deeper rework of the video-creation flow, where instead of picking templates users would define the look through parameters — avatar, fonts, colour palette — with a live preview on the right side.

The project was scope-cut, but I hope to see it revived at a later date.

This project let users style interactive components — branching, quizzes — to match their brand. Since our users aren't designers, I simplified the styling process as much as possible by adding automation rules that figure out the fiddly details for you.

I initially assumed users wanted detailed customization, and built an accordion-style layout where they could click on any element on the canvas and configure it in every possible way.

User testing and intel from corporate clients told a different story: all they really wanted was to apply their brand kit — quickly. That insight came late, but it taught me how fast a customization feature spirals in complexity and what parts must be automated.

After that prototype I defined the characteristics that make up a brand look and documented how to automate them. With two font types and three colours the whole component can be styled — hover states are derived from the base colour, and a smart-apply button figures out which colours work best for the background and CTA in a single click.

I also coded a working prototype to show the logic in action.

A redesign of the avatar library on the home dashboard, with easily hide-able filtering options so the grid stays the star.

A project to let users create an avatar based on themselves — from a few uploaded photos to a lifelike presenter ready to speak in real-time.