Creative Tool / Live tool

Afri Index Flier Studio

After building Afri Index, I kept needing graphics to share its rankings. I wanted a way to make those posts without rebuilding the layout every time a chart moved.

← Back to all work
Social graphics editor · Captured 9 November 2026
Social graphics editor · Captured 9 November 2026 · Open image to inspect

Behind the build

What went into it.

HTMLCSSJavaScripthtml2canvasJSZipResponsive UI

Why it exists

After building Afri Index, I kept needing graphics to share its rankings. I wanted a way to make those posts without rebuilding the layout every time a chart moved.

Design & development

A browser-based studio for chart cards, artist comparisons, tour dates, Top 5 countdowns and upcoming drops. You can edit the content, switch formats and export the result as an image or a carousel.

The difficult part

Making flexible templates that still look intentional when the text and photos change, and keeping the export close to what appears on screen.

What I learned

The preview has to behave like the exported file. I learned to account for long artist names, different image shapes and the space that social formats actually give you.

Where it stands

A live companion tool that turns Afri Index stories into shareable graphics, with a separate source repository and its own editing flow.

Have something in mind?

Let’s make
something useful.

Tell me about your project