Introducing Handoff – grab code, specs and assets from your designs and prototypes

Posted 4 weeks ago by Murat Mutlu


We’ve seen our prototypes make a huge impact in communicating with development teams, but we wanted to find a way to save the time and effort that goes with the design-to-development process.

Redlining, annotating PDFs and (urgh) cutting assets are tasks that we wanted to solve in just a few clicks. Our goal is to free up the time your team spends on these manual tasks so you can focus on the things that matter.

*DRUMROLL* So we’re excited to introduce Handoff – automatically generate code, specs and assets for developers from your designs and prototypes in Marvel!

We focused on 4 main areas:

Pixel-perfect design specs

No eyeballing, no spec fatigue, no human error. We extract the exact values from the designs so developers can build faster and with more accuracy.

All of your design assets in one place

When your designs are added to your Marvel project, the assets do too, meaning your developers will always have everything they need in one place, at the right size.

Design-to-code faster

Handoff automatically generates CSS, Swift and Android code for your design assets. Just copy and paste into your code editor and away you go!

No additional software

Handoff works in the browser and lives on the same public share URL as your prototype. That means that developers no longer need Sketch or Photoshop to access specs and assets.

Friends with your existing workflow and process

One of the great things you’ll notice about using Handoff is that it doesn’t require any changes to how you work. The way you add designs to your project stays the same – but now you get this additional layer of rich information right next to your prototype.

Oh and it works seamlessly with existing Marvel integrations such as Slack, JIRA and Confluence, adding more visibility across dev and product teams.

Handoff is compatible with Sketch and our built-in wireframing tool, with Photoshop support coming soon. Once you’ve added your designs to Marvel, you’ll see the Handoff button available when you play your prototype.

This is just the start for the tech behind Handoff, we’re looking forward to showing you what’s next!

Handoff is now available to design and development teams on our Enterprise plan and rolling out to our Company plan in the coming weeks. Want access today? Get started with Enterprise.

Handoff
Handoff

Turn designs and prototypes into code, specs and assets.

Learn more

Hi! I'm one of the co-founders at Marvel and a Product Designer by trade. You can often find me asking why Arsenal haven't signed anyone this season. Follow me on Twitter.

Related Posts

This month we’ve introduced some killer features for bridging the gap between design and development teams. From Handoff, to Jira and Confluence integrations, collaboration between designers and developers is going to be so much more productive using Marvel. In addition to this, we’ve even made it a possibility to prototype for the new iPhone X, so it’s fair to say… Read More →

If you’re working on iPhone X apps before the big launch, we’ve got you covered with our latest release. You can now prototype for the iPhone X in just a few clicks…notch and all! How to get started with iPhone X prototyping: It’s super simple to get started. Simply create a new project and select the iPhone X from the… Read More →

We’re excited to announce Marvel for JIRA and Confluence – our latest integration with two of the most popular Atlassian tools for product and development teams. Prototypes have become a fundamental part of the design-to-development process, so naturally one of the most common uses of Marvel is within project management tools. Whether it’s spec documents, development tasks or even bug… Read More →