Hello, VP, design director Demian Johnson! Please tell us a bit about BrainPOP, your educational app currently being used in thousands of schools.
From an educational perspective, the app is great because of the breadth of content it offers. Kids can access hundreds of movies covering what they’re learning in school, or pretty much anything they might be curious about. It’s a great tool for clarifying and underscoring the lessons they learn in class, and it’s a great tool for more informal learning on the go. But on a more basic level, the app is just very appealing and engaging, from Moby [the robot mascot], to the animation, to the movies’ tone and humor.
How integrated is BrainPOP with schools’ curricula?
All BrainPOP movies are aligned to the Common Core and other academic standards. From the website, teachers and parents can access our Standards Tool and search for relevant content by grade, state, or subject area. We cover hundreds of standards-aligned topics within Science, Math, Social Studies, English, Engineering & Tech, Health, and Arts and Music. We’re advised by a team of academic advisors, and many of our writers are former teachers themselves.
Can you talk about your updated design for iOS 7, and what features you like about the new iOS?
Ours is a custom app, so our approach to the updated design was more about adopting the principles of iOS 7 than reflecting specific changes in the standard UIKit elements. Our previous app featured a lot of visual indicators of physicality (bezels, gradients, and lighting effects, etc.) that were characteristic of earlier iOS versions. We stripped away some of these details to simplify the UI, allowing the content itself to play a more prominent role. We also added parallax effects and translucent overlays in appropriate places to create a richer sense of depth, and we made the navigation more gestural and fluid by allowing users to swipe back and forth through their navigation history. We feel that these changes not only embrace the new iOS 7 UI, but also create an improved experience with our content.
What software development tools, people, or communities particularly helped you in creating the app? What lessons did you learn in using these resources?
WWDC 2013 videos and design forums like Dribbble served as good sources of inspiration in the initial design stages. Apple online documentation and TestFlight were the most helpful development tools. We also turned to the Apple Developer Forums, StackOverflow, and the GitHub community. In general, our biggest takeaway from these resources was the importance of trying not to make things more complicated than they needed to be – that the simplest solutions are usually the best.
What went right and wrong with development and release?
What went right:
- In the previous app, we didn’t keep a navigation stack. We decided to add this feature, and since we’re supporting three iOS versions, we created our own logic for it. This way, we only had to write code once in order to deploy to multiple iOS versions.
- On top of the custom navigation stack, we added code that lets users intuitively swipe between the different screens in their navigation history. Again, we wrote our own custom mechanism instead of relying on the iOS 7 mechanism for this – it helped ensure a consistent UX across the different iOS versions.
- Another change we made has to do with how networking is handled. In the previous app, a global state was managed in order to display the correct content in the app. This made it really hard to swipe between the screens. To simplify, we let each screen be individually responsible for loading its own content.
What went wrong:
- We tried to add a background fetch feature that iOS 7 introduced, but a tight deadline made it impossible. We didn’t think there was enough time to test it thoroughly.
- We wanted to submit the app to the new Kids category, which meant we needed to put a parental gate on all links out of the app. Unfortunately, we missed one button. The app testers noticed this, and we had to resubmit. The lesson here: it’s very easy to overlook issues in the final steps of the submission process. You have to remain on guard until the very last moment and be careful when adding (or removing) features late in the game.
- It is always tempting to use third-party libraries for common functionality such as image loading and in-app purchases. Unfortunately the third-party software we relied on for in-app purchasing stopped working in iOS 7. So another lesson learned is that it is often better to rely on your own modules rather than third parties’. The time it takes to find errors in foreign code is often more than the time it would take to write the code from the ground up.
What are a few neat, new apps you are using?
Quandary [free, iOS and Android]: A beautifully designed learning game that develops ethical reasoning skills in a rich science-fiction setting.
DragonBox Algebra [iOS and Android]: An incredibly engaging math app that does a great job of teaching kids algebra without them realizing it.
Sago Mini Doodlecast [iOS]: A unique drawing app for younger kids that records your voice as you draw and plays back the entire drawing process in a short video.
Hopscotch [free, iOS]: Lets kids build their own programming creations by dragging and manipulating graphic blocks of code, then pushing play to see their code in action.
[BrainPOP's mascot, Moby. Photo courtesy of BrainPOP.]