50-50 Leadership
Web Design Lead for '50-50 Leadership', an organization dedicated to advancing gender equity in leadership roles for women.
Client Testimonial
Pauline Field, CEO of 50/50 Leadership
Problem Statement and Goals
Enhance the overall usability and accessibility of the website.
Provide clear and compelling calls-to-actions, to guide visitors towards desired actions and to attract donors and sponsors.
Ensure that the website's design, content, and messaging are consistent with the brand's identity and values.
Role and Responsibility
As the Web Design Lead, I was responsible for the redesign of the website, coordinating with the developers and board of directors.
Understand the requirements and problems
Empathize and conduct interviews with the users and the members of the board
Research about similar websites, create brand guidelines, icon design, create wireframes for the website layout,
Conduct usability tests, iterate on designs, create mockups,
Handover final designs to the developers, support during development
Present final screens to the board members and make any ongoing changes to the design
Be an individual contributer and also lead a team of 2 developers, 1 content writer, and a graphic designer
Site Map
We had an initial meeting to understand the reason for redesign and what would be the focus areas so that we could prioritize the elements on the home page. Below is the final information architecture decided after multiple iterations.
Brand Guidelines
The board members were closely associated to the suffragettes flag
Had been associating the colors with their events.
We collaboratively decided to go with the colors of the flag for the website and brand.
The '50-50 Leadership' logo skillfully represents the organization’s name incorporating the primary colors.
I chose the typeface SFF Compact Rounded in the primary color 'Purple' across various weights in order to establish an aesthetically pleasing hierarchy.
Usability Test
Throughout the project, I followed iterative design and incorporated user testing. I developed over 80 distinct screens, each featuring unique designs. The final selection of screens were determined following preference test results and feedback from the users and board members.
A
B
I worked with high school students and included the illustrations created by them on this page, reflecting 50-50 Leadership’s commitment to fostering opportunities and empowering young women in the field.
A
B
C
Mockups
Several mockups were generated to offer a preview of the screen's appearance prior to finalizing the design. I carefully considered the pain points and addressed them through design.
Outcome
After the presentation with the board members, usability testing and multiple iterations on the design, I went ahead and worked with the developers to implement the screens. The 50/50 Leadership board was happy with the final outcome.
The new website
The website's enhanced usability and accessibility led to a 70% increase in overall performance.
This improvement was reflected in Google Analytics data, showing a 25% boost in conversion rates and a 30% decrease in user drop-offs.
Usability testing also revealed a 40% improvement in navigation ease.
Clear and compelling calls-to-action were implemented to guide visitors towards desired actions, attracting more donors and sponsors.
Additionally, the website's design, content, and messaging were aligned with the brand's identity and values to ensure consistency.
Learnings
Words are as important, if not more important, as the design
Brand identity is formed through every decision of the UI element such as the color, icons, shapes and images.
I would definitely invest some time in Market Research and Competition Analysis to understand how other similar companies are working towards the needs of the users and also analyze their strengths and weaknesses.
I would do a deeper User Surveys and interviews with more audience. It would have helped in gaining better insights.
Conduct usability test on the low-fidelity screen as its easier to make the changes in them than in the final screens.
