In their Designing User Interfaces in Keynote Workshop, presenters Joel Beukelman, Mobile User Experience Designer at Netflix, and Ted Boda,
Lead UI Designer at Netflix, demonstrate how to use Apple’s Keynote application to wireframe, create high fidelity designs, mockup interactions, create visual specs, simulate animations, and present all from one tool.
- Use Keynote to wireframe, rapid prototype, create visual specs, use animations, and prototype hyperlink interactions.
- Designers don’t make designs in a vacuum. Once you are done making those prototypes, you have to present and document it.
- There are a lot of applications that help with all these activities, but Keynote does most of them.
- When working in a collaboraitive spaces with many designers with Photoshop, designers are set up in layers and groups and how things are set up. This file structure complicates and slows communication between other designers and stakeholders.
- Keynote provides DIY organization. Set up an initial set of slides, one each for the Project Name, the Project Summary, the Site, the Project Map, the Features.
- Then flesh out different design sections for each Feature, give its own Feature Section. If there are several options or iterations, give each Option Name or Number.
- Reference materials such as comps, visual spec, aniamtion, reference graphics and icons, etc oxycontin high. can be placed on their own unique slides—hidden at the end of the slide deck, but referenced as many times as you need.
- Photoshop and Illustrator still have their place, but regulated to digital image creation.
- Use Photoshop for preparing images.
- Use Illustrator to create icons and other similar resources.
- Shapes and text from Keynote, merging assets from Photoshop and Illustrator.
- Once you have a slide showcasing a feature or design—and you need to make modifications, duplicate it and then make changes.
- At Apple, they would produce a lot options and then whittle it down to the best solution.
- At Netflix, they do about four options and then do user testing to determine the best solution.
- In Photoshop, you can spend all sorts of time making a high-fidelity design, whereas you can build a design in third of time, tell that story to stakeholders, lock it down, and then go to Photoshop.