Designing a Website Widget for VOTO App - a social engagement platform
As a part of the SAIT Applied UX Design Certification, I worked with VOTO, a Calgary-based startup.
The VOTO team approached us to design a new feature—a website widget for their product— to optimise user engagement, improve conversion rates, and build brand trust. This project involved a six-week sprint, during which I led the end-to-end UX design process, from research to prototyping.
Duration :
My Role :
Client :
Prototype :
Team :
6 weeks
User Research | User Persona | Journey Mapping | Ideation | Wireframing | Usability Testing | Prototyping
Product Manager - 2
Product Marketer - 1
UX Designer - 1
Client
​​VOTO is a social engagement platform connecting businesses and customers through philanthropic campaigns. These campaigns, hosted on VOTO’s web app, incentivize users (referred to as “Homies”) with micro-donations on behalf of participating businesses (“Innovators”) when they finish a survey.
​
Brief
While the current campaigns on the Voto Website get a conversion rate of 36%, they fail to help the innovator convert those users into customers.​ VOTO sought to introduce a website widget that could integrate seamlessly into Innovators' websites, allowing Homies to engage with campaigns without leaving the Innovators' ecosystem.
Solution & Impact
100% of users
found the widget easy and intuitive to use
> 60%
expressed a likelihood to engage with the widget​
> 80%
said they trusted the business and motivated to buy from them
Research
To ensure the widget effectively engaged Homies, I conducted research with 26 survey respondents, focusing on:
1.
How people engage with businesses that do social good
2.
If and what makes them excited about micro-donations
3.
What they need when engaging with businesses that do good
How often do you engage with or respond to calls to action from organizations?
They could be surveys, votes, etc.
What motivates you to engage with these calls to action?
What do you feel about a company making a micro-donation on your behalf when engage with their campaigns?
What factors would make you more inclined to participate in a survey that results in a micro-donation?
Key Findings
1.
Users Value Social Impact and Transparency
They engage more with businesses that clearly communicate their mission and the tangible outcomes of their campaigns.
2.
Users Prefer Brands Aligned with Their Values
A demonstrated commitment to social good enhances trust and participation.
3.
Users Avoid Unclear, Distrustful, and Intrusive Practices
Lack of transparency in donation handling and intrusive data collection deter engagement
These insights informed the creation of our primary persona, Hannah, a socially conscious user seeking meaningful engagement and transparent impact from brands.
​
Let's meet Hannah - the Homie!
Hannah needs a way to engage with businesses meaningfully and impactfully.
Hannah needs to know and trust the impact they are making by engaging with businesses.
How Might We engage Hannah in an opportunity to contribute to social good while ensuring trust ?
How Might We show Hannah the tangible impact of her participation?
To address Hannah's need for trust and transparency in engaging with socially responsible businesses, I facilitated a productive brainstorming session with my team. By sharing a clear agenda beforehand, we aligned expectations and identified essential widget features while incorporating marketing and business perspectives to ensure alignment between user and business goals.
Business Goals
To increase conversion
Inviting and Clear CTA on the widget
To increase engagement
Show progress bar throughout the survey and other CTAs to keep the users engaged
Being able to share on social media platforms - turn the user into an evangelist
User Goals
To engage meaningfully so that she can trust
Charity info and logo throughout to build transparency and legitimacy
To trust the impact she is making by engaging
UX Copy that reinforces she engaged in something good after the campaign is completed
Include a short video in the end that talks about the impact
Design
I got down to sketching the ideas and we shared a few wireframes with the clients.
​
I also decided on a mobile-first approach since most of the campaign traffic comes from mobile social media platforms.
Scenario/Use Case
Good Trade Coffee Company has partnered with VOTO to run a campaign for their Holiday Special for which they want to collect data from their website visitors via a survey. Good Trade already has social initiatives and thus like to run campaigns with VOTO.
Hannah, who gets a gift package from a friend which contains a Good Trade Coffee packet. She loves their Fair Trade mission and wants to see their website. On their website, she now sees a VOTO Widget.
Usability Testing
I did a round of Usability Testing with 6 participants - four were unmoderated via Userbrain, and two were moderated via Zoom.
​
I prepared a Usability Testing Script and also a SUS survey.
100% users found the widget easy and intuitive to use based on their experience
More than 60% said they were most likely to engage and finish the survey
80% of users agreed that they trusted the business and wanted to buy from them
Prototype
VOTO mascot : gets attention + establishes brand identity & recognition
Tells Hannah there are other people who have contributed
Charity details with logo to build trust & transparency from the start
Status bar to keep Hannah hooked to the survey
Survey questions and other CTAs
To reduce drop-offs
prompts like these emphasize the impact of her potential donation, encouraging her to come back and continue to make a difference.
Messaging that reinforces she engaged in something good with a short video
Nudging Hannah to talk about the campaign
Auto-generated caption with an invite link, campaign details and an image
Next Steps
With only 6 weeks, we had a limited scope to present our solution which was well-received by the Voto team. Some of my suggestions for the next steps going forward with this product -
1.
Usability Testing for specific UI components like the progress bar - There could be a lot to add value with more research and more information
2.
A/B test the social media post to maximise its share-ability and achieve more word-of-mouth
3.
I would also focus on establishing data points - like No. of clicks, No. of CTAs completed and Drop-offs - to measure the widget's success over time and iterate.
​​4.
Explore more ways to engage with the survey and other actions - make it conversational, maybe? ​
Takeaways & Learnings
1.
Throughout the project I learned the importance of effective communication between team members and stakeholders​
2.
I learned to synthesize complex research insights into clear problem statements and user persona which helped me empathise with both the users and understand the problem
3.
Regularly evaluating the effectiveness of different design options and incorporating feedback during user testing also strengthened my ability to think critically and make informed design decisions - helping me learn to be adaptable and flexible
