Insightly CRM App & Website
Working closely with the Vice President of Product Management and two Product Managers, I was responsible for designing ongoing feature updates. My focus was on our mobile apps on Android and iOS, while managing a Senior UX Designer responsible for web app stories.
Key challenge was improving the overall user experience of our complex existing apps, while maintaining a constant delivery of new features in a fast-paced environment. In addition to working on specific stories, I added UX/UI best practices and processes to our workflow, while educating and evangelizing for more user-centered design.
Case Study: Mobile Filters
Background
The Insightly website and mobile apps provide several list screens that allow users to browse through and navigate to their desired item. A common use case within these is the filtering of displayed items based on certain criteria. Examples include to only show overdue tasks, only show open opportunities, or only show leads assigned to oneself. The goal of this project was to allow for more flexible, yet quick and extensive filtering.
Audit
A detailed audit of the existing functionality across both web and mobile showed that filtering was inconsistent within the web app as well as between web and mobile apps. Further, on mobile not all lists allowed for filtering.
As the web app filtering could not be adjusted at this point, it was decided to focus on building consistent filtering within the mobile app, accepting inconsistencies with the web app where required.
To understand potential filtering approaches, a multitude of mobile apps were reviewed, both in regards to the actual filter dialogs as well as how to access these.
To collect all required filter options across entity types, they were captured in a spreadsheet and prioritized based on user feedback and usage scenarios.
Explorations
A multitude of different approaches for the filter dialogs were explored. These included approaches discovered during the external audit, approaches based on currently implemented selection controls in the web and mobile apps, as well as newly developed designs.
Key challenges included:
- Provide access to a large amount of filtering options, while not overwhelming the user
- Allow fast access to commonly used selections, while being flexible enough for other selections
- Display a wide variety of selection fields, while staying visually consistent (E.g. simple on/off options, known short lists, unknown and potentially long lists, single selects, multiple selects, ...)
Final design
The final chosen design is a combination of different approaches:
- Expose key filters as buttons to allow for one-click selection
- For key filters with an extensive list of options, expose key options directly. Make remaining secondary options available via additional dialogs
- Use textual presentation for less common filters or filters without key options, improving visual hierarchy and differentiation from key filters
- For filters with potentially long lists, provide dialogs with dynamic search capabilities
User quote
Insightly team - I'm DELIGHTED with the implementation of the filtering functionality! It's awesome and a complete game changer for me on the mobile app. Allows me to zoom quickly to what I need in the field. THANK YOU!!!!!!!
Other Example Stories
Enhanced Calendar
Added ability to view combination of user's Insightly calendar, device calendar, and team member's calendars, while improving overall scanability.
Added Global Search
Provided ability to search across Contacts, Organizations, Leads, Opportunities etc., including option to filter search results.
Improved Login Flow
Redesigned login flow including better indication of available login types, better error handling, improved visuals, and additional intro screens to encourage signup.
New Feature Discovery
Designed "What's New" screens indicating added features for new app releases.
