The Avalon App is a platform where Behavioral Therapists and their executive assistants can schedule and track appointments for mental health therapy sessions. My client contacted me to redesign the app’s interface as its previous design was outdated and presented with different user experience issues.
The first step I took was to interview my client to understand the product as best as possible. Although I was hired for this project only to give the product a “facelift”, it was extremely important for me to understand the specifics of the product and its end users.
Some of the issues that I encountered with the previous design included accessibility issues such as typography the was too small for important copy, for calendar dates and times, and also for some call to action buttons (CTA).
Additionally, most colors did not pass contrast tests for accessibility purposes for potentially color-blind users, and the calendar views occupied the entire screen, making the selection of times for appointments very aggravating for Avalon’s users.
Other changes included optimizing the app’s space and multiple user flows, reducing the amount of redundant copy and recreating input fields and forms according to UX best practices.
- Calendar colors did not pass contrast tests.
- Redundant copy that could be eliminated by designing intuitive user flows.
- Sign-in and other forms that were not aligned and did not follow best practices
- Small calls to action (CTA) buttons and overall, and old user interface
- The calendar’s available times could not be seen as a daily or weekly view.
- Additionally, the available times for an entire day occupied the entire screen from top to bottom, making the font too small which could present problems for people who are vision-impaired or have other vision disabilities.
I created wireframes to make sure that all elements were resized successfully and also to test a few new ideas for specific experiences and ussr flows. These were regularly tested with my client and other members of their group.
After I creating wireframes and testing some of my ideas for optimizing the user experience, I moved to the next step which was to update the designs with high-fidelity mockups.
- The previous version of Avalon did not have a daily nor weekly view. I introduced this idea to allow users to use the calendar as they pleased. Because of familiarity heuristics, users who use other platforms such as Google or iCal calendars are used to being able to toggle between these different views. Avalon needed this upgrade.
Weekly view
Daily view