Mobile App Design

VeloCity - for public transport in SA.

Mobile App Design

VeloCity - for public transport in SA.

Mobile App Design

VeloCity - for public transport in SA.

UX Research

UX Design

Design System

Visual & Interaction Design

Designed for

Designed for

Designed for

Conceptual Project

Conceptual Project

Conceptual Project

Overview

Overview

Overview

South Africa's public transport system plays a pivotal role in connecting citizens & facilitating the movement of goods and services across the country.


This app allows daily users and tourists to sign up for a membership card, access and recharge their virtual card, and plan their journey using the public transport system.

South Africa's public transport system plays a pivotal role in connecting citizens & facilitating the movement of goods and services across the country.


This app allows daily users and tourists to sign up for a membership card, access and recharge their virtual card, and plan their journey using the public transport system.

South Africa's public transport system plays a pivotal role in connecting citizens & facilitating the movement of goods and services across the country.


This app allows daily users and tourists to sign up for a membership card, access and recharge their virtual card, and plan their journey using the public transport system.

Role & Duration

Role & Duration

Role & Duration

Product Designer

Product Designer

Product Designer

Personal Project

Personal Project

Personal Project

Feb - March 2024

Feb - March 2024

Feb - March 2024

Design Brief

Design Brief

Design Brief

Navigating public transport routes is challenging, especially for tourists and infrequent users.

Design a user-friendly app that allows users to sign up for membership, manage virtual cards, access route information, and plan journeys, streamlining public transport usage.

Navigating public transport routes is challenging, especially for tourists and infrequent users.

Design a user-friendly app that allows users to sign up for membership, manage virtual cards, access route information, and plan journeys, streamlining public transport usage.

Navigating public transport routes is challenging, especially for tourists and infrequent users.

Design a user-friendly app that allows users to sign up for membership, manage virtual cards, access route information, and plan journeys, streamlining public transport usage.

The Process

The Process

The Process

Defining the scope

Defining the scope

Defining the scope

Allow daily users or tourists to sign up for a new membership card.

Allow daily users or tourists to sign up for a new membership card.

Allow daily users or tourists to sign up for a new membership card.

Enable users to access and recharge their virtual card within the app.

Enable users to access and recharge their virtual card within the app.

Enable users to access and recharge their virtual card within the app.

Include a section where users can view public transport routes.

Include a section where users can view public transport routes.

Include a section where users can view public transport routes.

Provide a feature for users to plan their journeys with the public transport system.

Provide a feature for users to plan their journeys with the public transport system.

Provide a feature for users to plan their journeys with the public transport system.

product research

product research

product research

I began this project by studying the current public transport system in South Africa. All of my research materials were gathered from the internet, relying primarily on secondary sources such as articles, blogs, and videos. I focused on identifying gaps in basic needs as well as "good-to-have" features.


Additionally, I examined existing public transport apps, which provided valuable insights into how the system actually operates.

I began this project by studying the current public transport system in South Africa. All of my research materials were gathered from the internet, relying primarily on secondary sources such as articles, blogs, and videos. I focused on identifying gaps in basic needs as well as "good-to-have" features.


Additionally, I examined existing public transport apps, which provided valuable insights into how the system actually operates.

I began this project by studying the current public transport system in South Africa. All of my research materials were gathered from the internet, relying primarily on secondary sources such as articles, blogs, and videos. I focused on identifying gaps in basic needs as well as "good-to-have" features.


Additionally, I examined existing public transport apps, which provided valuable insights into how the system actually operates.

Understanding the users

Understanding the users

Understanding the users

Throughout my research and analysis of the South African public transport system and its applications, I constantly contemplated the identity of the user—who faces the problem, what their actions are, and why they encounter these issues in the first place.


This led me to identify two generalized types of users.

Throughout my research and analysis of the South African public transport system and its applications, I constantly contemplated the identity of the user—who faces the problem, what their actions are, and why they encounter these issues in the first place.


This led me to identify two generalized types of users.

Throughout my research and analysis of the South African public transport system and its applications, I constantly contemplated the identity of the user—who faces the problem, what their actions are, and why they encounter these issues in the first place.


This led me to identify two generalized types of users.

Analysing & Ideating

Analysing & Ideating

Analysing & Ideating

After completing the market and product research, along with understanding the users, I brainstormed several ideas to incorporate into the app, with a focus on solving user problems and making features accessible to everyone.


This was followed by a quick competitor analysis, which helped validate my ideas and guided me in the right direction feature-wise.

After completing the market and product research, along with understanding the users, I brainstormed several ideas to incorporate into the app, with a focus on solving user problems and making features accessible to everyone.


This was followed by a quick competitor analysis, which helped validate my ideas and guided me in the right direction feature-wise.

After completing the market and product research, along with understanding the users, I brainstormed several ideas to incorporate into the app, with a focus on solving user problems and making features accessible to everyone.


This was followed by a quick competitor analysis, which helped validate my ideas and guided me in the right direction feature-wise.

Competitor Analysis

Competitor Analysis

Documenting all of my research and ideation provided a solid foundation for building the user journey map and information architecture, enabling me to move forward with the app design.

Documenting all of my research and ideation provided a solid foundation for building the user journey map and information architecture, enabling me to move forward with the app design.

Documenting all of my research and ideation provided a solid foundation for building the user journey map and information architecture, enabling me to move forward with the app design.

The game plan

The game plan

The game plan

