Exit
Use Layer CompsAdd HotspotsAdd AnimationsInteractive Mode

Composite

A new, delightful way of prototyping

Composite is a brand new way of creating interactive prototypes. It automatically connects to your Photoshop® documents and converts your mockups into interactive prototypes in seconds. No need to export images or maintain tons of hotspots.

Watch The VideoInteractive Mode Demo

Use Layer Comps when designing your app

Use Layer Comps to organize your document. It's a great way to divide your designs into different screens. Read more here.

Next step

Link screens by naming your layers

Transition to a layer comp by appending its name, wrapped in square brackets, to the name of the layer you want to be tappable.

Next step

Add animations for a native iOS feeling

Append the name of the animation to the layer you're linking from. Choose between +push, +pop, +modal, +close, +flip and more.

Next step

That's it!

Since Composite connects directly to your Photoshop® document, your design and prototype will always be in sync. All tap zones are tied to a layer and will automatically be moved along when moving or resizing a layer.

Go back to frontpage
“Composite could be the ultimate iPhone app prototyping tool for Photoshop”
— Paul Sawers, The Next Web
“My new favorite iOS design tool at the moment: getcomposite.com
— Mark Jardine, @markjardine
“Wow, @getcomposite looks like an amazing tool for prototyping with Photoshop”
— Dan Counsell, @dancounsell
“Seriously impressed by the look of @getcomposite and the video on getcomposite.com.  What a great tool for iOS design!”
— Elliot Jay Stocks, @elliotjaystocks
Paul Sawers

The Next Web

Mark Jardine

@markjardine

Dan Counsell

@dancounsell

Elliot Jay Stocks

@elliotjaystocks

Composite 1.3

Automatic history management, custom transition durations, and a new zoom transition.

Interactive mockups on your iPhone
Design each page with Layer Comps
Link to screens by naming your layers

Realistic Prototypes.

Prototypes that feel native, straight from Photoshop®

Composite lets you create your prototypes in the comfort of your own Photoshop®. Define hotspots for transitioning between layer comps, and add animations for a truly native feel.

Interactive Mockups

Pixel perfect rendering, with tapzones and animations defined in your .PSD, presented as a functional app experience.

Native Animations

All the transitions and gestures you'd expect from a real iPhone app, without any of the work.

Fixed Elements

Create even more realistic prototypes, by making elements stay fixed while scrolling. Perfect for navigation bars and toolbars.

How does it work?

Design with Layer Comps

Use layer comps to organize your document. It's a great way to divide your designs into different screens.

Link screens by naming layers

Rename your layers to create live hotspots that can be used to transition between different layer comps.

Open in Interactive Mode

Load the layer comps from your mockup, and tap on the hotspots you've defined to navigate around.

Get started with Composite

Download our demo app to get started. It's a great way to get familiar with how Composite works.

Download Demo App

Direct connection

Composite connects to Photoshop® using Remote Connections via Bonjour. Read more in our Connection Guide.

Real-time Preview

While you're designing and tweaking in Photoshop®, you get live updates of your work on the device.

OS X & Windows Support

Composite works with Photoshop® on both Windows and Mac OS X. Windows support requires Bonjour installed.