---

Context

Advocating for progressives in the Philippine midterms

This was a key election. May 13, 2019 would mark the midterm of President Rodrigo Duterte—with it, key senatorial, party list, and local positions contested. Progressive candidates with limited funds for on-the-ground campaigning were easily lagging behind in polls and surveys. To many Filipinos, the election is inexpendable: it's a matter of life or death. To argue otherwise is privileged and ignorant of longstanding institutions that propagate hardship in our communities.

In the months preceding the election, I began brainstorming on how might we propel voter education to the masses. I kickstarted an ambitious project: to level the political playing field and empower voters with modern tools. I was thinking closely about social media: 76 million social media users (71% penetration) in the Philippines.

Who were Filipinos betting on? From senatorial candidate surveys, a majority of candidates from the slate of 12 had low visibility or awareness. Voters didn't even know who their choices were!

Political surveys and media were buzzing with conversation in the weeks and months preceding the May elections.

With an idea brewing from my observations of the electoral race, I sought to learn more about how the electorate thinks.

Surveys

A selection of questions we asked in candidate surveys

---

Proto-Personas

While continuing inquiry, we developed proto-personas to guide us through the headspace of our target audiences. We assumed that existing supporters would seek to spread awareness, and undecided voters would seek information.

---

Auditing the Voter Education Landscape

To better understand where voters go to, we looked into common sources reported to be used by the electorate and what was available in them.

Understanding the landscape coupled with points from our voters helped us scope out gaps in today's resources. This is a prettified summary of others in the landscape: we kept up a sheet of competitors, loves, dislikes, and any contacts we had at their spaces.

Focusing on progressive candidates

Getting a sense of the digital electoral landscape and voter profile helped us realize something key: progressive, left-leaning candidates did not have social presences.

In its inception, the vision for Iboto.ph was to be a database for all candidates, but we learned that this may not be the right angle. Instead of being an all-around platform, the team decided to publish pages solely for progressive candidates to specifically forward and act as a unique network collating these candidates together. They frequently have smaller campaign teams and budgets compared to other candidates. We wanted to drive our efforts into upholding them as opposed to having mixed content. Supporters and dissenters alike could use our page to inform them directly of these candidates and the work we believe they're doing well and right.
This decision would then pave the usage we would imagine for the tool, as well as how we would position and distribute ourselves.

---

In clarifying and synthesizing these problems, we identified issues, insights, and opportunities in the electoral landscape directly preceeding the 2019 midterms.

Understanding these major gaps and opportunities set the groundwork; it was time to build.

Driving political discourse

We then worked to build a digital means for Filipino voters to be informed of progressive candidates, driving political discourse. Initially, we started out with a website. Iboto.ph then heavily used social media to disseminate information and engage with voters, with a website as a primary tool.

How might we educate voters about progressives in the dominant space for political discussion?

Our key assumption while building: voters are looking to actively learn, and have changeable minds. Our marketing and language would then target demographics of active, online users who were still undecided in their voting slate or receptive to change.

---

Journey Mapping

Next, our goal was to put ourselves in the place of the Filipino voter. We clarified intentions and desired through a journey map, guided by our developing personas.

Understanding these actions and the nuances in user needs and considerations helped us move forward.

Next, we look into what medium would be best; bolded ones are what we pursued in this campaign.

---

Inquiry

Elections for the online Filipino

From similar sites (largely news websites), we wanted to establish a sense of identity that mixed formal elements with progressive, loud, and bold symbols.

Ethical Design—I guided my team's flow by sharing ethical design principles as we built for a majority market. Focusing on human rights: reducing inequality to access to information, then easing human effort: respecting functional, convenient, and reliable designs, and then creating for a delightful experience were key to our process.

Other readings were Jesse Weaver's "It's Time for Digital Products to Start Empowering Us" and Davey Alba's writing on the weaponization of social media by the Duterte administration.

Identity

Iboto.ph means "to vote" in Tagalog. We used desaturated national colors, intentional low-bandwidth and default fonts (Roboto/Roboto Mono and Times New Roman), and duotone images dithered and rendered as JPEGs (letting lossiness be part of the visual choice) to keep things low-data, yet high-impact.

Low Data
Using dithered images that exist on a two-tone color palette (leading to 10x less resource intensiveness without compromising the ability to link candidates to image) and system fonts (here, Roboto and Times New Roman are sampled), Iboto.ph is designed to be relatively low-data and quick to load for mobile users in the Philippines.