I formulated three key "How Might We" questions to ensure the final design effectively addresses real user needs, is inclusive of all personas, and incorporates a delight factor that makes it stand out.

I formulated three key "How Might We" questions to ensure the final design effectively addresses real user needs, is inclusive of all personas, and incorporates a delight factor that makes it stand out.

I formulated three key "How Might We" questions to ensure the final design effectively addresses real user needs, is inclusive of all personas, and incorporates a delight factor that makes it stand out.

1.

1.

1.

How Might We Optimise the payment experience, offering diverse methods for flexibility, convenience, and a quick, user-friendly virtual card recharge process?

How Might We Optimise the payment experience, offering diverse methods for flexibility, convenience, and a quick, user-friendly virtual card recharge process?

How Might We Optimise the payment experience, offering diverse methods for flexibility, convenience, and a quick, user-friendly virtual card recharge process?

2.

2.

2.

How Might We Improve the route planning feature to provide real-time, accurate information for a more efficient commute?

How Might We Improve the route planning feature to provide real-time, accurate information for a more efficient commute?

How Might We Improve the route planning feature to provide real-time, accurate information for a more efficient commute?

3.

3.

3.

How Might We Leverage technology to enhance the environmental sustainability of public transport, encouraging more users to choose eco-friendly options & contributing to a greener future?

How Might We Leverage technology to enhance the environmental sustainability of public transport, encouraging more users to choose eco-friendly options & contributing to a greener future?

How Might We Leverage technology to enhance the environmental sustainability of public transport, encouraging more users to choose eco-friendly options & contributing to a greener future?

User Journey Map — user emotions & opportunities for improvement

User Journey Map — user emotions & opportunities for improvement

User Journey Map — user emotions & opportunities for improvement

Information Architecture

Information Architecture

Information Architecture

Wireframing

Wireframing

Wireframing

The following wireframes were created through an iterative, rapid design process, keeping the defined "How Might We" questions in mind to address key user needs. I focused on optimizing the payment experience with flexible methods and a quick, user-friendly virtual membership card recharge. The design also enhances route planning with real-time, accurate information for more efficient commutes.

The following wireframes were created through an iterative, rapid design process, keeping the defined "How Might We" questions in mind to address key user needs. I focused on optimizing the payment experience with flexible methods and a quick, user-friendly virtual membership card recharge. The design also enhances route planning with real-time, accurate information for more efficient commutes.

The following wireframes were created through an iterative, rapid design process, keeping the defined "How Might We" questions in mind to address key user needs. I focused on optimizing the payment experience with flexible methods and a quick, user-friendly virtual membership card recharge. The design also enhances route planning with real-time, accurate information for more efficient commutes.

Onboarding

Onboarding

Onboarding

Recharge Membership Card

Recharge Membership Card

Recharge Membership Card

Planning Travel

Planning Travel

Planning Travel

Final Interface Design

Final Interface Design

Final Interface Design

After finalizing the wireframes, I developed the necessary assets for quick, basic branding of the app. This included designing a logo, defining color and font styles, and generating graphics using AI (MidJourney). Once satisfied with the assets, I began working on the high-fidelity designs for the app. This was an iterative process, involving multiple redesigns and feedback from my designer peers.

After finalizing the wireframes, I developed the necessary assets for quick, basic branding of the app. This included designing a logo, defining color and font styles, and generating graphics using AI (MidJourney). Once satisfied with the assets, I began working on the high-fidelity designs for the app. This was an iterative process, involving multiple redesigns and feedback from my designer peers.

After finalizing the wireframes, I developed the necessary assets for quick, basic branding of the app. This included designing a logo, defining color and font styles, and generating graphics using AI (MidJourney). Once satisfied with the assets, I began working on the high-fidelity designs for the app. This was an iterative process, involving multiple redesigns and feedback from my designer peers.

High Fidelity Designs

High Fidelity Designs

High Fidelity Designs

Getting Started

Getting Started

Getting Started

Create/Add Membership Card

Adding Money

Adding Money

Adding Money

Home & Planning a Journey

Booking Travel Ticket

Booking Travel Ticket

Booking Travel Ticket

Concluding the project

Concluding the project

Concluding the project

Although this was a conceptual project, I thoroughly enjoyed researching South Africa's public transport system, gaining insights into user perspectives, and designing a solution to improve their daily commutes. I particularly enjoyed studying public transport experiences from around the world. As a working professional who primarily relied on Uber, this project gave me a fresh perspective on the challenges faced by public transport users globally.

Although this was a conceptual project, I thoroughly enjoyed researching South Africa's public transport system, gaining insights into user perspectives, and designing a solution to improve their daily commutes. I particularly enjoyed studying public transport experiences from around the world. As a working professional who primarily relied on Uber, this project gave me a fresh perspective on the challenges faced by public transport users globally.

Although this was a conceptual project, I thoroughly enjoyed researching South Africa's public transport system, gaining insights into user perspectives, and designing a solution to improve their daily commutes. I particularly enjoyed studying public transport experiences from around the world. As a working professional who primarily relied on Uber, this project gave me a fresh perspective on the challenges faced by public transport users globally.

Thank You For Reading

Thank You For Reading

Thank You For Reading

Let’s Connect!

Back To Top

© 2025 | Designed and developed by me with ♡ | All Rights Reserved.

Let’s Connect!

Back To Top

© 2025 | Designed and developed by me with ♡ | All Rights Reserved.

Let’s Connect!

Back To Top

© 2025 | Designed and developed by me with ♡ | All Rights Reserved.