Vitória, Brazil has been ranked in the Top 5 ‘Connected Smart Cities’ in Brazil. Its City Hall wanted to build Minha Vitória, a collaborative platform to share suggestions for Urban Master Planning. This would encourage interactive participation in the development of the city amongst all residents of voting age. The platform would be used to review and regulate the urban aspects of the city for the next ten years, ensuring that, when sending contributions to the city, the population's interest as a whole prevailed over individual or group interests. They hoped to generate essential insights into the improvements of the city.
I worked collaboratively with professionals in Brazil and Portugal as a UX Manager. I led the project as an end-to-end process with daily remote touch-points and contributed as a UX Designer. Being able to occupy close-up and managerial positions at once really enhanced my ideas and made me a great fit for the project.
Understanding Users’ Emotions
Since we had a very heterogeneous target audience of more than 300,000 people, creating discrete personas could form a bias in our research. Instead, we identified people’s feelings about their contributions to the city. We conducted interviews using the Positive Emotional Granularity Cards, which delineate 25 positive emotions a user can have to a product. The cards help end-users report emotional experiences with a high degree of specificity.
Browsing the cards, we discussed which positive emotions would be desirable to evoke on the platform. We settled on three:
1. Desire. Every resident wants to live in a better city. Activities on the platform would need to pique that desire for change.
2. Inspiration. This was about providing new points of view and generating simple, transformative ideas. We believed that inspiration could arise with collaborative participation.
3. Reliance. To make a suggestion requires energy — energy the user won’t expend if they lose confidence in the project.
We needed to inspire and maintain residents’ faith in the platform by making the process completely transparent. On this basis, ease of use and conscious thinking would be our top priorities in UX design.
With stakeholders responsible for different areas of the city, we whittled down our general goals for the platform into specific topics.
We also identified two key pain points. Inhabitants of the city weren’t being encouraged to participate in public decisions because they introduced competing political biases into the process. The topic was broad, technical, and lacked knowledge of the general population. We learned that the engaged population and community leaders were the most frequent participants in face-to-face meetings about the Urban Master Plan. Others tended to refrain from giving suggestions but were happy to raise their hands when they agreed or disagreed.
So, in a meeting with the entire project team, we looked for ideas to make online contribution dynamic.
For the development of the platform, I created an organization chart with all our needs, highlighting comments related to external actions (which depended on technology or the City of Vitória official website).
By simply selecting their city of residence, the user was activated in the system. After selecting their neighborhood, they were allowed to share their ideas. The user had two ways to contribute: sending a suggestion or supporting one or more opinions posted on the platform.
We decided to implement a social media login, so that users could see friends’ publications and their own, and an interactive map, which allowed them to browse suggestions by topic and upvote any they supported.
We chose two registration options for the platform's launch: log in with Facebook (since it is the social network with the most significant number of users in the city) and log in with email.
Sketches & Requirements
We then turned all these requirements into low-fidelity sketches.
At this point, we noted some technical questions and features to be tested in the wireframe, like the dropdown menu and text box for choosing a topic.
We considered things like a minimum number of characters for a suggestion (10) and forwarding suggestions for approval before publication.
Our goal was to create a friendly layout that met all our prerequisites. Unfortunately, Facebook took longer than expected to approve the API and get it working. But this was a useful lesson to learn and something I'd be sure to consider in future.
Building a Prototype
Suggestion: All contributions
Suggestion: Individual contribution
Suggestion: Send a suggestion by topic
Draft legislation: Search and comment
Profile: Personal data and user's neighbourhood
Home and Login: Minha Vitória
Next, we began developing low-fidelity, navigable wireframe to test the functionality with users.
Calls to action like "Contribute" and "Send your suggestion" clarified to the user that their participation was meaningful.
On the “Suggest” screen, the user chose the topic of interest then sent their suggestion, pending administrator approval. Meanwhile, they could browse other ideas using the timeline or map.
On the home page, we defined the social and email login buttons and a menu. Since the subject matter was technically beyond the general knowledge of the average user, we also incorporated frequently asked questions.
Users’ public identification and support and sharing options were also included in the wireframe.
In developing a dashboard, we decided to include KPIs such as topics most covered by a region, subjects most commented on, and primary needs, in the official report.
Design & Final Preparations
Distinct colors differentiated each of the five central topics of the project, allowing the user to identify areas of interest visually in the interactive map.
We planned to integrate with Google Maps to show pins around the city coded by neighbourhood and topic.
We developed the platform’s layout, which used the city as a background, with this in mind.
Suggestion: Users could submit suggestions based on city themes
Dashboard: Suggestions sent by administrative area
Dashboard: Participation volume by topic
Dashboard: Most supported suggestions
Due to the delivery deadline, the team decided to simplify the dashboard so as not to jeopardize the release schedule set by the client.
The platform was fully responsive and customized for viewing on desktops and mobile devices in time for the official launch.
After completing the high-fidelity mockup, we submitted the platform for testing with seven users and uncovered four general pain points. These were amended in version 2.0 of the prototype.
We revised the responsive design to work on older devices, created an email confirmation to track the user journey from registration to suggestion submission, included more questions in the FAQ to help the user understand the platform, and revised the Google Maps API to reduce loading time.
Since so many problems were related to the internet connection, we suggested that the city offer free public WiFi in squares and at landmarks.
Outcomes & Lessons learned
In the first stage of the Urban Master Plan review process, the residents of Vitória made 1,340 suggestions in just 53 days. This was a really wonderful outcome for the city.
Data was collected from the suggestions, analyzed, and compiled into a report. From this, we identified people’s expectations for the next 10 years. It truly was an invaluable insight. After that, 48 proposal regulations were created within the shared management model.
The UX case study has been published in the Observatory of Public Sector Innovation, a European forum based in Paris. OPSI shares outstanding public sector innovation initiatives and works with governments to understand and encourage new approaches to solving complex societal problems, helping them explore new possibilities.
The client had reduced the project timeline by almost half in the middle of development. As is so often the case, the whole project could have been even more successful with more time. Nonetheless, we stripped everything back to the essential requirements and maintained an agile approach to attain success.
Disclaimer: All data disclosed in this case study are publicly accessible and don’t necessarily reflect the views of the company I worked for.
The photo for the case study's composition was taken by Claudia Regina and used only for this purpose.
Positive Emotional Granularity Cards: Yoon, J., Pohlmeyer, A.E., & Desmet, P.M.A. (2015). Delft University of Technology.
Interested to read more about other projects?
2022 © Marcos Rezende's UX Design Portfolio - Ottawa, Ontario. Canada. 🇨🇦