How to build a data visualization portfolio in the age of AI

Life expectancy versus GDP per capita, 2022

Wealth and health Regions side by side Ranked within regions How many countries

Richer countries live longer. All 37 countries above $30,000 per person pass 74 years.

You can ask an AI assistant for a chart and get it back in seconds, and an AI coding agent can build a whole interactive visualization from a description. So what should a data visualization portfolio show today, and how should you build it? Here is what I would do.

Why do you need a portfolio?

If you work as a data visualization designer or engineer, as a freelancer or inside a company, a good portfolio is not optional. It is how people see the value you bring.

Data visualization is a branch of information design, so explaining your process and presenting your design choices clearly is part of the job. Platforms like Tableau Public, Behance or Observable say little about the constraints of a project, the problems you had to solve and the way you think. If you move from Power BI to D3.js, your work ends up scattered across several platforms with no single entry point. And most people will not download a notebook from GitHub to read it.

Put everything in one place, on your own website, under your own domain name: your explanations, sketches, wireframes, dataset extracts, images and interactive pieces. Everything can be published on your own site now, interactive charts included, so you don't even need the other platforms.

Where should you start?

Find a niche, and find data you care about and are passionate about.

If you work in a company, you work on the company's data, and most of the time that means sales, marketing and so forth. Your portfolio is the opportunity to show what you like, your own style and your own taste, outside of the company. People will find your voice through it.

My own first data visualization posts were about the Star Wars expanded universe, Pokémon videos on YouTube and the Montreux Jazz Festival archive. The Montreux posts started in 2015, with a map of the festival's artists linked by musical similarity. Four years later I built Jazz Luminaries from the same archive: a fulldome network of 5,400 jazz, blues and Latin artists connected by more than 30,800 links, which became part of EPFL ArtLab.

What changed with AI?

The chart is no longer the hard part

Today an AI agent can clean the data and write the D3.js code for you. A gallery of good-looking charts proves much less than it used to.

The chart below shows life expectancy in 160 countries from 1950 to 2022, drawn like the rings of a tree. A few years ago, a custom interactive chart like this took real front-end work. This one was built with an AI coding agent.

Life expectancy in 160 countries, 1950 to 2022

It rose in 159 of 160 countries, and the median went from 46 to 74 years.

Each ring is a year, from 1950 at the center to 2022 at the edge, and each slice is a country, colored by region. Darker means a shorter life expectancy, on a perceptually uniform scale: lightness rises at an even rate with the years. Dark notches mark crises, such as Cambodia in the late 1970s and Rwanda in 1994. Hover or tap to read a value.

Replay 30 years or less85 years

Taste and truth still matter

For me, the big change is this:

What matters now is less your technical ability and more your ability to create, and to be true to the data.

Being true to the data means knowing where it comes from and what it leaves out, and refusing a beautiful chart that says something the data does not.

You still need the basics. Read the books and learn the theory, because that is how you build the judgment to see when a chart misleads. Here is the same data drawn badly, then fixed one step at a time.

Life expectancy data

Previous Fix it The default chart

1. The defaultLife expectancy in eight countries in 2023, drawn with common habits: a cut axis, rainbow colors with gradients and shadows, a legend, a heavy grid and alphabetical order.
2. Start the axis at zeroWith the axis starting at 50, Japan's bar is almost eight times longer than Nigeria's. The real ratio is about 1.6. Bars have to start at zero.
3. Sort the bars and turn them sidewaysAlphabetical order hides the ranking. Horizontal bars also leave room to read the country names.
4. Use color only when it means somethingRainbow colors are not perceptually uniform: yellow looks brighter than blue, so some bars stand out for no reason, and gradients and shadows blur where a bar ends. Gray keeps the other countries as context, and one color each marks the two countries the story compares.
5. Label the bars directlyWithout the legend and the grid, the reader no longer looks back and forth to read a value.
6. Write the finding in the titleThe reader should know what to look at before reading the chart.

Search engines and AI assistants read your site

Search engines read your website, and so do AI assistants that search the web, such as ChatGPT. Optimizing for them is sometimes called GEO, for generative engine optimization, next to classic SEO.

Both read text. An image of a chart tells them very little, while a paragraph that says what the data is, where it comes from and what you found can be indexed, quoted and linked back to you. Your own domain is the address those links point to, and it stays yours when you change jobs or hosts.

Building your own site got easier

You no longer need to be a front-end developer to build your own site. With a static site generator and an AI coding assistant, you describe the pages you want and review the code it writes. A static site is a folder of plain HTML files, with no database or plugins to keep up to date, so there is little to maintain, and it loads fast, which helps with search. This year I moved my own site from Webflow to a static site built with Eleventy, and I now work on it with AI coding assistants. The charts in this article run on it.

What should go on each project page?

For each project, write a page that answers these questions in plain text:

• What was the question or the brief?
• What data did you use, where did it come from, and what are its limits?
• What did you try first? Sketches and wireframes count.
• Which design choices did you make, and why?
• What was the result?

For Circadian Rhythms, a commission from Polar, the data was more than 2 million biometric data points on sleep, activity and heart rate. The main design choice was the circle: each visualization mirrors the 24-hour clock and the shape of a watch dial, and color, shape length and rhythm show each person's daily pattern. Writing down why you chose a form like this tells a reader how you think.

How would I build one today?

If I had to make a data visualization portfolio from scratch today, this is how I would do it:

1. Buy a domain name with your first and last name, firstnamelastname.com, if it is available. If you change jobs or careers, people will still find you. It costs about 10 euros or dollars a year.
2. Ask an AI coding assistant to set up a static site with a generator such as Eleventy, Hugo or Astro: a home page, an about page and one page per project.
3. Host it on a service for static sites, such as GitHub Pages, Netlify or Cloudflare Pages, and point your domain to it. Make sure people see your own domain, not name.github.io.
4. Write each project page in plain text, following the questions above, and add your images. Publish the interactive versions on the same site, as pages of their own.
5. Give every page a clear title and a one-sentence description, so search engines and AI assistants know what it is about.

Done.

You can see how I present my own projects in Work.