TVO Media Education Group
TVO Media Education Group
TVO Media Education Group
Creating flexible donation portals
Creating flexible donation portals
Improving the monitization strategies for gathering donations
The Task: Create a modernized digital donation strategy and payment portal
The Client: TVO
My Role: UX Designer and Researcher
Skills involved: user research, usability testing, affinity diagram, customer journey mapping, interaction design, prototyping, wireframing
Tools: Figma, Adobe Suite (XD), Miro
Timeline: 4 months
In my role, I analyzed the challenges and limitations of TVO's donation platforms
and contributed to designing an elegant, flexible solution that adapts to new
campaigns, brands and strategies.
In my role, I analyzed the challenges and limitations of TVO's donation platforms
and contributed to designing an elegant, flexible solution that adapts to new
campaigns, brands and strategies.
In my role, I analyzed the challenges and limitations of TVO's donation platforms and contributed to designing an elegant, flexible solution that adapts to new campaigns, brands and strategies.
TVO is evolving into a digital-first media platform that transcends traditional broadcasting by offering educational content through diverse voices, connecting Ontario to the wider world. It serves as a comprehensive educational resource, aiding children's learning, supporting teens in high school completion, and keeping adults informed on global and local issues.
TVO is evolving into a digital-first media platform that transcends traditional broadcasting by offering educational content through diverse voices, connecting Ontario to the wider world. It serves as a comprehensive educational resource, aiding children's learning, supporting teens in high school completion, and keeping adults informed on global and local issues.
TVO is evolving into a digital-first media platform that transcends traditional broadcasting by offering educational content through diverse voices, connecting Ontario to the wider world. It serves as a comprehensive educational resource, aiding children's learning, supporting teens in high school completion, and keeping adults informed on global and local issues.
The value proposition should be clearly embodied in our digital platforms to not
only communicate our message but also provide users with a tangible experience
through the interfaces we host, encouraging them to donate.
The value proposition should be clearly embodied in our digital platforms to not
only communicate our message but also provide users with a tangible experience
through the interfaces we host, encouraging them to donate.
The value proposition should be clearly embodied in our digital platforms to not only communicate our message but also provide users with a tangible experience through the interfaces we host, encouraging them to donate.
As TVO has grown, the organization has evolved to become more of a tech driven organization that is innovative and user centric. many of their systems were in need of updating to solidify this ethos
As TVO has grown, the organization has evolved to become more of a tech driven organization that is innovative and user centric. many of their systems were in need of updating to solidify this ethos
As TVO has grown, the organization has evolved to become more of a tech driven organization that is innovative and user centric. many of their systems were in need of updating to solidify this ethos
Yes, I want to support indepth
journalism & documentaries
$30
$25
$20
Custom
$15
$10
$5
Donate
Monthly
Annually
One-Time
Donate Now
Donate
In my research, I found that transparency and clear information on the allocation of donations were crucial, yet dedicated campaign pages were absent.
I advocated for the creation of landing pages to provide donors with clearer insights into how their contributions are used.
The current donation forms were generic, cluttered and hard to manage in the backend.
For users, this often meant designs were broken on responsible devices.
Simply put, the design needed a systems rethink
Not only was the design inconsistant on multiple breakpoints, the steps to create the forms were becoming harder to manage by the Philanthropy team. many naming conventions and styles were living in multiple places, creating more work for people
The current donation forms were generic, cluttered and hard to manage in the backend. For users, this often meant designs were broken on responsible devices.
Simply put, the design needed a systems rethink
Not only was the design inconsistant on multiple breakpoints, the steps to create the forms were becoming harder to manage by the Philanthropy team. many naming conventions and styles were living in multiple places, creating more work for people
HTML
Design
Brand
Logic
HTML
Before
Form
Form
Design
Logic
Brand
After
HTML
Form
Design
Logic
Brand
In my research, I found that transparency and clear information on the allocation of
donations were crucial, yet dedicated campaign pages were absent.
I advocated for the creation of landing pages to provide donors with clearer insights
into how their contributions are used.
Donate Now
Donate
Yes, I want to support indepth journalism & documentaries
Monthly
Annually
One-Time
$30
$25
$20
Custom
$15
$10
$5
Donate
Forms are fluid, easy to understand, accessible and reduce information overload
With a consistant system in place, the styling could now be easily changed since many of these assets are within
the form settings themselves and not a page wrapper. This means styles are less prone to html/css breakage from editors copying and pasting code.
Donation widgets shouldn't just live in a form, they should help guide you to donate,
and helping to reduce friction between consideration to becoming a donor
Figuring out new ways to drive conversion, I designed multiple widgets that could ask a donation from the user faster
while making the experience subtle in a way, that doesn't annoy or detract the user with excessive animations but would guide them as they learn more about the campaign and organization
HTML
HTML
Before
After
Form
Form
Design
Design
Logic
Logic
Brand
Brand
The steps to build a payment form were ambiguous and complex and I helped simplify
and create a integrated system that harmonizes the fragmented backend process
In my research, I found that transparency and clear information on the allocation of donations were crucial, yet dedicated campaign pages were absent.
As mentioned previously, there were many different forms scattered around and visual designs that did not consider the time or abilities of editors to update them. The systems were complex but I was able to understand and create a work flow that used many of the underutilized features and tools, already available. The steps were reduced considerably and editors could now manage edit their forms, with only a few clicks and updates.
I advocated for the creation of landing pages to provide donors with clearer insights into how their contributions are used.
Forms are fluid, easy to understand, accessible and reduce information overload
The steps to build a payment form were ambiguous and complex and I helped simplify and create a integrated system that harmonizes the fragmented backend process
With a consistant system in place, the styling could now be easily changed since many of these assets are within
the form settings themselves and not a page wrapper. This means styles are less prone to html/css breakage from editors copying and pasting code.
As mentioned previously, there were many different forms scattered around and visual designs that did not consider the time or abilities of editors to update them. The systems were complex but I was able to understand and create a work flow that used many of the underutilized features and tools, already available. The steps were reduced considerably and editors could now manage edit their forms, with only a few clicks and updates.
Forms are fluid, easy to understand, accessible and reduce information overload
With a consistant system in place, the styling could now be easily changed since many of these assets are within
the form settings themselves and not a page wrapper. This means styles are less prone to html/css breakage from editors copying and pasting code.
Want to learn more?
Lets talk
Results
HTML
Design
Brand
Logic
HTML
Before
Form
Form
Design
Logic
Brand
After
HTML
Form
Design
Logic
Brand
Donation widgets shouldn't just live in a form, they should be in customized widget, reducing friction between consideration to completion of donations
Figuring out new ways to drive conversion, I designed multiple widgets that could ask a donation from the user faster while making the experience subtle in a way, that doesn't annoy or detract the user with excessive animations but would guide them as they learn more about the campaign and organization
Payment forms were changed with a reduction of over 90% in the time it takes to
design and create a new form.
Marked improvements also show improved engagement with more personalized
messaging and style, without excess complexity.
Payment forms were changed with a reduction of over 90% in the time it takes to
design and create a new form.
Marked improvements also show improved engagement with more personalized
messaging and style, without excess complexity.
My work resulted in a systems redesign on how forms are designs and managed. There were many features unutilized such as security categories that i was able to uncover, resulting in a easier workflow to craft more targeted donation campaigns
Donate Now
Donate
Yes, I want to support indepth journalism & documentaries
Monthly
Annually
One-Time
$30
$25
$20
Custom
$15
$10
$5
Donate
After my departure from TVO, landing pages were implemented, such as the TVO
Telethon campaign, that helped the organization reach $150,000 in new donations
Donation widgets shouldn't just live in a form, they should be in customized widget, reducing friction between consideration to completion of donations
TVO utilized multiple calls to action across social media, television, and the web, directing users to the Telethon page via links and QR codes. This approach effectively showcased TVO's unique value to Ontarians on a straightforward and engaging page. The integration of widgets accelerated the donation process, and my redesign of the payment forms enhanced adaptability and resolved previous styling issues. These improvements also increased transparency and security, building trust among both new and returning donors.
Figuring out new ways to drive conversion, I designed multiple widgets that could ask a donation from the user faster while making the experience subtle in a way, that doesn't annoy or detract the user with excessive animations but would guide them as they learn more about the campaign and organization
Want to learn more? Lets talk
Results
The current donation forms were generic, cluttered and hard to manage in the backend. For users, this often meant designs were broken on responsible devices.
Simply put, the design needed a systems rethink
Not only was the design inconsistant on multiple breakpoints, the steps to create the forms were becoming harder to manage by the Philanthropy team. many naming conventions and styles were living in multiple places, creating more work for people
In my research, I found that transparency and clear information on the allocation of
donations were crucial, yet dedicated campaign pages were absent.
I advocated for the creation of landing pages to provide donors with clearer insights into how their contributions are used.
Donate Now
Donate
Yes, I want to support indepth journalism & documentaries
Monthly
Annually
One-Time
$30
$25
$20
Custom
$15
$10
$5
Donate
Donation widgets shouldn't just live in a form, they should be in customized widget,
reducing friction between consideration to completion of donations
Figuring out new ways to drive conversion, I designed multiple widgets that could ask a donation from the user faster
while making the experience subtle in a way, that doesn't annoy or detract the user with excessive animations but would guide them as they learn more about the campaign and organization
HTML
HTML
Before
After
Form
Form
Design
Design
Logic
Logic
Brand
Brand
The steps to build a payment form were ambiguous and complex and I helped simplify
and create a integrated system that harmonizes the fragmented backend process
As mentioned previously, there were many different forms scattered around and visual designs that did not consider the time or abilities of editors to update them. The systems were complex but I was able to understand and create a work flow that used many of the underutilized features and tools, already available. The steps were reduced considerably and editors could now manage edit their forms, with only a few clicks and updates.
Forms are fluid, easy to understand, accessible and reduce information overload
With a consistant system in place, the styling could now be easily changed since many of these assets are within
the form settings themselves and not a page wrapper. This means styles are less prone to html/css breakage from editors copying and pasting code.
Results
Payment forms were changed with a reduction of over 90% in the time it takes to
design and create a new form.
Marked improvements also show improved engagement with more personalized
messaging and style, without excess complexity.
My work resulted in a systems redesign on how forms are designs and managed. There were many features unutilized such as security categories that i was able to uncover, resulting in a easier workflow to craft more targeted donation campaigns
this value proposition needed to be reflected in their digital platforms to incentivize
users to donate beyond a message but experienced in the platforms and interfaces
we host.
Since 2017, there has been a pressing need to enhance our digital offerings to attract young, informed millennials. The onset of COVID-19 intensified this urgency. Additionally, we aimed to engage marginalized groups and share more stories from an Ontario perspective to drive our success.
this value proposition needed to be reflected in their digital platforms to incentivize
users to donate beyond a message but experienced in the platforms and interfaces
we host.
Since 2017, there has been a pressing need to enhance our digital offerings to attract young, informed millennials. The onset of COVID-19 intensified this urgency. Additionally, we aimed to engage marginalized groups and share more stories from an Ontario perspective to drive our success.
Want to learn more? Lets talk
After my departure from TVO, landing pages were implemented, such as the TVO
Telethon campaign, that helped the organization reach $150,000 in new donations
TVO utilized multiple calls to action across social media, television, and the web, directing users to the Telethon page via links and QR codes. This approach effectively showcased TVO's unique value to Ontarians on a straightforward and engaging page. The integration of widgets accelerated the donation process, and my redesign of the payment forms enhanced adaptability and resolved previous styling issues. These improvements also increased transparency and security, building trust among both new and returning donors.
Payment forms were changed with a reduction of over 90% in the time it takes to design and create a new form.
Marked improvements also show improved engagement with more personalized messaging and style, without excess complexity.
My work resulted in a systems redesign on how forms are designs and managed. There were many features unutilized such as security categories that i was able to uncover, resulting in a easier workflow to craft more targeted donation campaigns
Results
After my departure from TVO, landing pages were implemented, such as the TVO
Telethon campaign, that helped the organization reach $150,000 in new donations
TVO utilized multiple calls to action across social media, television, and the web, directing users to the Telethon page via links and QR codes. This approach effectively showcased TVO's unique value to Ontarians on a straightforward and engaging page. The integration of widgets accelerated the donation process, and my redesign of the payment forms enhanced adaptability and resolved previous styling issues. These improvements also increased transparency and security, building trust among both new and returning donors.
In my research, transparency and information about where there donations were
going are super important, facilitating the need to create landing pages to give
people better clarity of where their money goes
Since 2017, there has been a pressing need to enhance our digital offerings to attract young, informed millennials. The onset of COVID-19 intensified this urgency. Additionally, we aimed to engage marginalized groups and share more stories from an Ontario perspective to drive our success.