.
Fall 2018
Storia
Overview
Storia
is a conceptual web app that helps busy people chronicle their lives as a cohesive story.

I worked on Storia as a personal project for 3 weeks, whenever I had time during the semester.
Looking for my internship projects?
Check out my latest one here.





Inspiration
inspiration
I used to journal daily! I signed up for a journal service that would email me a reminder every day, and in the evenings I'd take the time to just reflect and write. I really enjoyed having those times of peace and clarity of mind. If I skipped a day, I’d fill it back in within a couple days.

When I hit college,
I was so busy
that the reminders just started piling up. Every few months, I'd try to write a "catch-up" entry about everything that happened to me so far--events, new people I'd met--
but it would be so long and disorganized that I'd end up giving up.
Problem
Journaling is difficult to organize and keep up with.


With so many obligations, it’s hard to find time. Meanwhile, the gap between memories and recorded entries widens.
Research
I needed to see if this wasn’t just a me problem! To really understand the problem at hand and how to design the best solution,
I sent out a preliminary user questionnaire and looked at existing solutions.
Questionnaire
In the questionnaire, I asked college students about their journaling habits. I discovered some key statistics, barriers, and habits:
Benchmarking
I then looked at existing solutions, their pros and cons, and how they could be applied to Storia. I looked at four different categories of solutions:
bona fide journaling apps, writing apps, habit-forming apps, and story planning/organizing apps.
I wanted to learn more about how they solved their users' problems.
Afterwards, I came up with lists of features that I thought were most successful and effective for each category of apps.
Addressing User Concerns
I used my benchmarking takeaways to map users' concerns from the questionnaire to features Storia could have as solutions. While the last one, "journaling is difficult to organize," wasn't a user concern, it was one of the core problems I was trying to address in the first place.
Users
User Personas
From my research, I came up with 2 user personas with different use cases and habits:
Vivian
loves photography because it allows her to record the important events and people in her life. She uses journaling as another way to record everything, so she wants to write daily and add photos she's taken.

On the other hand, as a freshman,
Evan
is stressed out from hard classes and the new environment. His advisor suggested he use a journal to vent his feelings whenever he's overwhelmed, but he has trouble putting his feelings to words.
User Journeys
I then outlined user journeys that captured how Vivian and Evan would interact with Storia in their day to day lives. These would help me visualize the user flow and what features each screen should include.
Ideation
Sketching
I played with different layouts quickly by sketching out my ideas and scribbling notes. At this point, I focused on just getting any idea I had out on paper, which is why they're so messy! Here are a few pages out of many:
Mood Board
I made a mood board for style inspiration, centered around purple (which is a relaxing color, according to color theory) and twilight/night.
Style Guide
Iterations
Throughout the design process, I asked some of the users who had filled out the preliminary questionnaire for their opinions on my work in progress and conducted some A/B testing.
Minimalism vs. Comfort
Early on,
I played with a very minimalist design
in the spirit of Medium and other distraction-free environments, with a mostly white background and line icons, thinking it would be the best solution for users' concerns about being easily distracted.

After showing it to users, however, I found that while it wasn't distracting, some users said it also made journaling feel less intimate.
The white interface was too sterile and empty,
and in an ideal world
an online diary would feel comforting and friendly
--a safe space to express yourself.

I added more colors, making the purple accent more prominent, and added more rounded edges. I also made the bookmark button bigger and at the top of the entry, much like where a bookmark would go in a real book.
Minimalist
Comforting


With these additions, the main screen wasn't very distraction-free environment, so I also
added buttons to collapse the side bar and full screen the writing area!
Other Iterations
My other iterations ranged from ones involving
minute visual design changes
(like the mini calendar, people cards, and collapse buttons) to the
higher level features
(places vs tags). Every time I completed a line of iterations for a feature, I would check in with users. Occasionally, I also asked them to complete tasks on the work in progress prototype.
For places vs tags, I originally considered having a "Places" feature to accompany the "People" page, where users could see diary entries organized by places they were written in. When I asked users, though, they said they would generally write their entries in the same place most days. I changed this feature to "Tags" as an alternative organizational system and received much more positive response.
Prototype
Email
The email is meant to make it easy for users to get their entries in. Users can reply to the email with their entries so they don't have to navigate anywhere else, and the prompt is there to help if they choose to do so. There's also a button in the email so they can easily go to Storia if they want to.

To incentivize users to respond, if they're close to completing an achievement, there will also be a sentence saying so.
new header
Main Screen
The main screen features three panels:
navigation, entries, and writing space.


As mentioned before, the navigation is collapsible to reduce distractions, and the writing space can be full-screened. Clicking on dates in the mini calendar will show all entries made on that day throughout the years in the entries panel.

If the user is coming from an email, the writing space is populated with the same prompt. Users can close the prompt, keep it (turning it into plain, editable text), or get a new prompt. To keep this space distraction free, there are only three bubbles for entry editing, but highlighting text or expanding the + will offer more options, like tagging people and formatting.

Users can change the date and location manually by clicking on the respective fields, allowing them to make retroactive entries.
game description
Achievements
The achievements are meant to incentivize users to meet their goals and make new habits. Since every user will have their own goals, users can make their own achievements. There will still be some starter achievements already premade though, and suggestions will be given during creation!

The completed section is meant to be like a trophy case, with a prominent trophy image that can be set in achievement creation from a variety of premade medal images in bronze, silver, gold, etc., or users can upload their own.
People
When users tag names in their entries, a profile is automatically created in the People tab (but users can manually create one as well). In the profiles, users can add any information they want to remember: how they know each other, how they met, birthdays, a brief description, photos, etc. Once the profile is created, Storia automatically tracks mentions of the name, and users can add nicknames too. Users can also add people to groups like family, organizations, and more.
People Overview
Individual Profile
Future Features
In the future, I'd like to add more features, like
onboarding, calendar sync, sharing options, and other ways for users to freely express themselves (maybe drawing and voice recordings!)
. I'd also like to
evaluate creating an achievement rewards system
, and most importantly,
conduct some final user testing
to make sure my design is the best it can be!
Thanks for reading!