Three animated circles representing a loading indicator. The middle circle remains stationary, while the left circle moves toward the middle, and the right circle moves away. Then, the right circle returns to the middle, and the left circle moves outward, creating a smooth, looping motion.

Healthy cities

Data-driven visualization of the world’s healthiest cities

An analysis conducted in 2022 examined global cities to determine where a well-rounded, healthy lifestyle is most accessible. Cities were evaluated across various metrics—including obesity levels, pollution rates, and access to green spaces—each weighted and combined into a total score out of 100. The infographic presents this data in an interactive, engaging format, allowing users to explore and compare different cities visually.

Role

Information Designer

Timeline

3 days

Tools

python, Figma, adobe illustrator

Problem

How might we transform complex health and lifestyle data into an intuitive and engaging visual experience?

Outcome

Created an interactive infographic that distills complex datasets into an easy-to-digest, visually engaging experience.

Exploring data in Python

I began by cleaning and analyzing health and lifestyle data using Python, structuring raw datasets to identify key trends. This step ensured accuracy and consistency before visualization.

Before

AFter

Vectorizing city maps

Each city’s geographical data was vectorized manually in Illustrator, ensuring clarity and precision in mapping urban landscapes and comparing health-related infrastructure.

Defining visual system

I established a consistent typographic hierarchy and colour scheme, optimizing readability while maintaining a visually engaging experience. Accessibility was prioritized through high-contrast colours and clear data groupings.

Defining visual system

Prototyping an interactive dashboard

Using Figma, I designed and prototyped a dashboard-style infographic, incorporating interactive elements like filters and animations to allow users to explore the data dynamically.

Prototyping an interactive dashboard

Using Figma, I designed and prototyped a dashboard-style infographic, incorporating interactive elements like filters and animations to allow users to explore the data dynamically.

Next steps

Expand the dataset to include more cities for a broader global comparison.
Implement interactive filters to let users customize their exploration based on personal priorities (e.g., best cities for air quality, fitness opportunities, or healthcare access).
Optimize for mobile responsiveness to enhance usability across devices.

Next steps

Expand the dataset to include more cities for a broader global comparison.

Implement interactive filters to let users customize their exploration based on personal priorities (e.g., best cities for air quality, fitness opportunities, or healthcare access).
Optimize for mobile responsiveness to enhance usability across devices.