New App Experience

Overview

Reimagined app experience for building and filling digital forms. Users utilized the application for everything from collecting data out in the field to creating an estimate for a construction project.

Role

Lead UI Designer

Duration

4 Months

Problem & Motivation

The existing mobile application had a few complex steps to getting started which added a learning curve for most users. This included building forms only on desktop which left the mobile app as the last step for filling and sending out completed mobile forms. Adding the ability to build forms on mobile would eliminate the need to swap to desktop. This reduced the confusion among users and allowed for edits and changes onsite.

Additionally, the application’s design had an outdated interface and branding. It was important to update this to have both the build and filling out experience feel unified while simplifying the process.

Research

I began with looking at how users perceive, use and interact with the mobile application in its current state.

Since user testing was already conducted, I focused on competitive analysis of other mobile applications and user testing results to inform the final designs.

Design Solution

There were a few key areas I identified as ways to help unify and create a more intuitive design for users.

Look and Feel

Simplified color palette across the entire application allowed for a more intentional use of colors. The primary blue is used to bring the user’s focus to the important actions while secondary and neutral colors are used to support without immediately drawing the eye away.

popup image
Icon set

A newly designed set of icons were also added to bring the branding together on both mobile and desktop.

popup image
Narrow to full screen view

Existing features such as Barcode Scan, GPS Capture, and Signature capture were updated to fit the full screen for a better viewing experience.

popup image
popup image
popup image
Standard Fonts Sizes, Interactions, and Gestures

Standardized iOS and Android font sizes were applied to allow users to change font size for a more inclusive mobile application. Common interactions and gestures from iOS and Android were utilized to respect users’ mental models.

popup image

Takeaways

Over the course of a few months, I became very familiar with iOS and Material Design Guidelines. While iOS and Android standards were applied to font sizes, interactions and gestures in the initial stages, these were guidelines and not hard rules.

Working with the development team was important to understand technical constraints and when to revisit designs if it was not feasible. This helped me learn how to think on the fly and pivot when needed.