workresumeQuick sketches of different interfaces showed that some ideas, such as an emotion graph, were not practical. Not only would the information over long periods be challenging to read, but it would also assign a negative connotation to unpleasant emotions and provide no real value. However, both a monthly and feed view have advantages for viewing information over time. Ultimately these ideas made it into the next round of sketching.
Click image for larger view
When elaborating on the initial sketches, I focused on how the daily input would look; the rest were information reviews. The daily information included a button for a daily randomized prompt for stuck users, a gratitude journaling text box, a journaling text box, a photo upload, and an emoji input for emotions. The month view allows users to review the photo uploads month by month in a grid pattern, and the last two sketches explore how to include the text input in the review function. I wanted to have a way to filter between the different inputs for the feed and have a way to go back yearly or monthly to review without having to scroll through the information.
Click image for larger view
The content strategy expanded the various views that would filter the ‘time capsule’ function. At this stage, I began playing with the idea of a random button to review memories, which might be more valuable than a yearly function for those who don’t have much history logged in the app.
Click image for larger view
As I began wireframing, I focused on organizing all of the relevant information on the home screens. I added an option for tagging the photos and decided that the memories would use a secondary menu to filter between the images, text, and combined feed.
Click image for larger view
Click image for larger view
I added color and images to my wireframe, finalized the exact dimensions, and added the randomized feature. Instead of the emotions graph, I sketched very early in the project, I added an emotion toggle on the month view, allowing the user to switch between the photos and emojis. This way, the information is easily tracked in a way that is intuitive and available to the user.
Click image for larger view
I tested the text for accessibility using WebAIM, increasing the font size and contrast ratio until it passed the WCAG AAA requirements. A future update could include instructions on changing the settings on various phone types to accommodate color-blind users, however because color is not an integral aspect of any portion of the application this would not be necessary.
Assets were created using the Material Design and Icon library available on Figma.
View UI Assets%20(Mockuuups%20Studio)%20(13).png)
Prototype
The MVP successfully meets our project goals. For long-term success, I recommend conducting an ethnographic field study and a true intent study. It is also important to expand the app's features to include coping mechanisms for multiple negative emotional responses, group creation, sharing of specific memories, and additional color themes. Finally, a more comprehensive onboarding process should be developed to review the app's past memory features.
%20(Mockuuups%20Studio)%20(2).png)
