Viz Studio · in-browser playground

The grammar that powers every modern viz tool — yours to drag around.

Tableau and Power BI both sit on top of the same idea: map data variables to visual properties — x, y, colour, size — and let the renderer pick the shape. Once that grammar clicks, every chart tool becomes the same tool with different paint. Drop fields onto shelves below to feel it.

Tableau course →Power BI course →Data Viz course →

Viz Studio

Grammar-of-graphics playground

Dimensions

year

month

Measures

deposit

savings

lending

overdraft

Mark

X (columns)(drop anything)

Empty

Y (rows)(measure)

Empty

Colour(dimension)

Empty

Action title — state the claim, don't just label the topic

Drop fields on the shelves above.

Bar / line / area need at least X.

Grammar

Data + Encoding + Mark

Every chart is three things: a dataset, a mapping of fields to channels (x, y, colour, size), and a mark type (bar, line, point). Pick the mapping the claim needs. The chart follows.

Action title

Argue the claim, don't label the topic

Bad: “Bank rates by year.” Good: “Lending rates rose 4 points since 2022.” Type yours into the action-title field above the chart and feel the difference.

Transfer

Same grammar, every tool

Tableau's Marks card, Power BI's visualisations pane, ggplot's aes() function — same concepts, different syntax. Open the “See the grammar” panel under the chart to see the spec.

Try these

Five exercises to feel the grammar

On bank rates: show how lending rates have moved from 2018 to 2025. Pick the right mark and the right field on each shelf. Now write an action title.
On bank rates again: compare deposit, savings, lending, and overdraft rates on the same chart. Hint: you need to bring a colour-able dimension to the colour shelf — but the data is wide, not long. What does that limitation teach you about why “tidy data” matters?
On pension data: visualise the relationship between contribution rate and pension assets. Which mark type fits? Why a scatter?
On M-Pesa data: show transaction volume by year, coloured by region. Try bar, then area, then line. Which one tells the story best?
Cross-tool transfer: after building any of the above, open “See the grammar”. That JSON is the same shape Tableau's Marks card produces internally, the same shape ggplot's aes() function accepts, the same shape Vega-Lite uses to render. You now speak the language of every modern viz tool.

Ready for the next layer? The Tableau course takes the grammar into Tableau's specific implementation — LODs, parameters, dashboard actions. The Power BI course does the same for the Microsoft stack.