Ungdomsmotagningen (UMO) is a Swedish website that targets youth and young adults. One of the most common questions answered on UMO is about menstruation and everything related to it. UMO provides information about the menstrual cycle, contraceptives, the body during menstruation, and much more. The website aims to provide youth and young adults with knowledge about their body and health, which can help them make informed decisions about their sexuality and health.
Background
Designprocess
Moodboards
The design team created two moodboards based on the keywords communicated by the midwives. The website had to be appealing to young people and therefore needed to be playful, easy to navigate, and interactive. Young people today want quick access to information without having to search for it. This was implemented in the design solution in several ways, including presenting previews of information pages on the homepage.
Personas
Personas and scenarios were created to gain a clearer insight into the problem. These were based on the design brief, which stated that young people primarily turn to their parents when they need help.
The primary persona is about Elin, a thirteen-year-old girl who has just gotten her first period. The scenario describes an uncomfortable situation when she tells her parents about her first period. Elin has been unable to find answers to her questions about periods until her classmate shows her the design team's proposed solution. There, Elin can find the answers to her questions and avoid another uncomfortable interaction with her parents.
A secondary persona was created to complement Elin and show a young teenager's relationship with a parent.
Sitemap
At this stage, the design team had a good understanding of the situation and started working on a sitemap as the basis for the prototype. The sitemap would clarify what information should be included in the design solution and where on the page it should be placed. The information was based on approximately 50 keywords identified by the client. These were grouped together by the design team and headings were created to provide a clear structure for the website. The keywords were sorted under different headings in a sitemap, which would later become categories in the final prototype.
Sketching began on paper and then the design team developed the sketches in the tool Figma. Several iterations were created individually by the design team members to get as many perspectives as possible. Between iterations, the sketches were shown to other group members and discussions were held on what could be improved or removed.
The iterations continued and three cycles in, a common prototype was designed and the layout was approved by the client. After we received approval of our low-fidelity prototype, the design team began work on a high-fidelity prototype, where aesthetic aspects are applied. Since the target audience was between **10-15 years old, it was complicated to find a balance between playfulness and credibility. It was important that the design solution was welcoming for all age ranges.
Sketches
Results
In conclusion, the group learned that viewing and interpreting a brief from different perspectives can help designers open their eyes and create innovative designs. It's essential to consider everyone's ideas to create the best possible design when working on a project with a team where everyone has their perspective. One of the biggest challenges the group faced was dealing with the client's criticism, which came quite late in the process. This experience taught them that it's important to listen carefully to the client's feedback and ensure that they meet their requirements, but also to be mindful of the target audience's preferences. It's also vital to be open-minded and consider different perspectives, as this can help them create a better design that meets everyone's needs. Moreover, they learned that applying gamification to a non-gaming area can be challenging, but it can enhance the user experience if done correctly. Designers must consider the target audience's preferences and design interactive features that are engaging and informative. Overall, the project was successful in educating women about their hormone journey and providing them with useful information to make informed decisions about their health.
Role as a programmer
As the programmer responsible for the development of the website, I worked alongside a team of designers and researchers to create a web page that visualizes the hormone journey that women experience throughout their lifetime.
Throughout the design process, I collaborated with the team to ensure that the website was created according to the client's requirements and that it was functional and user-friendly. As a programmer, my main responsibility was to develop the website's code and ensure that it was optimized for a responsive mobile-friendly design.
During the development phase, I faced several challenges, including integrating gamification elements into the website while teaching sensitive information. However, our team was able to overcome these challenges by switching from a leveling system to a quiz that educated women about their hormone journey.
Another challenge we faced was dealing with the client's late feedback, which required us to make significant changes to the website. However, by listening carefully to their requirements and being open-minded, we were able to create a website that met their needs while also considering the target audience's preferences.
Overall, as the programmer responsible for the website's development, I played a vital role in ensuring that the website was functional, user-friendly, and met the client's requirements. Through collaboration with the design and research team, we were able to create a successful website that educated women about their hormone journey and provided them with useful information to make informed decisions about their health.