The Making of CALO

Interested in how CALO Stardust was made? See CALO Stardust from the beginning and how it changed from our initial designs ideas to the fully-fleshed sidebar.

Armed with the knowledge of users’ workflows, work habits, and the tools they use, the CALO Stardust team brainstormed both individually and as a team to come up with the best solution that would address the needs and solve the breakdown of our users.

We soon emerged with several design principles that guided us throughout the ideation / synthesis stages.

Also from the ideation stage, two design directions emerged: 1. to design a system that supports the user’s task management, and 2. to design a system that supports collaboration between the users. Since the second direction was contingent on the success of the first one, we focused on creating the best task manager for our users.

Our ideas for task management included system automatically prioritizing tasks for users, different levels of notifications, various ways of task / project visualization, activity documentation, and task organization. The ideas for collaboration included allowing users to schedule meetings, delegate tasks, and supporting other forms of communications through computers.

After furiously sketching and exchanging ideas on whiteboards, it soon become apparent for us to present the information users would need constantly in a from of a sidebar on the screen. Users wanted to see their schedule, tasks, be notified for important events and have easy access to emails and calendars. These clusters of information eventually became separate panes in the sidebar to distinguish from one another. They later became the Task Pane, Notification Center, Schedule, CALO Suggestion, and the Access to Applications on our final sidebar.

Our team saw that this sidebar would be a space for quick, at-a-glance information. Therefore, we needed to provide a way for users to reach more in-depth information about the items they see in the sidebar. We saw them in the form of stand-alone windows with more controls and flexibilities that would not be possible in the limited space provided inside the sidebar.

Design Validation - from sketches to prototypes

Though most of our design ideas came from user observations and interviews, we wanted to make sure our directions were in synch with what users really wanted. To validate our directions, we made short stories of how the system would be used and present them in a form of comic strips. We showed the scenarios to executives and assistants and received feedback we used to adjust our design directions.

These are the findings we extracted from this validation process.

From the second point, we generated th concept of mini sidebar which can be minimized to a single column, maximizing the screen estate without losing the power of the system.

Paper Prototypes - from concepts to interaction details

Gathering all the results from the validation, our team then moved on to fleshing out the details of our design—how to integrate different components, how the sidebar interface looks, and how users would interact with different parts of the system. We sketched out buttons, icons, text boxes and discussed many hours in deciding what metaphors to use, which controls to place on the sidebar, etc. to come with the most intuitive and effective user interface. This is the stage, for example, we decided to make the component panes collapsible, what single-click and double-click would mean in different panes, and embed training consistently as contextual menus in the right-click.

For each major iteration in this stage, we ran evaluative tests to look for any usability issues, such as inconsistencies in interactions, obscure use of icons, lack of affordance and any other use of (or lack of) controls that would bring confusion. We asked people to perform realistic tasks that would get accomplished using the system and carefully observed their thought processes, points of difficulties and their perception of the system. Though the interactions were kept as consistent as possible, we tested both the sidebar and the mini sidebar to throughly check usability for our design.

Our Solution - from paper to fleshed-out sidebar on screen

After the paper prototype, we were ready to move on to an interactive prototype on a computer screen. The sidebar was created from scratch using Java and tested for usability once more. This time, we were particularly interested to see how users would interact with a high-fidelity prototype with real-time animations. We wanted to know whether people would notice the movements, understand what they mean, and find them helpful. From the findings from this round of testing, we fine-tuned our final sidebar CALO Stardust. For example, users wanted to quickly identify which tasks were added by the system instead of themselves, so we provided a CALO icon next to the tasks that were added by the system. Finally, we ran through our interface with universal principles of usability to triple-check our design decisions.

Thus, after weeks and months of designing, coding, and user testing, our final sidebar emerged as our proud creation that deserves public attention.

Read on about the background of CALO Stardust on our background page.

Why Stardust?

Stardust is what is left from the passage of great ideas just out of reach. We think CALO is going to revolutionize the world of task management and reduce the headaches many busy people face (and that's a lot of people these days). Not to mention is the fact we sweat stardust in creating this product ;)