Upgrading a Classic without Breaking It
With some luck and clever marketing, Doodle Buddy became the most popular drawing app on iOS. In August of 2009, it reached the #3 spot overall in the App Store — unheard of for a drawing app. Doodle Buddy appealed to everyone from beginners to amazing artists. Six years after its last update, I licensed the rights to Doodle Buddy with a goal of breathing new life into this App Store jewel.
What Makes Doodle Buddy Magic?
While Doodle Buddy hadn’t been updated for ages, it has continued to be downloaded millions of times a year. It wouldn’t be a mainstay in the App Store if it didn’t adhere to a central premise — make it fun and easy for anyone to draw something they can be proud of. Most drawing apps are not optimized for beginner or amateur artists, but rather tout power and flexibility for advanced designers and graphics professionals.
Great, “make it fun and easy” is a good start, but exactly which features or functions kept these beginners and artists coming back? I have to admit while super excited for the opportunity to bring Doodle Buddy into 2018, messing with such an established property was also a scary proposition. Would I inadvertently break something by “modernizing” it? Would I miss out on any critical features?
To figure out Doodle Buddy’s magic, I did what any product designer should do — learn from users. There were three tracks for the investigation:
- Informal conversations with real users
- Directed task-based user testing
- Careful study of user created drawings
The last tactic, which simply involved searching for posts with #doodlebuddy, may have been the most enlightening. While posted content is likely to be created by more advanced users, these pictures were worth more than a thousand words to me because they showed what features people used and how they used them.
So what are the magic features that make Doodle Buddy so popular for amateurs and artists alike? My research indicates four pillars:
- Smudge. Smoothes over sharp edges and can make difficult to draw objects like clouds, fire or trees a snap. Using Smudge makes almost anything beautiful. Most of the best art created using Doodle Buddy uses at least a little Smudge.
- Stamps. Fun and sometimes mischievous icons that the user “plants” on the canvas with their finger. Stamps can decorate existing pictures or spruce up basic drawings with hard-to-draw objects like eyes or lips. Doodle Buddy Stamps were a precursor to Emoji, which, believe it or not, were not even officially part of the US iOS at the time. Unlike Emoji, each Stamp placement is accompanied by a matching sound (e.g., the Smiley plays a giggle), which makes drawing stamps fun for many and can be muted for the intolerant 😐.
- Stencils. Stencils enable beginners to scribble “outside the lines” and still end up with a perfect circle or a complex insect. When used in concert with other features, advanced users can create interesting and sophisticated art.
- Getting out of the way. Doodle Buddy’s user experience philosophy is to keep the interface out of the way so the user can be immersed in their drawing. For example, when changing text size, there is no font size drop down. Users simply size their text like any any other graphical object — with their fingers. No font size menu, better experience.
Doodle Buddy’s Visual Design Shows Its Age
While Doodle Buddy’s delightful features documented above enable a wonderful drawing experience, visually it was built in a different time. Steve Jobs himself drove Apple to create now scoffed at “skeuomorphic” designs — interfaces that visually emulate the aesthetics of physical objects. Like a middle schooler trying to fit in, the 2009 Doodle Buddy app icon sports a dismembered finger, and inside the app you’ll find an insanely complex 3D toolbar holding puffed up, hard to decipher skeuomorphic icons (see below).
Doodle Buddy 2.0
With all this research in mind, I designed Doodle Buddy 2.0 in hopes that it includes everything that makes it magic but in fresh, clean, modern package. In the comparison below of the iPad version, you can see the bones of the original Doodle Buddy are still there. But several significant changes bring the product into the modern era including:
- Simple, flat surfaces. There’s been a lot of brouhaha about flat interfaces being less usable, however, if used correctly, you can get over those usability problems without sacrificing any beauty or clarity. For example, the Stamps in the 2.0 menu below user test beautifully even though they are not encased in 3D buttons as in Doodle Buddy 1.7.
- Single Line Icons. Single line icons can communicate functions at least as clearly as skeuomorphic icons (compare the trashcans). Yet single line icons have a fraction of the visual noise and complexity.
- Icon Labels. Sometimes it’s impossible to design icons clear enough and differentiated enough. Users start guessing and checking or worse are afraid to click on something they don’t understand. As someone smarter than me once said, “a word is worth a thousand icons”.
- Reorganized Content. The Stamps in version 1.7 are almost randomly placed. Without search (coming soon), it’s a difficult task to find the Stamps you’re looking for (data shows 💩 is popular). With Doodle Buddy 2.0, we used iOS’s built in “Collection View” to organize the Stamp and Background content into named groups for easy scanning.
- Broken Out Color Picker. The Color Picker in the original Doodle Buddy was buried in the Brushes menu. This was not good because a) the color choice affects text color too — hard for users to find and b) this menu was trying to do too many things at once. So in Doodle Buddy 2.0, I broke out the Color Picker and the Brushes menu, which simplified them both. As a side benefit, the active color for both text and brush is always available in the Toolbar — win-win-win!
- Simplified Object Manipulation. When Doodle Buddy came out, there was no “multi-touch” support. That is, a second finger on the screen was not recognized — no pinch and zoom, no nothing. So to manipulate objects like Stencils with one finger, Doodle Buddy 1.7 hung three different gadgets off an object for each of the functions: rotate, move and size. With Doodle Buddy 2.0, two fingers “grabs” the object and you can do whatever you want with it — size, move, rotate or all three at the same time — simple once you know how. This one did require a hint screen to let users know.
The same two-finger manipulation works with the Text tool. No need to select font sizes, just size your text with your fingers until it fits. Nice!
Even More Improvements
Doodle Buddy 2.0 includes countless additional improvements I didn’t have time to address in this already TLDR post. A few notable enhancements include:
- Chalkier Chalk, glitterier Glitter and smoother Smudge — we tried to improve them all
- Redo function for when you undo a bit too much (iPad only for now)
- WYSIWYG brush selector so you know exactly what you’re going to draw before you put your finger down
- Modern Share capabilities so you can share your drawings over Messages, Mail, Airdrop, social networks or whatever
- A few new backgrounds and stencils including more game Backgrounds and the much asked for Butterfly stencil
Upshot
Doodle Buddy 2.0 only recently shipped, and therefore I haven’t gotten a ton of user feedback. So while I think I figured out what the magic is, there’s a decent chance 2.0 breaks a few things. Good news — it’s software, and we’ll fix it!
Would love to hear your thoughts on this exercise and the new Doodle Buddy 2.0 design. Thanks for getting this far.
