03 — Project

FunFactory

E-commerce Web Design · UI/UX · Frontend

A full web design project for a sustainable toy webshop. From the first wireframe to the final product. Every screen. Every state. Start to finish.

Figma HTML/CSS/JS

✓ Full design process — wireframes to final product

FunFactory Final Product
Role
Solo Designer & Developer
Tools
Figma · HTML · CSS · JS
Type
School Project
Year
2024

The Process

01

Research & Wireframes

I started by mapping out every page in Figma. Low-fidelity wireframes for the homepage, product page, detail page and cart. No colors yet — just structure and flow.

FunFactory Wireframes
02

UI Design in Figma

Once the wireframes were done I moved to Figma. Color palette, typography, buttons, cards — all documented in a style guide before writing a single line of code.

FunFactory Style Guide
03

Built it

Translated the Figma design into a working website using HTML, CSS and JavaScript. Every page from the wireframe got built — homepage, product page, detail page and cart.

FunFactory Final Website

The Result

Homepage Product Page Cart Mobile

Want to see more?

← Previous Project Next Project →