About Project

Hey I’m Afnan

I design products and dig into what makes them work.

Bringing design and data into the same conversation.

Made with intent

A selection of projects where the details really mattered.

SKELEMENTOR

PROJECT 01


Skelementor

I co-founded and built Skelementor, a component library that helps Elementor creators find, organize and reuse ready-made sections.

1,600+ reusable components across 40 categories

Unified design system across Figma and Elementor

Built the platform, app and reusable CSS system


SKELEMENTORCSS

PROJECT 02


SkelementorCSS

A reusable CSS system for Skelementor users that standardizes common styling decisions into scalable classes.

970+ reusable classes in one preset

Built for Elementor V4 and Atomic Elements

Responsive classes for layout, type, spacing & more


ADORBADOR

PROJECT 03


AdorBador

A portfolio designed and developed for filmmaker Shafiuzzaman Ador, giving his films, collaborations and story a proper home on the web.

Structured films into 4 clear categories

Brought client work and personal story together

Dedicated portfolio, client and contact sections


Expertise

Things I do well

Designing, building and making sense of messy problems.

Product Design

If this page feels easy to scan, that’s the point. I spend a lot of time deciding what belongs where.


TOOLS & METHODS

Figma

FigJam

Wireframing

Design Systems

Web Development

I design it, then I build it. This website is one of those cases, so you’re already using the result.


TOOLS & METHODS

WordPress

Elementor

HTML

CSS

JS

Business Analysis

Skelementor taught me to watch what users need, what slows us down & what deserves attention.


TOOLS & METHODS

Excel

Customer Feedback

Market Research

The next chapter

Moved to Auckland, learning the data and decisions behind the products I already know how to design and build.

fig. 01 – Building Skelementor

01

Where I come from

Products, websites, design systems, and Skelementor kept me busy for a few years. That taught me how things get designed and shipped, plus a healthy respect for responsive breakpoints.

– Product & UX design
– Responsive web development
– Business problem solving

02

What got me curious

Building products taught me how to observe user behavior. I wanted to understand what was driving it. That curiosity led me to Auckland and a Master’s in Business Analytics, where I’m now building a foundation in:

– SQL & database fundamentals
– Power BI dashboards
– Business analysis methods
– Research & insights

fig. 02 – Studying in Auckland

fig. 03 – Learning by building

03

What I’m testing now

Theory helps, but things click much faster when I actually build something with what I’ve learned. So most of my learning eventually turns into:

– Hands-on SQL exercises
– Interactive dashboard projects
– Business case studies

04

Where I’m heading

The direction is becoming pretty clear: I want to work where product thinking, business and data come together, helping teams understand what’s happening before deciding what to do next.

– Business Analyst roles
– Product Analyst roles
– Data-informed product decisions

fig. 04 – Next role