UX Case Study: Creating the Perfect Journal for the Modern User
Traditional journals don’t work for today’s on-the-go user
With more and more people experiencing mental health problems, users are seeking new ways to de-stress and manage their emotions. Journaling has been a staple in the mental health community. However, in the modern technological era, many users find this old-school method boring and inconvenient. Bulky journals are not portable and if the user wants to be able to fully customize their entries with different colors and images, they must have a vast collection of supplies.
Design a journaling app for a tech-savy user
My goal was to find a way to modernize the traditional pen and paper journaling process to appeal to users who want something more fun and accessible. I used a lean UX method, striving to attain my MVP through many cycles of iteration- relying on research and testing to ensure I was on the right track.
High-Level Goals
- Customizable: Take control of your entries by adding photos, videos, audio, and drawings
2. Security: Keep your entries safe with pin protection and full encryption
3. Convenience: Access your journal from your pocket and quickly put it away with auto-save functionality
My Role
I was the sole person working on this project. I began by defining my problem and then solved it through user research, competitor research, organizing the information architecture, creating sketches and wireframes, defining user flows and finishing off with user testing. This project was a part of a UI/UX Design bootcamp through Springboard.
Research
After some preliminary quantitative and qualitative research on various journaling methods and benefits to the practice, I decided to carry out a diary study with 5 participants over the course of 7 days to track their journaling habits. All of these individuals journaled regularly either on pen and paper or electronically.
Competitor Analysis
The first thing I wanted to do when starting this project, was see what else was on the market already. I did a competitor analysis with three of the largest journaling apps available. I evaluated these apps according to three Nielsen Norman heuristics and I assessed them according to the scale below.
Diary Study
In order to get a good idea of my user, I decided to do a diary study with people who regularly journaled. I did this to get an inside look on their journaling routine, their journaling process, and their journaling materials. I used five participants and kept up with them over the course of seven days. At the end of the week, I had a one-on-one interview with each of them to go over their answers.
Affinity Map
After sifting through my notes from the diary study and user interviews, took out key points and quotes and organized them in an affinity map to help me better understand my user.
User Story & MVP
I then created a user story of what my user would be doing on Divulge. This helped me determine what features I needed to include in my MVP and what I could save for future updates.
Persona
Now, I could finally define my user. Creating a persona allowed me to focus on my user’s needs and stay anchored to user-centered design instead of getting lost in creating endless features.
Site Map
At this point, I created a blue print of the app’s information architecture. I did this to organize the logical structure of the app before beginning my sketches to ensure an intuitive interface. I decided to make all actions stem from the Home page in order to keep a flat navigation so the user wouldn’t get lost in a confusing flow.
Sketches
Then, I quickly make some sketches of key screens that were in line with my site map and would best fit the user’s needs. I based these sketches off of other apps in the market that had an easy navigation.
Guerilla Usability Testing
In this usability study, participants were shown a sketched prototype of the app on the POP app and were given two tasks to complete. I interviewed three people who fit with my potential users. They had no previous knowledge of the app.The two tasks they completed are red routes for Divulge. Task one was to create an account using email and create a new post. The second test was to log in using email and search for a previous entry. My goal was to observe if the components of the app were clearly organized and easily findable.
Findings
All three participants successfully completed the first task without any difficulty. They explained as they navigated the screens that the target buttons were easily identifiable. One participant had a bit of trouble with the second task. She successfully logged in but then had a bit of trouble searching for a previous entry. She was expecting there to be a search bar at the top of the dashboard. After further analysis she realized she had to click “All Entries” and then was able to find the search bar there. All three participants were able to clearly identify what each of the buttons on the homepage would lead to which indicated that they were clearly labeled.
Recommendations
- Add a search bar to the home page for easier navigation
- Add instructions/FAQ to the Help page to eliminate confusion on where different elements of the app are found
Low Fidelity Wireframes
I was then able to turn these sketches into lo-fi wireframes. This allowed me to more throughly flesh out all the screens of the app and plan out how different screens would interact with others.
Visual Design
At this point, I created a moodboard and defined the brand platform. Defining the aesthetic of the app was important to bring my designs to life and ensure that they would create a comforting and inviting product for the user. I used Google’s Material Design as the basis for much of my UI.
Moodboard
High Fidelity Screens
The next step in my process was to create high fidelity screens, which I did by applying my visual design planning to my low fidelity wireframes. Applying my visual design elements allowed me to see if my color choices and other design elements worked cohesively to create a product that the user would enjoy using.
Accessibility Audit
After creating my screens, I ran an accessibility audit to ensure that I carried out inclusive design. It is so important to consider all users when designing.
User Testing
I conducted moderated usability tests with five participants. Each participant was asked to complete four tasks; all of which took them through red routes for the app. During testing I asked them to explain their thinking through the tasks. At the end I asked them questions from a preset list along with questions that arose during the test.
User Testing- Findings
After synthesizing all of my user testing results, I found 5 major issues that needed to be addressed. I made the necessary changes and then ran another round of usability tests to ensure that the changes I made solved these issues- which I found that they did.
Issue #1: Set Your Intentions
Participants consistently were confused when presented with the “Set Your Intentions” page. All of them confused it for the home page and expected to be able to engage in tasks from this page. They did not understand that it was just a preliminary page for them to get into the correct headspace before entering the main part of the app.
Priority: Critical
Nielsen Norman Heuristic: Help & Documentation; Match Between the System and the Real World; Consistency and standards
Recommendations:
- Change the location of this page to appear after the user clicks “New Entry”
- Add more text to the heading of the page to explain what it’s for
- Add a skip option for users who do not want to interact with this page and would rather go directly to the “New Entry” page
Issue #2: Delete Entry
Almost every test participant had difficulty figuring out how to delete an old entry. Many of them expected to have to open the entry to find a delete button. Only one participant was able to successfully delete an entry on the first attempt
Priority: Critical
Nielsen Norman Heuristic: Flexibility & Efficiency of Use
Recommendations:
- Add an additional method of deleting an old entry within the entry itself
Issue #3: Giving Gratitude
One participant expressed confusion on where this entry would be saved after typing out reasons why they are grateful.
Priority: Major
Nielsen Norman Heuristic: Recognition vs. Recall
Recommendations:
- Add tab under “All Entries” where only GG entries will be saved
Issue #4: Tip of the Day
Participants did not interact with this portion of the app. When given free range to interact with the prototype at the end of the tests, users glanced over this button and missed out on the information.
Priority: Minor
Recommendations:
- Redesign Home page to display T.O.T.D without having to click on another section to access this information
Issue #5: Welcome Screen
I asked users to evaluate the Welcome screen and give me their thoughts on what they would expat to be able to do in the app. A few of them still did not have a clear idea of what Divulge could be used for and thought it was just a notes app.
Priority: Minor
Recommendations:
- Add another carousel screen detailing exactly what the user can do on Divulge making the onboarding process even more effective
Lessons Learned
This was my first big comprehensive UX project. Looking back on all of the work I did, I can say that I learned a lot and would do some things differently in the future, but am also proud of all the work I did and all of skills I have acquired.
Lesson #1: Define the User Early
When I did my case study, my participants were avid journalers. Most of them journaled regularly on pen and paper. Through my case study I realized that people who already journal regularly are very attached to their method. They invest in good quality materials and are very particular about everything in their journaling process from what kind of paper is in their journals to the thickness of the pen they use. I couldn’t have known this until after conducting my diary study, but I realized that these people probably would not be my target audience. Instead, I would want to focus on people who are interested in getting into journaling but were never excited about the traditional method. Hind sight is always 20/20 but in my next project I will use a quick survey before investing a lot of time into a comprehensive study. This will ensure that I am indeed testing the correct group of people who will likely be my target audience.
Lesson #2: Get Inspired
There is a fine line between copying and taking inspiration from other great products that exist elsewhere. In the beginning of my project, I was resistant to looking at other products when creating my sketches and wireframes. I expected to come up with everything myself. However, I realized that there are so many really great products in the market place with a lot of research behind them. I learned that it is okay to look at these to learn from them in order to make connections between how a page is set up and what works for users. Going forward, I think it’s very beneficial to look at other case studies and product screens to see new interaction methods and trends that I can provide for my user.
Lesson #3: Test, Test, Test!
Design can be a very subjective practice. However, UX Design is not. Every time I did user testing in this project, it reassured me that I was on the right track or it let me know that I have to change direction. My early guerrilla user testing was really helpful since I did it so early on in the process. Luckily, there were no glaring issues but if there had been, I would have been able to catch them before doing a lot of design work. This saves so much time in the whole process. The user testing I did at the end of the project showed me common issues that users were having. This fixes were very easy and quick but vastly improved usability. Testing throughout the design process was a great benefit to my project and will be sure to prioritize this in all my design work.
Future Updates
Through all the research and ideation that I did on this project, I ended up having a list of features that would benefit the user in future updates. If this project were to continue, here is a list of upgrades that would make the user experience even more enjoyable.
Feature #1: Facial Recognition
My research showed me that being able to quickly access entires is very important for the user- as they may only have a few minutes to get their thoughts down. Facial recognition technology would keep the user’s security at the forefront of the user’s experience but also make accessibility quicker and more seamless than using a pin or logging in and out each time.
Feature #2: Increased Customization
The diary study I conducted showed me that user’s journals are deeply personal. The materials they use can greatly impact their experience and increased customization makes their entries more meaningful. In future updates, I would love to expand customization options like changing the color of the entry background and text. I would also like to see the “All Entries” section resemble an actual book. This would increase the Nielsen Norman heuristic: Match Between the System and the Real World.
Feature #3: Notification Reminders
When creating my user persona, I realized that my target user is very reliant on their phone in order to complete every-day tasks. They often use their calendar app and reminders. I also learned in my diary study that users would like to journal more, but often times they simply forget to do it. In a future update, I would love to see an option to turn on notifications to remind the user to open their journal every day. This would allow the user to be more consistent with their entries and have more memories to look back on.
And that wraps up my case study! This was a really big project and I learned so much. I’m looking forward to the next one.