Uncover your best ideas by getting the bad ones out of the way
Use Keynote to create
wireframes
and
clickable prototypes
for
the web
and
mobile devices.
What makes Keynote such a great prototyping tool?
Check out these free example prototypes to get you started:
Buzz & Love
Wireframing with Keynote is a reasonable pitch—it’s affordable, rapid, and uploading to iWork.com makes annotating and collaboration easy.
— Cameron Moll (@cameronmoll)
One of our favorite sessions from the Big D Conference […]
— Jared Spool (@jmspool)
If Keynote had built–in email, I’d never leave. Case in point—get your Keynote Kung-Fu on…
— Michael Lopp (@rands) [1] [2]
“Shamwow Moment” @tbisaacs shares his Keynote Wireframing Toolkit
— Stephen P. Anderson (@stephenanderson)
As someone who uses Keynote as his primary design tool, I’m very excited about the $12 Keynote Wireframe Toolkit!
— Chris Messina (@chrismessina)
The more I think about it, the more I realize how ingenious the idea is. Going over a mental checklist of what makes for a good wireframing and/or prototyping tool, Keynote seems to fit the bill nicely…
— Nathan Smith (@nathansmith)
If you’re a designer or developer of UI, UX, IA, or anything web related, you need this
— Aaron Martin (@iamaaronmartin)
Don’t mock it! Embrace it! Keynote is a great wireframing tool!
— Mark Kraemer (@Kraemer)
I’ve been a Keynote UX outlaw for a while, but this guy is Jesse James!
— Ryan Feeley (@ryanfeeley)
Thanks, I love this. Love it. Much faster than Illustrator, but still works the way I’m used to.
— Jason Putori (@putori)
Wireframing with @tbisaacs' Keynote wireframe toolkit […] I’m not an IA, I’m a finance guy in marketing. He makes it that easy!
— Marcelo Somers (@marcelosomers)
Being adventurous and attempting to wireframe for the first time tonight. Thank you @tbisaacs for this.
— Courtney Hernandez (@courtsinsession)
@tbisaacs awesome presentation on http://keynotekungfu.com -- #bigd10 just paid for itself in future time savings!
— Marshall Yount (@marshallyount)
When you combine Keynote with Keynotekungfu, it sort of becomes magical. Thank you @tbisaacs.
— Felix Bengtsson (@Filleb08)
Step away from the OmniGraffle and hit light speed in wireframing with Keynote Kung Fu 2.0.
— Joe Dyer (@joeplanet)
Media
Travis Isaacs talks about wireframing with Keynote at Big Design 2010. Video courtesy of Big Design Events
Designing With Keynote? —Dan Benjamin is joined by Luke Wroblewski and Travis Isaacs to discuss agile prototyping and designing using Keynote rather than traditional tools.
Slides from Keynote Kung-Fu: How Ninja's Wireframe
Slides from Keynote Kung-Fu: Black Belt
Frequently Asked Questions
- Are updates free?
-
Updates are free forever. I’ll e-mail you when an update is available.
- Can I use this with Keynote on my iPad?
-
The most recent update to Keynote for iPad now supports grouping, which is a big step forward. Version 2.1 of this toolkit includes an Keynote for iPad .key file. Good luck, and let me know how you like it.
- Can I change the slide size?
-
The default 1024x768 slide size provides a realistic viewable area for most web users. I recommend breaking your wireframes up across multiple slides to accommodate longer pages.
If you resize your slide deck, Keynote will attempt to scale everything up to fit the new slide size. If you want a bigger slide size, here is what to do:
- Create a new slideshow using the default “White” theme.
- Delete all of the master slides except for the blank slide.
- Copy and paste all of the toolkit elements into this new slide size.
- If you plan on using the new slide size again, save it as a theme (File > Save Theme).
- Will there be a PowerPoint version?
-
Versions 2.1 and up include support for PowerPoint.
For the record, Keynote is worth buying a Mac for
- I have iWork ’08—will this work?
-
No. Unfortunately, iWork's most recent versions no longer make it easy to export an '08 version of the toolkit.