UX design, few things are more intricate than time and personal time management — only a good arsenal of mobile design patterns and information architecture principles can save you. This is the story of redesigning the UX for a popular calendar tool on Android: Business Calendar. We’ll cover designing systems, interaction design problems, scaling across screens and platforms, research, and big business decisions and their outcomes.
Business Calendar started out as a side project, a one-man show, and is now run by a team of eight in Berlin. The app was very successful right from the time Android entered the mainstream market, and it now has an active user base of 2 million. But instead of modernizing the design and usability regularly, the developers focused on implementing user requests and customization options. Outdated design and new features stuffed in had made the app heavy and complex — full of features, hard to maintain for the team, hardly accessible for new users.
This post contains [animated_text variations=”spoilers,trailers,images” color=”#151515″][/animated_text]
Knowing they needed a redesign but having few resources themselves, the team approached Opoloo to get design and interaction on the same level as the development. For the task, we delineated goals to attract new users and keep the existing user base satisfied:
- Improve user experience
Strip down and reorganize the user interface to revive the simple, fast, efficient work process of a productivity tool. - Improve accessibility
Keep old users happy, lower the barriers for new ones. - Incorporate task management
Integrate tools that users need every day to create more value. - Apply modern design standards
Address the main criticism: “Could be prettier.” - Extensive tablet support
Improve the tablet experience as a first step to ubiquity.
The hardest part of any mobile calendar’s interface is the density of information, with each little piece fighting for attention: grids, events, time indicators, text labels, colors and other elements to interact with, manipulate and customize. Finding the right balance is what makes for an accessible calendar UI. Below are a few tricks we pulled with the presentation of data (i.e. how pieces of information are consumed, searched for and compared).
Although an iconic and heavily used feature of Business Calendar, the favorite bar was barely accessible: It became too small and too crowded to use as the number of calendars grew. Our solution was to use Android’s black system bar as an optical trick: The favorite bar now feels much taller and easier to tap, due to the black-in-black design. Additionally, we improved touch targets, made visible and invisible states clearer, and implemented a scrolling pattern to house more calendars.
