Client:
SiSTEM
When:
May 2023 (Oct 2024 update)
SiSTEM is a platform which connects women in STEM to opportunities and each other through networking events and online spaces.
Summary: Designing a new website for SISTEM with the aim to consolidate organisational social assets and enhance engagement within the women in STEM community.
Outcomes: Defined pain points and user needs, developed information architecture, conducted a content audit, and established a consistent design system for the entire website. Delivered a high-fidelity, iterated prototype.
Problem to solve:
SiSTEM does not have a space for their community to keep up with them and be involved. At the moment, all of their communication is scattered on different social media platforms
Brief:
To build a website which brings together the organisation social media assets and increases engagement.
“SiSTEM is feminine, fresh and minimal”
- SiSTEM Branding guide
Research:
We did market research through a competitive audit into peer organisation targeted at young women such as such vogue.com and cosmopolitan.com to compare the user experience of each company’s website.
We held stakeholder interviews with the founders to understand their vision and aims. We also spoke to three subscribers of the SISTEM newsletter.
The research revealed that successful commerce websites have user-friendly navigation and intuitive design. Users shared that they enjoyed the newsletter but wanted to be connected to SISTEM in different ways.
Sitemap and wireframe:
Since this was a new website for SiSTEM, the first step was to plan the structure of the site and understand which pages were crucial for users and how they are connected.
We shared the site map and a low-fidelity wireframe with the stakeholders in a show & tell ceremony early on in the project.
Design system:
Design systems are crucial for consistent design and as part of this project, we used the company branding to create a design system including colours, fonts tone of voice and style of media.
We also created the more technical aspects of design including buttons, forms and page layouts.
Prototypes:
We used Figma to create:
a high-fidelity prototype of the whole site including landing and sub pages
an intuitive journey through the website for users
