WOD Warrior developer learns there’s strength in branding
What should a mobile fitness app have in common with McDonald’s, Coca-Cola, and Microsoft too?
That’s the strongest message that came out of developer Darin Stromberg’s design consultation with Microsoft design lead Dave Crawford.
And — despite our invoking three of the top five brands on the planet — building a strong brand need not be a daunting exercise in complexity or require payments to pricey branding experts. For an app developer, branding can be as easy as “using a good set of colours, a simple font, and a rigid way of laying things out,” Dave says.
WOD Warrior, before
After winning the design consult in a recent DVLUP contest, Darin looked forward to a brisk design workout for WOD Warrior, his CrossFit app for Windows Phone. Going into the session with Dave, one of Darin’s main goals was to make the app “more fluid [and] easier to navigate.”
Dave’s redesign regimen for WOD Warrior met the developer’s goal but also pushed beyond it. “Branding is very important,” Dave says. “It’s what people attach to. So make sure you focus on establishing a strong brand.”
His branding changes for WOD Warrior involved a new font, a unique colour scheme, and text styles “to tie it all together.”
“My app looked like [a core] OS app,” Darin acknowledges. “There wasn’t really any brand behind it.”
Dave’s next exercise for WOD Warrior was to reorganise the information, making it more consumable and more focused on the app’s main purpose. While he gave a thumbs-up to the app’s use of a monthly calendar for keeping track of user workouts, he urged Darin not to stop there.
“Perhaps do something fun here,” Dave says in the video, “with a timeline where each one of these points is one of your workouts.” The timeline “makes it a little cleaner, a little bit easier to consume as well,” he explains.
WOD Warrior, after
Dave sourced a colour palette from Adobe Kuler and modified the palette subtly to align it with colours Darin was already using in WOD Warrior. The new colour scheme features backgrounds in black and dark greys, green and blue “power colours,” and text in shades of grey and white.
The font Exo, available free from the Font Squirrel website, replaced WOD Warrior’s previous font. Exo is available in several weights, each with a true italic version.
But there was one element of the old WOD Warrior that Dave suggested the developer preserve and, in fact, run with. “You can still integrate the centurion image that you bought. It’s a really strong and powerful tile,” he told Darin. “It would be great to see that pulled into the rest of the app.”
Overall, WOD Warrior’s new look “makes it all a lot calmer and a lot clearer to read,” Dave notes.
Before: Just a calendar
After: A timeline option for calendar data
WOD Warrior’s developer walked away from his design consultation with one strong impression.
“The main thing I learned was that you need to brand your app,” says Darin, founder of app publisher Marbic Productions. “I’ve written apps trying to mimic the look and feel of the system Windows Phone-type apps. But you want to make your app memorable so that your users enjoy using it and want to keep using it.”
He also offers a piece of advice for other developers: “Always take advantage of the opportunities that DVLUP offers. DVLUP really is for the developers and helping them achieve success.”
And he should know. Since the redesign, the download and active-users numbers for WOD Warrior have both doubled.
The takeaways: Beyond brand
In addition to Dave’s critical message about the importance of branding, the WOD Warrior session made these points:
- Rework your app to focus on its one or two standout functions, and present other functions as supplemental features.
- Consider representing “a restricted set” of menu selections with radio buttons.
- Use icons where appropriate. Icons are available for free from many sources. To get started, check out sites such asThe Noun Project or explore the Segoe UI Symbol font in Microsoft Windows 8.
- Explore the Application Bar and learn how to leverage it to create a better experience for your users. In the redesigned WOD Warrior, for example, users have an App Bar for flicking between the calendar and timeline views.
Resources to enhance your Windows Phone apps
A video of Dave Crawford’s Practical Design for Windows Developers session, from Microsoft Build 2014, covers a ton of design-related ground. Also available, for download, are the slides from the session (note: 28-MB PPTX file). Slides 42 (branding), 47 (colour palettes), 63 (icons), and 74-86 (displaying information) touch on specific topics covered in this consultation.
In the consultation video, Dave also mentions or alludes to many useful resources. You can find colour palettes, trends, and wheels on the Adobe Kuler site as well as on COLOURlovers. Font Squirrel is a great resource for fonts, as are The Noun Project for icons and other symbols and DinPattern for patterns.
Additional guidance for designing great apps is available in the Design Library of the Windows Phone Dev Center. Also consult Design.windows.com, and look for sources of inspiration in our Design Gallery.
Ready to improve the design and UX of your own Windows Phone app? Design consultations are available as rewards from ourDVLUP programme, including an introductoryone-hour consultation with the experts from Toledo Design. Also be sure to check out the new Live Tile and Splash Screen Design Consultation reward.