Sitara Akka’s
Website Redesign Project.
My role
Lead Website Designer
Duration
Oct '21 - Mar '22
Impact 1 year after launch
4X
Watch Hours on YouTube
5X
Subscribers
Project Overview
The Client
Sitara is an Ed Tech non-profit with the aim of bringing accessible education to students from underserved communities in Karnataka, India.
Sitara needed to revamp their website in 2022 in order to present their work to stakeholders that are vital to their growth and outreach. I took on this 6 month redesign project to deliver mobile and website UIs, while leading a team of 6, consisting of content writers, designers and developers.
Deliverables & Handoff
-
User Research - Interviews &
-
Workshop Facilitation - Visual Strategy
-
UI Design & Prototype
-
Design Handoff
Problem Statement
The existing website does not effectively communicate the work and impact that Sitara Akka brings to underserved communities in Karnataka, India.
Users and Audience
Sitara’s primary audience are students. This website however, targets government schools, grants and potential donors and volunteers.
Scope
-
Redesigning the website to reflect the work of Sitara.
-
Understanding the goals and motivations of volunteers and donors.
Constraints
-
No budget or operations support for research.
-
Part-time work with college caused delays.
-
A full functional prototype of the website. (me)
-
UI Components(me) & Illustrations(graphic designer + me).
-
Written Copies (Sitara team).
Testimonial
"...getting Samarth on board was the best decision we made." - Co Founder, Sitara
"When we decided to redesign our website, getting Samarth on board was the best decision we made. His goal was not just to deliver a beautifully designed website, but also to truly convey the core of what Sitara really is, and he left no leaf unturned. The depth he went into to understand each user type and the the meticulous effort he put in really made me appreciate Samarth for the professionalism he showed, despite still being in college. Ever since we've launched, we've had so many individuals compliment our website, and one even asked if Samarth could redo their website too!"
Process
Discovery Phase
Why do we need a redesign?
To understand why Sitara needed a new website, I conducted a design audit of their existing website.
Mapping Problems & Opportunities: A UX Strategy Session
Interviews
5 interviews with potential donors.
1. Visibility of where their money goes.
2. Credibility of previous work - what is the impact?
3. The contribution must align with the values of their organisations.
Donor Persona
Volunteer Persona
Card Sorting
Laying out the blue prints of Website 2.0
I facilitated an Online Card Sorting exercise with 8 stakeholders of Sitara.
The results of the Card Sort led me to build a three level Sitemap.
UI Design
Branding
To sell the story and impact of Sitara, it was important to have a compelling brand that reflects the values of the org. The team wanted to focus on Transparency, Boldness and Fun while volunteering, creating positive impact.
I wrote a design brief for the Graphic Designer to help me create illustrations, collages and ideate on typographic hierarchy with me.
Design Brief
To redesign the Sitara Akka website to better represent the work, goals, values and impact of the organisation, which would facilitate applications by new volunteers, donations from potential investors and partnerships with other organisations.
Simultaneously, I worked on wireframing the pages of the website, to bring to life the final design.
Results
Impact
How did this help Sitara?
-
The website was launched in March 2022 and has served as a transparent source of information for stakeholders to know who they are getting involved with. With their support, Sitara has gained 4 times as many subscribers on their YouTube with nearly 5 times the number of watch hours.
-
An online portfolio provides credibility to partners. A professional portfolio has represented Sitara while they looked to partner with other organisations for better reach.
Reflections
What would I have done better?
-
Documenting a scalable design system.
-
Validation through user testing.
Background
Sitara Akka(formerly Project Sitara Foundation) is an organisation working towards bringing inclusive and accessible education to children from underserved communities in India.
I was a volunteer at Sitara as a Teacher's Instruction Kit writer when I was asked to lead the website redesign project!
My Contributions
-
Led the full website redesign process.
-
Studied competitor organisations' website to understand how they capture their values.
-
Conducted interviews and a focus group with donors and volunteers respectively.
-
Designed UI Components and wireframes that were ready for dev handoff.
Impact
1) Information Source for potential donors and volunteers.
The website was launched in March 2022 and has served as a transparent source of information for stakeholders to know who they are getting involved with.
With their support, Sitara has gained 4 times as many subscribers on their YouTube with nearly 5 times the number of watch hours.
2) An online portfolio provides credibility to partners.
A professional portfolio has represented Sitara while they looked to partner with other organisations for better reach.
Sitara Akka now works with 120 schools across 14 states. (before the website, they operated within Karnataka and Tamil Nadu states.)
The website has helped Sitara in 2 main ways -
Hear from the founder!
"When we decided to redesign our website, getting Samarth on board was the best decision we made. His goal was not just to deliver a beautifully designed website, but also to truly convey the core of what Sitara really is, and he left no leaf unturned. The depth he went into to understand each user type and the the meticulous effort he put in really made me appreciate Samarth for the professionalism he showed, despite still being in college. Ever since we've launched, we've had so many individuals compliment our website, and one even asked if Samarth could redo their website too!"
Shriya Shankar
Co-founder, Sitara Akka
Why Redesign?
What was the old website like?
Sitara Akka's website needed a redesign because the previous website did not capture the work and values of the organisation. There were also some design decisions which had room for improvement.
Room for improvement in...
-
Information Architecture - Capture the work and values of Sitara better.
-
Cohesive brand language - Set a tone of voice and brand style across the website.
-
Hierarchy in type which is readable and accessible.
-
Consistency in alignment, imagery and iconography.
How do other Indian NGOs do it?
The purpose of the new website is to showcase the work and valus of Sitara Akka to potential donors, partners and volunteers. In order to get a better grasp on how this can be achieved, I studied 8 websites of successful NGOs in India.
Must Haves
-
A well documented "Our Story" section with lots of imagery to depict the work done by the org.
-
Values integrated within the design language.
-
Plenty of testimonials from Students, Volunteers and partners.
Research
The main audience for the website would be the secondary stakeholders visualised in the adjacent Onion Diagram.
-
Potential Donors - Organisations that offer grants, individuals who want to donate to a good cause, and companies that look for CSR opportunities.
-
Potential Volunteers - Sitara needs motivated volunteers (for 3+ months at a time) for various roles supporting education.
-
Potential Partners - Organisations with aligning visions that can stem a mutually beneficial relationship with Sitara.
Who are the stakeholders?
I spoke to 4 stakeholders who were interested in contributing to Sitara's mission. Here's what motivates them to donate -
1. Visibility of where their money goes.
2. Credibility of previous work - what is the impact?
3. The contribution must align with the values of their orgs.
Interviewing Potential Donors & Partners
Leading a focus group of volunteers.
During the focus group, we unveiled the motivations to volunteer and the exact kind of work Sitara does.
Brand Design & UI
Design Brief
To redesign the Sitara Akka website to better represent the work, goals, values and impact of the organisation, which would facilitate applications by new volunteers, donations from potential investors and partnerships with other organisations.
In order to design the website, I built the information architecture based on card sorting activities conducted virtually.
Laying down the blueprints
Next, I sketched out ideas to quickly finalize how the information flow would reach the viewers.
To really capture the impact that Sitara makes, I worked with a Graphic Designer to create a Style guide that reflects the character of the brand that is Sitara.
We paid great attention to the tone of voice, so as to appear bold, motivated and friendly.
Final Deliverables - I created fully functional prototypes for destop and mobile sites, and handed it off to a team of developers.
This was the project for which I first learned Figma's Autolayout!