National Brand
we needed a strong, consistent identity that made it clear we were here to politically engage. Our palette uses accent colors (and a main red) borrowed from the Philippine flag. These components and mateiral were reused throughout the project.

Product Explorations

Guided mainly by our uncovered touchpoints, we explored what resources and tools we could build for Iboto.ph.

Value sharing—After getting a better sense of actual use cases, we understood that from now on—the point of expansion was to convert, and engage people with candidates who hold aligned values. Recall, we constrained our selection from our initial goal of displaying voter information for all, making an intentional choice to serve more overlooked candidates with shared values.

Iboto.ph Journey

The ideal path for interfacing Iboto.ph looks something like this.

Synthesis

After we determined key offerings and gaps for voters, we revolved our work around some synthesized points.

• Engage through social media, but educate deeper. Discovery and discourse was clearly funneled in through social media, but people sourced for truth elsewhere.
• Empowerment is key. Every voter wants to feel like they're doing the right thing for the country. Every voter, despite their initial choices, deserves to be given the best suite of tools to help them decide—and even influence. Our philosophy was to resource knowledge to underrepresented candidates to spark discussion.
• People are ready to engage. Hundreds of respondents and dozens of interviewees mentioned desire to actively engage: be it sharing a piece of content or sparking discussion. This helped us know that we could prompt our users and they would generate their own discussions—we were facilitators not only in education, but in dissemination too.
• To raise awareness, raise stances. This was a non-negotiable we found to many voters.

Iboto.ph Objectives

After clarifying objectives and principles, we focused on the following:

Because we were operating independently and were focused on engagement to our website and reach, this might look different the more our platform evolves.

---

Process Overview

Managing the Iboto.ph team

Scattered all over the world and with time constraints ticking and constantly mitigating our potential impact and influence, we had to act quickly. I ended up wearing many hats as a director of th project (PM, basically), designer, and front-end developer.

Phase One: Recruitment and Definition

• Building the team
  I started recruiting members from Developh to help with design and engineering, and from friends in political action organizations; quickly onboarding them to the current status of the product.
• Scoping out the problem
  With new teammates, we clustered our insights and observations to develop the product's rollout plan and refine our solutions. We did a lot of reprioritization as we gained insights that changed our reactions to how our ideal audiences might interact with Iboto.ph
• Building campaign connections and content
  Reaching out to campaign organizers and existing efforts, our team internally started archiving and curating primary and secondary content for us to build up from. Relationships with senatoriable campaigns drived our product's development as we worked to see how we could complement their efforts.

Phase Two: Empathy and Design

• Positioning the product with design
  We began to set up Iboto.ph's pages, ran different iterations of our brand to gauge initial responses, and began solidifying design and marketing templates.
• Establishing a workflow
  As we got to work, we skipped over 'representations' and focused on building things as close to ready for production as possible. Components, website looks... were coded and refined there, speeding up development and shipping.
• Iteration and feedback cycle
  After the MVP of the product was ready, we established communication loops with partner organizations, organizers, and more to get as much feedback as possible on content and layout; mass-shared to friends; garnered anonymous and peer feedback, and more that gave us a constant stream of specific improvements and changes to our product on different levels

---

Designing candidate screens

Building the Iboto.ph Voter Education Site

Our draft for organizing the information hierarchy on the page

To present information effectively, we opted for a website with infographic-like displays highlighting information on our backed candidates.
On first glance, viewers would be able to see candidate stances on critical and timely issues — from lowering the minimum age of criminal responsibility to divorce. Each point would link the user to a relevant article or claim about the chosen information.

We iterated through various layouts and information displays through card sorting and usability tests. From research, we focused on empowering users with information, and highlighting key leanings, deprioritizing meritocratic spaces like education.

We set up individual pages for each senatoriable, and used these as gateways to other candidates with adjacent politics. Later on, we expanded with some simple tools: such as a tool to find candidates with politics you were aligned with based on key issues.

Candidate Page
Collating candidate stances was a challenge to standardize, procuring information in general another. Our architecture shifted based on feedback and data

Key Metrics

We look at time spent on page (the best guess we could have at information digested), clicks to other candidates (are people looking at more of these progerssives that we picked?), and outbound clicks in the "get involved" section (were they potentially finding ways to engage on a deeper level?).

