Sketch mobile and desktop app screens from 55+ hand-drawn widgets and an ink icon library, link screens like Figma, and press Play to click through your idea. Then export the whole flow — taps, typing, scrolling, screen transitions — as an animated GIF.
No account · no install · runs in your browser · MIT open source
# two screens, one tap, ready to export prototype: { device: phone, style: hand } screens: login: items: title: { widget: heading, x: 24, y: 160, text: Welcome } email: { widget: input, x: 24, y: 240, w: 342, label: Email } go: { widget: button, x: 24, y: 330, w: 342, text: Sign in, goto: home } home: items: nav: { widget: navbar, title: Home } feed: { widget: list, x: 16, y: 90, w: 358, rows: 4 } flow: - type: { in: login.email, text: ada@lovelace.io } - click: login.go
Or skip the code — drag widgets on the canvas and it writes itself.
From blank frame to a clickable, shareable prototype in four steps — no design skills needed.
Pick a phone, tablet or desktop frame and drag on buttons, inputs, lists, cards, icons — 55+ widgets plus ready-made blocks for login, checkout, feeds and more.
Drag frames anywhere on the full-screen board to lay the flow out the way you think about it, then shift-drag one onto another to connect them. Choose slide, push or fade transitions.
Play mode makes the wireframe real — tap a linked button and the prototype navigates, ripple and all. Screens scroll by default when content runs long.
Play every screen one by one, let the auto tour walk each connection, or record your own taps, typing and scrolling — then export it as an animated GIF or a PNG storyboard.
Open the prototype workspace, drop widgets onto phone, tablet or desktop frames, link a button to another screen with goto:, then press Play to click through it. No account, nothing to install.
Yes. Record a flow — taps, typing into fields, scrolling, screen transitions — and export the whole walkthrough as an animated GIF for a ticket, deck or README. PNG storyboards work too.
Yes. Sketch mode renders every widget and its icons as monochrome, hand-drawn ink strokes so the design reads as a rough draft, not a finished visual. Switch it off for a clean, themed look — same document.
Yes. The board canvas shows every screen as a frame — click one to zoom in and edit it, drag a frame onto another to connect them, and add new screens right on the canvas.
Wireframe it, click through it, and export the flow as a GIF — free.