0 > 1 PROJECT

Digitizing WriteGirl workshops to bridge global access and creative mentorship.

ROLE
UX/UI Designer

DURATION
Nov 2023 - Sep 2024

TOOLS
Figma, Illustrator, Premiere,
Visual Studio Code, Procreate

TEAM
4 Designers + 8 Developers

Who is WriteGirl?

WriteGirl, based in Los Angeles, empowers underserved girls and gender-expansive youth by promoting creativity and self-expression through mentorship from a community of women writers. With over 200 volunteer women writers, WriteGirl serves more than 500 girls each year. They conduct numerous workshops, panel discussions, and special events annually, helping participants develop their creativity, succeed in high school, and prepare for college.

THE PROBLEM

Their creative writing activities are not widely accessible to a global audience.

The transition to digital spaces has proven challenging, as writing workshops and mentoring sessions lose some of their impact and robustness online. WriteGirl engages with young people from as far away as Uganda and Tajikistan, who are unable to attend in-person events and resources, highlighting the need for a more effective digital solution.

THE SOLUTION

How can we bring the magic of WriteGirl’s creative writing programs to a global audience?

In collaboration with our product partners at WriteGirl, we identified key pain points and potential projects, leading us to conceptualize a creative writing app. This app aims to replicate the enriching experience of WriteGirl’s in-person workshops in a digital format, making their resources more accessible worldwide.

Our vision for the app includes features designed to appeal to a wide audience, including girls, gender-expansive youth, and even adults of all genders. The distinctive features we planned are intended to serve as tools or companions for writers, much like WriteGirl’s workshops.

Skip to Solution

COMPETITIVE ANALYSIS

We conducted an audit of the strengths and weaknesses of 6 existing apps in the creative writing market. The main takeaway was that these apps often provided surface-level content. We aimed to differentiate our app not only through its immersive design but also through the depth and quality of its activities.

Post-interviews, we created an affinity map to categorize the challenges, processes, and motivations shared by users.

INSIGHT SYNTHESIS

Hearing out the users and finding solutions.

1 Writing consistently can be stressful and pressuring.
We want users to write freely and at their own pace. Doing streaks may put more stress on reaching for the app.
Validated our decision to not track progress or do streaks.
2 Basic and typical writing tips are not helpful.
We want users to reach for writing tips we provide and specifically curate them based on the user’s needs.
Allow users to interact with unique activities that tap into their senses.
3 Writer’s block often occurs from overworking.
We want to make sure that users take breaks in between writing, as writing isn’t a task.
Validated the need for mind and body breaks that rejuvenate creativity.
4 Writing is difficult when not in a comfortable environment.
Users are most productive when in a comfortable environment.
Guides decision to add personalization in the free write section.

Putting Ourselves in the User's Shoes.

inspire brainstorming and creative thinking by framing challenges as opportunities?
guide writers while allowing them to tap into their imagination and expression?
make the results, although random, feel cohesive?

USER FLOWS

We used insights from our competitive analysis, interviews, and affinity mapping to create user journeys within our app. This process helped us design intuitive and engaging user flows that addressed the identified pain points and aligned with WriteGirl's mission.

ITERATIONS

Putting Ideas Onto Frames.

Left Image Left Image Left Image Left Image
Right Image Right Image Right Image Right Image

USABILITY TESTING

Walking it through with Users.

After conducting usability testing with seven users, we identified opportunities to enhance the user experience and design. We focused on understanding where users struggled, why they encountered these difficulties, and how we could improve the app.

1
Discoverability and consistency

Users had difficulty discovering and consistently using the different app features, particularly the history feature.

We made the history feature more accessible on end state pages, eliminating the need for backtracking and improving discoverability.

2
User-centric wording

Users suggested clearer guiding text and action phrases for a more intuitive and personable app experience.

We incorporated user-centric wording, making buttons more intuitive and the app more relatable.

For example, we changed "type of break" to "part of you," "mental" to "my mind," and "physical" to "all of me."

3
Placing graphics intentionally

We decided to remove graphics and keep texts only.

This choice empowers users to imagine what the text might look like through their own creativity, as opposed being guided towards a predefined visualization

4
Humanizing the app

Users want the app to be welcoming and easy to reach out for.