Selecting candidates

With a tight timeline, we published pages one-by-one, allowing us to stagger promotions and work more effectively. We looked at election updates and coordinated with campaign teams.

---

Mobile version of the website, with share buttons and hamburger menu

Candidate Quiz

Designing a view alignment quiz to present candidates. Hacky things: randomly presenting candidates that meet a match threshold, and building these pages manually. Gathering news articles where materials where the news articles were referenced to give context to statements.

---

---

Designing across platforms

Reaching the (social) masses

From here, we focused on extending the platform: creating downloadable posters, PDFs, text-based information sheets, and more to funnel users to our website.

Tracking Iboto.ph Facebook public shares, we noticed usage of our candidate infographics as starting points for discussion, users sharing our links, and the like.

Key metrics
varied per platform, but we valued shares with additional comments/context added on (comments/shares, with captions) and clickthrough-rate to the main Iboto.ph website. Discovery, be it through Iboto.ph's site or socials, were of prime importance to fill in the awareness gap.

---

---

---

Launching a journalism arm

Iboto.ph evolved into a space not only for awareness, but one for activism and exchange. We created a Medium blog, filled in voters via Messenger/Facebook Lite, and continued delivering information from different campaigns to our followers. Entries were written by our team and other one-time contributors, many being students and youth aged 18–30.

---

Building a line of action

In our three weeks of refinement, we moved closer to building marketing campaigns that would lead users to our website or directly to more information and action with candidates they're eager to support or learn more about—as reflected in our intentional move towards design-driven promotional efforts.

---

Results & Reach

A redefined goal
With the time constraints and limited resources, we knew that we couldn't make any decisive impact — instead, our edge was in discussion and in connecting people to candidates that they believed in, showing them that there was still hope for the electorate.

How can we make Filipinos aware of candidates that line up with their values?

Additionally, we were reaching more than just registered voters. We were reaching activists, teenagers preparing to excercise their constitutional rights, and bringing people into the parties of these candidates.

Challenges
The language, presentation, and marketing we would deploy across our social platforms would dictate the initial user attitude to the website. We wanted the candidate pages to be as neutral as possible, serving to inform—this design decision made us put more weight into marketing and methods of dissemination, as well as focusing more on research and information. This was supported by our analytics.

---

---

Next Steps

Transforming the digital space in political contexts

Through Iboto.ph, we were astounded not only by the traction and numbers we hit, but by the engagement of the platform. The internet is a tool not maximally used by Philippine candidates: this project we came up with in only three weeks, sometimes doing the barebones work of comprehensively talking about a candidate's platforms, set us up to realize how much more work could be done in the space.

• Building engagement
  What's the next step after engagement? We saw lots of users taking steps to volunteer or take action—a key focus area for our next iterations.
• Localization for accessibility and language
  We're deployed in a country that speaks over 150 languages. English may be an official language, but we're looking to offer localized versions like our competitors. For now, we focused on key points, concise language, and visual indicators.
• Nudging users to act
  We're looking more intensively on how to bridge the gap between awareness and action, increasing direct action conversions.
• Combatting disinformation
  A successful space we explored was on-the-spot reporting and journalism: from vote counts to illegal campaigning and fallacious statements. People are always online, and we know they need to be in the know. We're exploring how an update stream can increase engagement while offering another realm of political education.

---

Insights

Conversation as progress

Iboto.ph evolved as a product far beyond our initial product: we wanted to initially build a website that displayed information about each and every candidate. We made an early decision to focus on progressive candidates that then set a new opportunity area: conversation and communication—one that wouldn't have risen in its original form.

The next Philippine elections are happening in 2022. The team behind Iboto.ph is thinking of how to further transform the digital space for education, awareness, and discussion as we did with Iboto.ph.

• Design for untapped desires—finding gaps in voter opinion and using Iboto.ph as a platform to advocate for our candidate slate led to our success. We furthered Iboto.ph's social presence as users moved to use our tools to carry conversations over, and empowered users with our suite of tools.
• Neutrality is not an option—designing to reach those who could change their viewpoints and spread the word to support our candidates was priority—tech is never neutral.

There's value in engaging with the principles that voters believe in, and using those as grounds to understand, listen, and respond effectively. Fighting categorization and labeling through engagement was key, and we're looking forward to more spaces that encourage discussions like this.