top of page
  • Writer's pictureCydney Phan

Rosmi Case Study

Updated: Oct 10, 2019

View the product page

Project Brief:

Prompted to ponder the question: “I’d trust a computer to ___________, but I’d only trust a human to _____________,” in attempts to improve the human experience and decrease the barriers for users to trust, use, and participate with computer interfaces (AI). Our group focused on creating an inclusive and accessible interface while testing our ability to redefine conventionality, design and demonstrate an inclusive digital experience. In our pursuit to create something meaningful, we drove our passions for social responsibility and developed an app that could be of great use to the greater public: Rosmi.

Rosmi promotes sexual health. It functions as a mobile contraception marketplace and informational guide for healthy and safe sex practices. Users looking for options when it comes to contraceptives (e.g. pill, condoms, patch, vaginal ring, etc.) will find the apps marketplace helpful. Rosmi provides regular check-ins for symptoms within the first three to four months of dosage. It also provides users with quick tidbits of information regarding their chosen method of contraception.

Press Release can be found here.

Defining Inclusive Design:

Weeks leading up to the culmination of the final project, the class has been given tasks to explore the different ways of identifying empathy and how to effectively implement understanding into design. We engaged in a various set of empathy exercises to truly understand what it's like to be "different": an actual person with varying perspectives and experiences whom might not fit into what society defines as "normal". From color blind goggles, low vision screens, vertigo testing to exercises in low mobility; we all individually had to go beyond ourselves and re-evaluate the in-accessible designs that's been normalized, reconsider design normativity and challenging ourselves to create better interaction experiences for a large and often marginalized population.

Deliverable Timeline:

A visual timeline of deliverable due dates for the app: Rosmi
A quick glance at the overall design timetable and its expectations.

Who is Rosmi For?

To better understand the wide variety of people that Rosmi could be catered towards, we crafted a persona spectrum inspired by Microsoft's Inclusive Design Guide and familiarized ourselves on how to properly cater to those whom may be divergent and have to rely on external technology to operate a phone (a further look at our empathy exercise can be found here). This persona spectrum is meant to increase our awareness and create an app that would be beneficial to wider audience scope with varying permanent, temporary and situational divergencies.

When imagining the type of user whom would use Rosmi, they would be sexually active and are actively looking for safe ways to learn and engage in sexual health. The projected age range for Rosmi users is rather wide from 16 to 50; this range encompasses the average when it comes to starting and ending hormonal birth control, often coinciding with the age typical of the first menstruation cycle and menopause. We also wanted to focus on creating an inclusive safe space by focusing on the non-binary aspects of gender, negating assumptions and biases within the app functions and establishing un-assuming language usage. Privacy is another big component that went into the conceptualization process of Rosmi, we wanted to cater to individuals whom crave the secrecy and privacy of getting birth control that isn't allotted in traditional prescription methods.

A visual representation to all the different ways Rosmi could be accessible.

Extended persona spectrum detailing how each instance could influence our

app design can be found: here.

Logo Implementations

Originally, we wanted the Rosmi logo to be as gender neutral as possible and tried to achieve this by stylizing the letter "R" in various forms. We ended up landing on an abstract "R" that resembled a palette. However, as we continued exploring the Rosmi mission of healthy sexuality, deriving our imagery from the popular phrase: "the birds and bees", we've found a more symbolic iconography for the Rosmi logo to be more fitting with our overall message.

