📹 New! Remote User Testing - Get video + voice feedback on designs and prototypes
Read more
Product Tips & Tricks

4 inspiring ways to use prototype embeds

Check out how UBS, Orange, Duo and dozens more use Marvel to embed their prototypes across the web
4 inspiring ways to use prototype embeds

Did you know that once you’ve created a prototype in Marvel, you can embed it on any HTML web page or blog including WordPress, Medium, Wix, Squarespace and even Behance?

Since we launched prototype embeds, we’ve seen them pop up everywhere, in almost every use-case from product marketing and sales to education. From Papa Johns to Duo and PWC, thousands of brands, agencies and individuals use embeds to showcase work, teach users how to use features or even raise funding for ideas.

The best part? If you’ve already done the work in Marvel to create a prototype, then you’re good to go! Just click ‘Share > Embed’ on any project.

You can read more about it on our help article here.

We’ve put together the most common uses of embeds with dozens of examples to inspire you. Let’s go!

Showcasing your product/feature

The most popular way to use prototype embeds is within product marketing initatives such as websites or feature pages. This works especially well with products that can’t easily be previewed by an existing or potential user.

Some examples include products that require lengthly integration by a developer, legal verification, physical hardware, or based in app stores. Embedding a prototype to click through can often be faster and more effective than written descriptions or videos.

This gives the user an interactive experience of moving through screens, using features and getting a deeper understanding of how the product works.

Great for:

Examples:

Support docs, education and knowledge bases

Including embedded prototypes within your support docs and knowledge bases is a great way to give users the experience of using a particular feature without having to sign up, sign in, purchase or download your product.

If you've already designed and prototyped a feature in Marvel during the product design and development process, it means you have everything you need to quickly grab the embed code and add it to a page.

Great for:

Examples:

Pre-launch pages and testing MVPs

This is one we love to see! If your product, feature or idea is still at the idea or design stage then testing it in public using a prototype embed can be a great way to validate it without spending time or money on development. It can even be used to attract investors.

Once it's live, you can easily promote it via paid ads, social media or email marketing to drive traffic and collect feedback. We recommend reading the inspiring story on how Buffer used an MVP to get their first paying customer to get some ideas.

Just drop your embed code into any HTML site, or use a popular website builder like Wix, Squarespace or Weebly.

Great for:

Examples

Case studies and portfolios

One of the most popular ways to use prototype embeds is within case studies and portfolios. This is particular useful for designers, freelancers, agencies and development studios who want to demonstrate how their projects work as well as the rationale behind its creation.

Embeds work on WordPress, Behance, Wix, Medium and pretty much every portfolio builder service.

Great for:

Examples:

And there you have it! Hopefully this inspires you to start embedding your prototypes, well, pretty much anywhere! It’s just a few clicks to get started, click ‘Share’ then ‘Embed’ on any prototype project in your account.

Check out our help article to get started.

Design and prototyping for everyone

Design and prototyping for everyone

Thousands of individuals and teams use Marvel to design and prototype ideas.

Get Started, it's Free!

Product Marketer at Marvel. Part-time true crime connoisseur. @ch_hall

Related Posts

You wouldn’t be alone if you thought prototypes were just for designers. We used to think this too! But since all a prototype is, is a mockup of a digital experience, it turns out there are some interesting use-cases by the non-designers in our Customer Support Team. The way we use prototypes in Customer Support at Marvel is very similar… Read More →

A great way to understand the value and different use cases for Marvel is for everyone at Marvel to use prototyping in their day-to-day work. Clearly that’s a no-brainer for our designers, developers and product managers, but what about the other teams, how do they use Marvel? The Customer Experience (CX) team’s main responsibility is to look after all of… Read More →

Collaboration involves teams working together to achieve a common goal. It relies on individual characteristics including motivation, organisation and focus but also a shared understanding of team and individual objectives, and how they ladder up to the overall goal. By understanding how work is shared across Product, Design and Engineering not only will work get done faster but also to… Read More →

Categories