have your say

UI/UX,Information,Web Design,Systems,Research.
24 Weeks.
External research & documentation,
Figma.

get involved.

Have Your Say is my undergrad thesis, my final project before graduating from the York-Sheridan Program in Design.

It is the result of 24 weeks' worth of research and design, and includes 3 lengthy reports, one expansive Figma prototype, and a handful of supporting promotional materials.

Have Your Say is a proof-of-concept, easy-to-use web platform that aggregates new developments, projects, community consultations, and engagement resources in the City of Toronto — making it easier for residents to inform themselves and voice their opinions about the changes being made to their neighbourhood.

The project hopes to address and break down the barriers that prevent many Torontonians from participating in civic engagement, growing and diversifying the pool of informed residents.

Want a short overview? View the below slide deck (on mobile? click here), or demo the Figma prototype further down the page.

Please note that this page is still being worked on - bugs/accessibility issues will be addressed, and additional images will be uploaded soon.

research

Have Your Say began as a research project for my undergrad thesis class, design workshop. There, I developed and progressed through a handful of research questions, from:

"In considering local public policy and international precedent, what role can design play in de-prioritizing cars and creating walkable, liveable spaces in Toronto streets?"

to:

"How can I educate and engage local residents throughout the process of redesigning streets into walkable, livable spaces in their neighbourhoods?”

to, finally:

"How can we better involve local residents when redeveloping these urban spaces, and what barriers to Torontonians face when they want to learn and voice their opinions?"

A few weeks of research resulted in a comprehensive 38-page literature review, a 26-page research report, and a 27-page project proposal, covering urban design tools, procedures, and potential directions for Have Your Say.

Through this research, I learned about urban policy and design tools that planners use to dissuade car usage and prioritize pedestrians, while also learning about the community engagement and consultation processes implemented as these spaces change. The process was my first long-term foray into larger-scale research, and enabled me to better understand urban planning history and jargon.

By first immersing myself in urban planning tools and academia, I was ultimately in a better position to design a product that could accommodate the current system, and connect it to the experiences of Toronto's residents. So, as I moved onto the design phase, I had a better sense of which pieces of information to prioritize over others.

For access to the complete research report, literature review, or initial project proposal, please get in touch!

the problem & project proposal

From my research, I found that, in its current state, online engagement in Toronto is largely inaccessible. Background context, information, meeting records, consultation sessions and more are all difficult and time-consuming to find online.

The problem stems from two factors:

First, municipal and provincial governments had already begun moving consultation to an online-first approach — with the COVID-19 pandemic moving the process entirely online.

Second, today's online-first engagement is scattered and unorganized. Finding key details about a new development, construction project, or initiative is time-consuming and requires a significant amount of technical know-how. Depending on who owns or manages the project, users may be directed through dozens of webpages, emails and documents, all scattered across different government databases.

Furthermore, online engagement typically caters to the 9-to-5, often upper-middle class demographic, with virtual meetings occuring on weeknights and requiring a high-speed internet connection. The result: the barrier to entry for community consultation is higher than it should be.

So, as the pandemic moved all consultation online, I hoped my project could make the engagement process more approachable and user-friendly. My proof-of-concept web aggregator would bring together all online resources and engagement opportunities into one place, helping Torontonians navigate and voice their opinions on the changes being made to their neighbourhoods — cutting through dozens of webpages currently required to be properly informed and engaged.


developing the project

Having completed the research and project proposal, I began designing Have Your Say. With ethics approval, I reached out to an urban planner, students at UofT and TMU, and two recent immigrants to help develop the project's scope and features. This collaborative approach let me design with Torontonians, rather than for them, and create a project that better reflected their needs. I also worked with my classmates and professor in weekly critiques to improve Have Your Say's design and features.

Developing Have Your Say involved significant planning and prep, including creating project timelines, scheduling meetings with my collaborators, and plotting site maps. I also had to figure out what features would be included beyond "an aggregator." With a target audience as broad as "residents of Toronto," my site map and list of features had to accommodate new features and information that I couldn't predict.

As ideation progressed, I settled on three guiding themes for the project — explore, discover, and learn (more on this later). Basically, the way users navigate Toronto's developments should be just as flexible and modular as the information itself — and the ways in which residents act on their interests. Further, Have Your Say would need to be flexible in its userflow, making it as useful as possible for both newcomers and activists. If I'm wanting to save residents time and effort, that should apply to everyone.

'Explore' would function as a search engine, interactive map, and curated list all-in-one, depending on how the user wants to interact with the site — letting them approach consultation at their own pace and comfort level. So, newcomers who might not know where to start could click on trending developments, while returning users could search for a specific project or review their follow list.

'Discover' works with 'Explore,' by using a flexible database and design system. So, users can find developments ranging from new condominiums, to garbage collection, to elected officials, to transit lines, and more. Given the potentially wide range of users and interests, the information available should reflect that need.

