CSE440: Intro to HCI
James Fogarty, Fall 2014


Mood Tracking


Interaction Design
Graphic Design


Adobe Illustrator
Paper Prototyping
Digital Mockups
Poster Design

Depression often manifests as a lack of energy and motivation, along with feelings of hopelessness, helplessness, pessimism, and fatigue.

Because of such symptoms, the thought of seeking help, let alone taking on more involved tasks such as keeping a thorough mood log or journal to track emotion over time, can seem like an incredibly daunting task to those suffering from depression.


To address these specific needs, we designed a wearable fixed with biophysiological sensors, that syncs with a calendar and smart phone application, to actively track user mood while the user remains passive. 

AWEARNESS collects and correlates mood, activity, and temporal data to gain insight into user emotion, aid their mental health professional, and intervene by notifying the professional if the user experiences a depressed mood over an extended period of time.





After the Heuristic Evaluation, one of the most significant critiques we received was the uselessness of our ‘Insights’ screen. We were told that mood is too complicated to be simplified into polarized positive and negative categories, because many different emotions are likely to be experienced during any given activity.

Upon further thought, we realized that not only was this true, but our first design also neglected mood data from immediately before and after an activity, which is often just as informative as mood experienced during the activity itself. Thus, we decided it would be more helpful to give users access to the collective mood data of the day, with the ability to examine mood before, during, and after activities, as well as how mood correlates with other variables such as time and weather.





The most significant change made while creating the digital mockup from the final paper prototype was the deletion of the previously designed Home Screen upon realization that it was unnecessary. Because the Mood Chart is only informative in combination with related information (time, mood, activity), and because it is the only function users would want constant access to, it made sense to make the Mood Chart screen from the paper prototype, defaulted to the current day and time, the new Home Screen. This change required the addition of a navigation bar to allow users the opportunity to utilize such functions as sending mood data to their mental health professional, changing settings, adding activities not listed in their previously synced calendar, and a calendar view to access mood data from days past.

Other changes made in the transition include icon based navigation, to decrease the cognitive load placed on the user and make the experience of using our application as easy as possible, a larger sliding bar easier to touch and move across the screen, and a change of background color. We decided to adjust the background color of the screen from black to white in order to create a calmer, more soothing user experience, crucial for our target market. These adjustments can be noted once more in Figure Three, which displays screenshots of what the user would experience upon sending mood data to their mental health professional.

Following the design critique, many revisions were made. Firstly, it was brought to our attention that the sliding functionality of the bar on the Mood Chart may not be apparent to the user, thus the user may not easily understand how to access the data. To address this potential usability issues, small arrows were added to either side of the bar to imply movement. 

The necessity of easily accessible definitions of ‘Arousal’ and ‘Valence’ was brought to our attention as well. To address this critique, we added a drag-up window, accessed by a small box featuring an upward pointing arrow, at the bottom of the screen above the words. Upon dragging the window up, a window is displayed with simple definitions, and can be easily removed from the screen by pushing the window back down.

The last change made after the Design Critique is regarding tasks. As described below, we decided to alter both tasks in order to design, develop and display more components of our application design.


While bored in class you decide to look over today’s mood data. Identify a time when you experienced high valence and moderately high arousal (happiness), and fill in the missing activity (ballet).



 Explore yesterday’s Mood Chart and identify a time and corresponding activity in which you experienced high valence and moderate arousal (contentment). Re-read the definitions of the terms.



To identify a time when happiness was experienced, the user must simply open the application, wait for the Title Screen to disappear, then slide the purple bar to the left until it highlights a section of the graph with high valence and moderately high arousal.

To fill in the missing activity, simply pressing the ‘Add Activity’ button in the Navigation Bar will bring up a screen composed of input boxes for Activity, Start Time, and Duration, defaulted to the time currently highlighted on the graph for convenience, but this is editable. After pressing ‘Submit,’ the user has completed the first task.

After opening the application and waiting for the Title Screen to disappear, the user must select ‘Calendar’ on the Navigation Bar to access the previous day. Upon selecting November 5th on the calendar, the user is shown their Mood Chart from yesterday. By sliding the purple bar left to evaluate different moods and activities experienced throughout the day, the user will find they experienced contentment at 8PM, while having dinner with CJ, due to the displayed levels of high valence and moderate arousal. To check the definitions of these terms, the user must simply drag the small box containing an arrow upward, and the meanings of each word are displayed.



Design is a necessarily iterative process, and the reasons why became abundantly clear while creating AWEARNESS. By comparing the first paper prototype and the final digital mockup, it is obvious that the final version of our application was profoundly changed from the early design in which it first began. In fact, further iterations would have been beneficial in creating an even more fully developed and robust design.

Throughout the process, our tasks changed tremendously. Our initial tasks consisted of sending data to a mental health professional, a single-step, passive process, and discovering mood trends and data, an equally simple and passive task. By our final iteration, our tasks had become much more involved and relevant, allowing us to further explore our design and test out more of our application’s functionality. Our final tasks were as follows: (1) while bored in class you decide to look over today’s mood data. Identify a time when you experienced high valence and moderately high arousal (happiness), and fill in the missing activity (ballet) and (2) explore yesterday’s Mood Chart and identify a time and corresponding activity in which you experienced high valence and moderate arousal (contentment). Re-read the definitions of the terms.

Additionally, what is perhaps the most significant function of our application, mood insights, changed dramatically from the first design to the final iteration. Our initial design displayed a polarized view of user mood and corresponding activities, but failed to take into account the complexity of emotion as well as the nuances to changes in mood both preceding and following an activity. For instance, perhaps a user feels contentment after working out; this is incredibly significant information, yet totally unaccounted for in our earliest design. Through additional usability tests, we discovered that giving the user access to a detailed account of mood data, as well as how it corresponds to factors such as weather, activities, and time, was a much more successful approach.

The tremendous change our design underwent, through a process consisting of usability tests and iterative design, is what allowed it to become the thoroughly developed, robust application design that it is today.