EagleView Mobile App

The prior version of the EagleView Mobile App did not allow customers to create an account or add credit card information directly through the app. Since we were about to make a larger update to the product, we wanted to take this opportunity to update the design to reflect the changes in branding as well as improve the interaction design of the product.

Since we now had a dedicated mobile development team that had created a new framework we:

• Introduced the ability to create accounts.
• Introduced the ability to add credit card information.
• Created a new user interface that was consistent with current branding and the pattern library.
• This solution increased overall sales of reports by 25%.

• Conducted interviews with customers.
• Began process to turn interviews into personas.
• Conducted Design Studio and whiteboarding sessions.
• Reviewed historical usage data.
• Applied existing style guides Created style guides.
• Reviewed customer feedback to make further improvements.

• Designed interaction flow across the application.
• Created Balsamiq wireframes for mobile, and handed off most of the high-fidelity design work to other designers.
• Coordinated work from 3 other designers.
• Led efforts to maximize consistency across the product by creating pattern library, advising designers on best practices for mobile design, owning the fit-n-finish of the product and ensuring redlines were complete and assets were delivered.
• Worked closely with engineering team and VP of Mobile to ensure the product was moving in the right direction and to improve efficiencies between the design team and the mobile app engineering team.
• Worked closely with marketing team to ensure consistency with changes in corporate branding.
• Conducted interviews with customers in the lead-up to this development effort, which led to the development of user personas.
• Mentored other designers on best practices and stakeholder management.

Early in my design process I tend to start with sketching and whiteboard sessions. This helps me facilitate discussions with other designers, engineers and product managers to better understand the problem, critique ideas, raise new questions and make decisions.

As early in the process as I can, I like to jump into a digital format. This makes it easier to share ideas to a wider audience and to ensure we are not missing important details. For this product, it made sense to mock everything up in low fidelity to facilitate conversations with product managers and the offshore mobile software developers.

I created a pattern library the improve consistency across the app as multiple designers were working on the same product and to speed up design implementation. The pattern library documented each design pattern so it could be implemented once and reused throughout the app.

Redlines were used to create absolute clarity over placement of objects, document assets being used for a specific screen and to handle variations. In some cases, there were slight variations between mobile and tablet that needed to be clarified. This was particularly useful as the app developers were part of an offshore team and the distance could cause a disconnect.

Since I understood code, I was able to have fruitful conversations with the mobile development team in terms of how they were putting the application together. This helped in coming up with ways to implement interactions that at first seemed too complicated to implement.

• Methods: customer interviews, personas, clickable prototypes, surveys, sketching, white boarding, wireframes & design review
• Design: Pen/Paper, Whiteboard, Balsamiq, FireWorks, InVisionApp, Adobe Photoshop
• Development: TestFlight, Xcode, Jira
• Productivity: PowerPoint, Excel, Skype, WebEx, GotoMeeting, Google Hangouts