Website Re-design
Branding
UX Design
Website Re-design
Enhancing donation experience and building strong community for Witness to Mass Incarceration
ROLE
Conducted generative research, including interviews and usability testing. Crafted organisation and design principles. Led the product diagram, and hi-fidelity wireframing.
Conducted generative research, including interviews and usability testing. Crafted organisation and design principles. Led the product diagram, and hi-fidelity wireframing.
TEAM
4 UX/UI Designers
4 UX/UI Designers
TIMELINE
Sep - Dec 2023 (4 Months)
Sep - Dec 2023 (4 Months)
IMPACT
Increase in donations by 20%
Increase in donations by 20%
TOOLS
Figma, FigJam, Google Forms
Figma, FigJam, Google Forms
Overview
WITNESS for Mass Incarceration (WITNESS) is an organization supporting Formerly Incarcerated People (FIP). It is dedicated to transform the lives of FIP by advocating for long-term solutions, fostering economic empowerment, and building generational wealth. We aimed to transform the WITNESS website into a hub that empowers FIP, cultivates community networks, raises awareness, and inspires support and donation. We achieved this by providing a dynamic and engaging online experience.
Some designs before diving into process
Design Process
01 - Exploratory Research
Ecosystem map
We developed an ecosystem map to better understand the relationships between Witness and the main stakeholders and audience.
Technical analysis
We examined the IA and key flows of the current website and identified potential opportunities for improvement.
Competitive audit
To understand what competitors are doing on their websites and generate insights for our design solutions, we evaluated seven websites focusing on seven features: Homepage, Navigation, Information Architecture, Key flows and pages: Donation and About, Visual style and Storytelling.
Literature Review
We conducted surveys to gather insights on existing knowledge in FIPs, designing for non-profit organizations, storytelling from articles, videos, news and blogs.
Interviews & usability testing
During our user testing process, we conducted interviews and gathered feedback from 7 participants: one potential visitor and six FIPs referred by our client.
We wanted to learn about the mental models, behaviors and motivations in the interviews and to understand how users interact with the Witness website and uncover potential issues from the usability testing.
Research Insights
After thorough research, we've consolidated three main insights.
02 - Defining structure
Organization Principles
Design Principles
We also formulate and establish our Design Principles based on research and organizational principles. It includes Trust-building, Inclusive, Efficient, Unified and Engaging.
Design strategies
To bring those principles to life in the actual design process, we made our design strategies. They involve more detailed planning and specify the actions to implement our design principles effectively. They are categorized into three key aspects: Flow, Visual, and Content.
03 - Schematic design
Product diagram
We created a product diagram to understand what role its website plays in its service/product system. We realised that the website has an irreplaceable role of showcasing everything about WITNESS to the public and action taking.
Key workflows
By understanding its key roles, we determined three key user flows that would help WITNESS expand its impact to more people and have more potential to get more traffic.
Information architecture
These flows led to a revised information architecture design. The redesign of information architecture was informed by tree testing with 12 participants.
Hi-fidelity wireframing
With the updated information architecture, we designed mid-fi wireframes and tested them with 8 participants before final delivery.
04 - Evaluative research
Usability testing
We further conducted usability testing with our 7 participants, all FIPs and gathered feedback from our professor and cohortIterations - design decisions
05 - Design development
Visual design
We aimed at keeping the organisation's branding language intact as it was a successful addition to the org. So we modified the usage of the bold reds and the blacks and altered the tones to pass the accessibility contrast.
Final presentation to the client
Interact with the final prototype
Reflections
I gained the skill of delegating responsibilities among team members and prioritizing task completion over perfection.I learned to communicate my design instincts effectively to my teammates, providing clear examples for better understanding.
This project held special significance for me as an LGBTQ+ supporter and a quiet activist. Working with our client, Evie Litwok, a "72-year-old formerly incarcerated jewish lesbian," was motivating. Witnessing her contributions to society was truly inspiring.
