Urban Futures

Experimental urban design card game

ResearchWeb DesignUIUX DesignInteraction Design
Timeline:April 2022 - November 2022Role:UIUX Design & Interaction DesignIndustry:Game Design · Web Application · MobileCollaborators:Fabulous Urban & Heinrich Boll Stiftung Foundation, Lagos

Hero image — Urban Futures card game box mockup

16/9 — awaiting final asset

Overview

Urban Futures is a gamified urban planning tool developed as part of the Fair Shared City Approach — an exploratory research method focused on collaborative solutions to community challenges. As part of the 1st Urban Lab project in Lagos, the goal was to introduce a playful "breaking the ice" process that actively involves women from low-income communities in urban decision-making.

My Contribution

Led end-to-end UIUX & interaction design across physical and digital phases

Designed paper wireframes and card archetypes for the physical game

Conducted virtual beta testing and iterated based on feedback

Designed hi-fi web app and mobile app including motion design and character rigging

Created sitemap and user flow for the digital version

Developed persona research to define the digital product's target audience

The Challenge

"How might we engage women from diverse backgrounds in the spatial planning and decision-making process of their cities?"

Exclusion of Women in Urban Governance

Women make up a significant portion of urban residents and play vital roles in informal systems (water, food, energy access), yet are systematically excluded from planning and decision-making. Urban environments are predominantly designed by men, for men.

Lack of Participatory Planning

Traditional planning processes are top-down, with minimal or no community input. Decisions are often made by distant policymakers and professionals disconnected from local realities.

Limited Capacity for Implementation

While innovative plans may be developed, there is often a lack of institutional capacity, funding, and political will to implement them effectively.

Research Framework

Researchers from the University of Lagos Department of Urban and Regional Planning and NGO activists used the Fair Shared City framework and the 3Rs — Recognition, Redistribution, and Resilience — to interview women of all ages in low-income communities in Oworonshoki, Lagos.

Fair Shared City framework matrix showing Core Values (Accessibility, Affordability, Co-governance) and Focus Areas (Social Justice, Spatial Justice, Environmental Justice, Digital Equity)

16/7 — awaiting final asset

Phase 01

Physical Design

Why Gamification?

🎓

Foster Education

Teach urban planning fundamentals, priority-setting, and stakeholder collaboration through hands-on play.

🤝

Build Collaboration

Foster genuine dialogue and teamwork across diverse community groups who may never otherwise meet.

💡

Inspire Innovation

Encourage locally grounded, practical, creative solutions to real urban challenges.

Designing the Card System

The game consists of 5 card types. Guiding principles were established for each and tested for usability and clarity.

Challenge Cards

Real-life urban challenges — flooding, water scarcity, food insecurity — grounding every round in lived experience.

Role Cards

Assigned roles (community leader, urban planner, funder) so participants view challenges from multiple perspectives.

Idea Cards

Prompts for brainstorming innovative solutions — structured enough to guide, open enough to spark creativity.

Stakeholder Cards

External actors (NGOs, government agencies, private organisations) simulating real-world collaboration and negotiation.

Fund Cards

A resource allocation layer requiring participants to work within budget constraints — mirroring actual planning trade-offs.

Paper wireframe sketches of all 5 card types

16/9 — awaiting final asset

Virtual Beta Test

Screenshot of virtual beta test session on video call with research team

16/9 — awaiting final asset

A beta-test was conducted with the research team to gather feedback and refine the game. Instructions were rated as direct and navigation as intuitive.

Community Launch — Oworonshoki

Photos from paper prototype community launch in Oworonshoki, Lagos — participants playing card game at tables with moderators

16/9 — awaiting final asset

The prototype was launched in the community with moderators assigned to each group to explain the game and support participants who could not read. The session was a major success.

Feedback & Impact

90%

Participant attendance

Over 30 women from different parts of Oworonshoki participated in the first urban lab, many meeting each other for the first time.

90%

Satisfaction rate

Participants rated the card game 'Very good' and 'Excellent' and were excited to engage with the team and each other.

5

Working proposals generated

Solutions addressed real, lived challenges. Proposals covered Water, Food, Mobility, Energy and Housing.

Phase 02

Digital Design

Based on the success of the physical game, a digital version was developed to explore urbanisation challenges across developing countries — serving as an educational game for urban design students, NGOs, human rights activists, and design professionals globally.

Target Audience

Roles

  • Urban design students
  • Urban Design Professionals
  • NGOs
  • Human rights activists

Demographics

  • Women
  • Age 13+
  • High school certificate and above
  • Students, civil servants, creatives

Sitemap & User Flow

High-level sitemap — Landing Page → Lobby → Game Room → Team Room → Win/Loss with card selection nodes (Title, Role, Idea, Stakeholder, Fund cards)

16/7 — awaiting final asset

I planned a high-level sitemap to determine the user flow of the game — detailed enough to iterate on, yet simple enough to communicate to stakeholders.

Web App Wireframes

Low-fidelity wireframes for web app: Landing page, Lobby (card selection), Game Room, Team Room, Win/Loss screen

16/9 — awaiting final asset

Mobile App Wireframes

Mobile wireframe flow: Splash screen → Main Menu → Onboarding → Card Reserve → Title Card → Players → Role Description → Leaderboard

9/16 — awaiting final asset

High-Fidelity Web Design

High-fidelity web app — purple/green palette, illustrated characters, landing page with 'Start Game' CTA, city selection, lobby screens

16/9 — awaiting final asset

I worked on the web design, motion design, and character rigging — creating illustrated characters inspired by real community members and leaders in Lagos.

Mobile High-Fidelity

High-fidelity mobile screens: Splash screens (Urban Resilience, Sustainable Design), Onboarding, City Selection, Pick a Role, Card Reserve, Water Scarcity challenge screen, Team Room chat, Player profile

9/16 — awaiting final asset

What I Learned

"Designing for low-literacy users taught me that clarity is not just visual — it is structural. Every card, every interaction had to work without assumptions about reading ability."

"Gamification is a powerful equalizer. Giving women the language and format of a 'game' removed the intimidation of formal governance processes and unlocked genuine participation."

"The transition from physical to digital forced me to think carefully about what makes a tactile experience translate to a screen — especially for mobile-first users in the Global South."

"Community testing is irreplaceable. Watching real participants navigate the prototype in Oworonshoki revealed gaps no desk research could have uncovered."

Next Project

HireMe

Growth strategy, product development, and multi-channel marketing for an early-career job network — 1,000 to 350,000 DAU.

View case study