028.jpg

MOBILE HARMONY PATTERNS

AUG 2013

In 2013, Intuit brought it's small business offerings together under the brand QuickBooks and called it's complete redesign project Harmony. As part of the second wave of Harmony, I spearheaded a team of mobile designers to create mobile patterns following the UI styles that we created for the web.


THE PROJECT PLAN

To kick things off, I created a project plan detailing out all of the different patterns that we'd need to create for our Android and iOS apps. Some patterns closely followed their associated web pattern, while others were required specifically for mobile.


APP INVENTORY

Before we jumped into design, we had to take a hard look at our existing applications which varied across Intuit's once separate business units. The payroll application looked nothing like the accounting application and even our iOS and Android applications didn't appear to follow a unified system.


PATTERN EXPLORATION

After assigning owners to each pattern, we spent lots of team time workshopping, getting feedback, and iterating on design ideas before starting to wireframe.


Pattern example: Actions/Toolbars

After aligning on the overall approach, we each took a stab at concepts for each pattern. I was responsible for a few patterns including Actions and Toolbars. I explored a variety of concepts for each platform and screen size before landing on a final recommendation.


Pattern Example: Photos

Other patterns were much simpler and only required a visual treatment and alignment across the web and mobile offerings. For example, we decided that photos of people should have a circle crop while photos of items, receipts, and logos should have a square crop. The final pattern can be viewed here http://harmony.intuit.com/media/


FINAL RESULT

While the final implementations are still in progress, the team completed several patterns that are in use today and the apps are finally coming together as an ecosystem family. Our pattern library is public and constantly evolving. It can be viewed here: http://harmony.intuit.com/