Some of my favorite WWDC presentations over the past few years have been those that focused on thoughtful UI design and prototyping, so when I heard that the same topics would be the focus of new Today at Apple sessions, I was curious to try one out myself.
Apple’s SVP of Retail Angela Ahrendts announced the new sessions last Friday in a tweet following the wrap-up of WWDC 2018 in San Jose. Today at Apple is a series of daily, creative programs held for free at all of Apple’s stores. The program rolled out globally just a little over a year ago.
The new prototyping sessions and similar Teacher Tuesday program quietly began this week in a small number of retail stores, and will continue to expand in coming days. One of the first sessions was held on Thursday afternoon at Apple Mayfair in Wauwatosa, which I attended with my younger brother. Since the event listing had only recently been added to the calendar, we had the session to ourselves.
Gathering around the Forum tables near the back of the store, we were given iPad Pros and Apple Pencils to work with. The Creative leading our session, Christian, asked about any previous experience with the tools we might have. As a middle school student, my brother was familiar with Keynote for presentations, and I had watched the related WWDC talks, but neither of us have built any apps ourselves. I was curious how prototyping would translate to the iPad, since I had seen it accomplished only with the macOS version of Keynote.
We began by discussing a graphic similar to one shown at the “Fake It Till You Make It” WWDC session that outlines the prototyping cycle of making mockups, showing others, and learning from the feedback you receive. By making design a priority at the beginning of the development process, you end up with a better user experience.
In a competitive landscape of dedicated prototyping tools from big and small names alike, Keynote is surprisingly robust. Christian noted that even the current Keynote app was prototyped in an earlier version of the software. Compared to other tools I’ve used, Keynote has a much more approachable learning curve. Anyone familiar with creating a presentation will already know how to use it. Plus, it’s available for free on every iPhone, iPad, Mac, and on the web.
I was relieved to see that Apple had created a template with a suggested food ordering app to prototype, because neither my brother nor I were prepared with an idea to work on. If you come in with your app plan already in mind, you’ll be a step ahead. We began on a blank slide by simply sketching out design ideas with an Apple Pencil.
My design prototype and Apple’s template.
Outside of brief testing at Apple stores in the past, this was my first chance to really experience sketching with the Pencil. It was surprisingly fun. One frustration shared between all of us was the inability to select objects in Keynote with the Pencil. Perhaps coincidentally, an update to Keynote rolled out the same afternoon that added the feature.
After sharing ideas, we moved on to the next slides, where Apple had built a canvas for building our design with provided UI elements and objects built in to Keynote. The display was divided into three sections: a screenshot of the iOS Messages app for reference, a blank iPhone X-sized rectangle, and a sandbox full of icons, text, and UI elements. By duplicating these elements and manipulating their placement, we spent the next 25 minutes or so building a few of the screens in our app.
Apple’s design kit for Keynote.
This part of the process really hinged on the availability of so many accurate and properly formatted UI elements to reuse. These assets aren’t available in Keynote’s default shape library. Fortunately, Apple recently updated their Design Resources for iOS 12 to include a kit built specifically for prototyping in Keynote. We weren’t told about this in the session, but it’s something I’d highly recommend downloading.
After building our designs, we simulated real app interactions by linking shapes and objects to other slides. Afterward, we presented our in-progress concepts. During this time, many of the store’s other employees stopped by to check out the session, curious to see what it was all about. Christian explained that Apple is trying to fill out their range of sessions offered on app development and design, and recommended other programs that dive into the basics of programming with Swift.
My brother’s early sketches and design prototype.
Going into the session already familiar with the prototyping process, I assumed that I wouldn’t learn anything new, and that an hour would be way too much time to cover the topic. By the end, I was secretly hoping for “just five more minutes!” to tweak my icons or try a new layout – I was having a lot of fun! The iPad Pro and Apple Pencil feel like the natural combination for prototyping, too. It makes the most sense to design and preview your apps on the same type of display you’ll be using them on, and I never felt hampered by Keynote’s feature set on iOS.
When the session was over, we were offered the ability to AirDrop the templates we had worked on to our personal devices to continue designing at home. I think it would be fun to see a continuation of the prototyping series with more advanced courses that build on your saved work from earlier programs. My brother told me he wants to try another Today at Apple session.
Recommended related WWDC sessions:
- Prototyping: Fake It Till You Make It (2014)
- Designing for Future Hardware (2015)
- Iterative UI Design (2016)
- 60 Second Prototyping (2017)
- The Life of a Button (2018)
- Prototyping for AR (2018)
Check out 9to5Mac on YouTube for more Apple news:
FTC: We use income earning auto affiliate links. More.
Comments