The new logo encompasses the image of a fruit, our previous abstracted "R" turned upright, and a rather cheeky imagery (it's almost a tad phallic).

Initial Designs

Going into designing Rosmi, our team really tried focusing on what truly was our end goal for Rosmi: having easily accessible resources and providing contraception to the public. By placing the major functions at the top of the screens, we had hoped that they would be always present in all the various app functions– allowing the users to quickly switch from marketplace to information at any point when interaction with Rosmi. The menu icons were chosen to placed along the bottom of the screen to be as close to the interacting finger as possible for reachable mobility. As our team went along with the design process, we realized that having two separate main function interactions became quite confusing and redundant as the user journey and functions of Rosmi were further clarified and fully iterated.

A detailed explanation of our final changes can be found within "Design Feedback".

The sketches below follows our initial interactions to solve the layout of our home page, as well as elements within the match function, purchasing, questionnaire and login process.

Design Feedback

Given the time constraints of this project, we weren't able to completely user test the prototype for functionality. Instead we hosted salon-style testing bursts with other design teams to gather quick but insightful feedback on the app navigation. Our testing sessions would include observing the user's unprompted walkthrough the prototype, followed up by a series of questions regarding the testers' navigation experiences and potential concerns.

1. Resource Page:

Our original prototype had the resource page to look like a quick FAQ style, we have found through the testing sessions that this format was rather confusing. The page resembled too closely to a chat page and would cause some hesitation from the user. We finalized the designs by switching the page to a blog/article style format with clearly labeled resource categories and a quick page function text to allow clear user function.

Phone screen showing the new and old resources page for Rosmi.

2. Profile:

As shown above in the original prototype screen, the design had two tabs: contraceptives and resources running along the top and then a hamburger menu on the bottom. Originally, the main goal was to allow access to the contraceptives and resources page anywhere along the user journey, however as we started creating further screens and revising our user journey map, we realized that there a need for a hamburger menu especially since Rosmi's information architecture is rather streamlined and simple. We also made the profile tab to be more prominent as our testers wanted to have better control of their medical information since Rosmi will be handling some sensitive documents.

Two screens showing the profile page of Rosmi, one screen is the main profile screen while the other is an extended view of a clicked link: Medical History

3. Color Scheme:

To design for color blindness, we originally had a very colorful and dramatic color scheme. As we test this page, we have found that a few users actually experienced some dissonance with the color choice. The bright pops of orange had unintentionally created navigation bias for the users, and they had perceived those orange elements to be more important than others due to the color choice of the icons. We've graduated all color icons to a more calming and neutral blue that still provided enough visual interest and contrast for the those with hard of sight as well as successfully alleviating any issues with colors that arose from our feedbacks.

Phone screen showing the new and old landing page for Rosmi.

Rosmi Walkthrough Vid

Video produced and edited by Marisela Guillen.

Project Retrospective:


I've had the fortune to previously worked with my team members on a separate project, so coming back together, we were able to understand each other's strengths and form a proper mode of communication to fully adapt to the challenges of the Rosmi project. However, despite our natural flow of communication, we still battled with troubles regarding misaligned expectations, and hindered by the limits of technology. During the first round of screen iterations, we decided to create everything in a grayscale as to not waste time on color iterations since that often is a real contention that eats quite a bit of time. Some of the screens were designed in a different style than what was iterated during our group meeting, so we lost a bit of time redesigning a full function sequence in the app. We've had some issues on our previous project with inconsistent screens; we've definitely fixed that problem for our final Rosmi iterations by establishing one member to compile and edit individual files sets into one master file.

There were so many moving parts to this project, there was the interface prototype, a 3-5 minute interaction video, and a presentation that all needed to be finalized within the span of 3 weeks. I was also in limited communication from May 3rd – 6th due to prior engagements, this made it quite difficult for me personally as I wasn't able to contribute as much as I would've liked; it also doesn't help that Adobe products are quite limited in their ability to allow multiple contributions across multiple update versions. Thankfully the rest of the team were able to pick up the hat and produced a beautiful production video.

Positive Outcomes

Being able to design and conceptualize Rosmi felt more like a passion project than a student project. Working on a project that so very closely aligns with my current purpose in life alongside equally passionate designers definitely made the tight deadlines and heavy production times enjoyable and well worth the late nights. Coming into the project, we were all inspired to promote change and meaningful impact with whatever we were to create; so when it came to the conceptualization process, it took us about a week/ two weeks to determine what we wanted for focus on since there were so many messages of social responsibility that we've wanted to convey. After landing upon the goal to promote sexual liberty and health across all spectrums of physical and mental divergents, we really came to together to produce something that we're all immensely proud of.

Valuable Lessons

This wasn't easy; the level of higher thinking and empathy skills that are needed to design for communities, whose struggles I can't even begin to fully fathom, is not heavily stressed enough within the design curriculum. This exercise only showed a small aspect of what it means to be an inclusive and accessibility driven designer, and it definitely provided some practices to incorporate into my UX/UI toolbox for further projects as I become more conscious to the struggles of the divergent community.

76 views0 comments

Recent Posts

See All


bottom of page