In addition to more user-centric wording, when users scroll to the bottom of the screen, they will see friendly and encouraging messages. This humanization also brings in the in-person workshop touch.

DESIGN SYSTEM

Making sure our design system embodies its playful yet mature nature.

FINAL DESIGNS

The BoldInk App!

Onboarding GIF

1 Onboarding

A welcoming process that will excite users to pick up a pen and get started.

  • Learn about BoldInk.
  • Read each slide.
  • Create an account or sign in.
  • Get excited!
Home Screen GIF

2 Home Screen

Your easily accessible toolkit to help guide users in exploring all activities and features.

  • Learn about all the tools and features.
  • Look into Writing Activities.
  • Take a break from writing.
  • Read writing tips.
Triple Flips GIF

3 Triple Flips

Randomized collection of objects and words to inspire a poem, story, or even a song.

  • Flip the cards for a prompt.
  • Shuffle for a new selection.
  • Save in bookmarks if you like the selection.
  • Start writing!
Door Activities GIF

4 Door Activities

Progressive writing activities that let you enter a whole new realm of unique categories.

  • Swipe or scroll to select a door to enter.
  • Enter door aka genre.
  • Walk through each step of the activity.
  • Save the genre in bookmark to revisit.
Story Starters GIF

5 Story Starters

You can use these randomizers to start a story or come back here for inspiration.

  • Click on a story.
  • Start writing a story based on generated prompt.
  • Reshuffle for a new prompt.
  • Save prompt in bookmark to revisit.
Pocket Prompts GIF

6 Pocket Prompts

Designed to fire up your creativity. Mine your response for nuggets of words, phrases, or ideas.

  • A quick start to writing.
  • Reshuffle for new ideas.
  • Start writing based on the creative prompts.
Free Write Zone GIF

7 Free Write Zone

Grab a pen and paper. This is your zone to let your creativity run free.

  • Create a place where you're comfortable.
  • Choose a song and background.
  • Start writing based on your mood.
  • Feel free to add a timer.
Mind and Body Moment GIF

8 Mind and Body Moment

Activities to refocus attention during a long writing session or to help you shift gears between projects.

  • Writing also involves rest.
  • Select what type of break you would like to take.
  • Set up a timer to refocus.
  • Once well rested, start writing again!
Bookmarks GIF

9 Bookmarks

All your saved items are right here, ready for you to dive back in and let your creativity flow!

  • Revisit your saved topics.
  • Categorize your saved topics based on theme.
  • Visit saved bookmark when stuck.

MAIN TAKEAWAYS

Breakthrough with Colors.

As a designer it is important to experiment with various design elements and WriteGirl truly allowed me to challenge myself. I got to experiment with fun fonts, colors, and even create my own illustrations.

1
Playing with Colors
‍
‍
WriteGirl incorporates a lot of color and design elements, making it difficult to find a good balance between the mature yet playful nature of the app. As a designer who loves minimalism with accents, WriteGirl was truly a challenge as I had to play with shades of orange and green. It was a hard process figuring out how and where to place colors, but am so happy to see the final product successfully capturing the identity of WriteGirl.
‍

2
Embodying the Brand
‍

When designing, it is always important to understand the brand and what their identity is. WriteGirl prioritizes a playful environment but also an informational and mature environment for writers to grow. While playing with fun illustrations and colors, we always had to consider creating a strong foundation for solving issues behind writers' block.

3
Unique Prototypes and Designs
‍
‍
The WriteGirl app plays with a lot of features like Triple Flips, Sticky Notes, moving graphics, etc. As much as it was a struggle to develop, it was a struggle figuring out how to prototype them. Our design team experimented with various ways to make features look as seamless as possible which came with a lot of experimentation, but also a lot of fun. I also got to create hand-drawn illustrations to embody the playful identity!

Give us the W cuz we the G

I love this team so much. Not only did I learn so much but I've met lifelong friends and further discovered my love for creative design. Thank you for the best year. Shoutout to Angela Ling, Caroline DebBaruah, Eric Zhou, Mackenzie Smith, Joy Cheng, Angela Hao, Jasmine Wongphatarakul, Edward Ng, Daniel Kao, Erin Kwon, and Cheryl Wu.

* The BoldInk app will be deployed so soon.

Default Image Hover Image