'Learn' works with 'Discover,' by providing flexible ways to stay up-to-date, learn about urban planning processes, as well as the community around you. Following a given project will send the user regular newsletter-style updates, with the ability to be updated via text and email — so users aren't forced to return to the site.

So, I included supporting resources to help residents understand Toronto's engagement processes. Short tutorials, definitions, and summaries would accompany the database, making it easier for new users to understand where and how they can get involved.

the prototype

The prototype for Have Your Say was created over the course of 2 months. The user-testing led to the creation of additional features, like a low-bandwidth mode, more accessibility options, and the ability to save information offline. Though traditional user scenarios weren't created for Have Your Say, I made sure to prototype at least one scenario for each potential user interaction.

The Figma prototype allows you to: search for predetermined terms & projects; explore trending projects; view trending topics (e.g. road maintenance); follow projects; demo the low-data mode; explore the interactive map; read tutorials; and more.

The visual system began as a test from the mid-fidelity wireframes, though eventually became the basis for my final prototype. As with the low-bandwidth mode, the visuals came from a need to be as accommodating as possible. A large barrier to citizen engagement in Toronto is a lack of tech literacy, and so I tried to avoid a lot of contemporary UI features (e.g. icons-only, hover-based interactions, etc).

View below for the full Figma prototype, or click here (prototype doesn't load on mobile).


discover, explore, learn

From the home page, users can approach consultation at their own pace, following 3 general steps: discover, explore, and learn.

'Explore' would function as a search engine, interactive map, and curated list all-in-one, depending on how the user wants to interact with the site — letting them approach consultation at their own pace and comfort level. So, newcomers who might not know where to start could click on trending developments, while returning users could search for a specific project or review their follow list.

'Discover' works with 'Explore,' by using a flexible database and design system. So, users can find developments ranging from new condominiums, to garbage collection, to elected officials, to transit lines, and more. Given the potentially wide range of users and interests, the information available should reflect that need.

'Learn' works with 'Discover,' by providing flexible ways to stay up-to-date, learn about urban planning processes, as well as the community around you. Following a given project will send the user regular newsletter-style updates, with the ability to be updated via text and email — so users aren't forced to return to the site. This step also includes short article-style tutorials explaining various urban planning practices, Toronto's legally-mandated consultation processes and more. Again, the more residents understand about the changes being made to their communities, the better equipped they are to meaningfully contribute to consultation.

the card system

Throughout the project's development, one key constant was the need to create a modular design system. Given Have Your Say aggregates potentially hundreds of different projects — each with their own unique pieces of information — I had to design a platform that could accommodate content I can't plan for.

The card system enables this modular structure, with a number of responsive layouts, both visually and for content. It houses any piece of information, from a project timeline, to a neighbourhood's history, to a politician's biography.

Cards are split into sections: pinned at the top of each card is a summary of the project or development, including photos, contact information & management structure, and overview of current activity ('what's happening now?'), as well as any opportunities for consultation. From there, content is divided into sections based on the card's topic — which can re-arrange or swap in and out depending on available information. Any card can be added to a user's follow list.

Visually, the card is structured around 3 'views,' with two smaller 'overview cards,' so the user can get key information without viewing the entire project — though users can still follow projects and get contact details from these condensed views.

Scattered throughout the cards are small '?' boxes, indicating an article or short tutorial explaining a relevant urban planning process or term.

engage

Have Your Say's ultimate goal is civic engagement, helping residents translate new information to meaningful action at town halls, feedback forms, and outreach. With this in mind, each step of the userflow prioritizes opportunities to engage with governments and private developers.

Information cards will always highlight ways to get engaged, no matter where you are on the site. Condensed versions of cards still highlight contact information, while full-screen cards link to feedback forms, town halls, and more.

By following a card, project, or person, a user continues to receive updates on activity that they find important. These updates always note upcoming meetings, live feedback forms, and external links to project pages or contact emails.

'Learn' also includes the consultations themselves, alongside supporting documents and external links — from feedback forms to Zoom links to town hall summaries. Basically, if a user wants to engage beyond Have Your Say, I can provide the correct links and resources.

Engagement isn't just limited to live meetings, forms, or emails. Some residents might prefer engagement through organizations or direct communication with their elected officials. So, alongside projects and initiatives, Have Your Say features information cards for electoral ridings, neighbourhoods and more. Within are local neighbourhood organizations, local representatives, community centres and more to help residents find a space in which they're comfortable.

did I miss anything?

Additional features and standards are baked into Have Your Say, like responsive layouts, dark mode, and a low-bandwidth mode for users with unreliable internet. Again, with the goal to reach residents that currently don't participate in community consultation, providing flexibility in how people physically use the site is important. With that in mind, options to save and print content offline is made available for all cards and articles. The site also meets accessibility standards for colour contrast and readability.

If I missed anything, let me know!
Lucas Postlethwaite | Lucas Posty | 2022.