Interfaces & components
Responsive websites and applications, reusable components and API integrations.
What I do / How I thinkFRONTEND ENGINEER, CREATIVE AT HEART.
I design.
I develop.
I add character.
Three perspectives, one way of working: connecting what people see with what they can do.
Find your starting point ↓01 / Frontend developmentI make it work.
Design meets
the real world.
A Figma screen is a starting point. I turn it into an experience that responds, adapts and actually works: with reusable components, clear states and attention to the people who will use it.
React / Next.js / TypeScriptHave a design to develop, a product to build or an interface to improve?
Let’s talk ↗01 / FROM PIXELS TO INTERACTION
Meaningful interactions
Microinteractions, transitions and animation that serve the experience, not the noise.
Quality in the details
Accessibility, state handling, performance and care across desktop and mobile.
02 / Web & product designI give it direction.
Before the pixels,
find the focus.
I start with the problem, the people and the priorities. I design flows and interfaces that make products clearer, then use prototypes to test the decisions. Knowing how things are built keeps my design grounded.
UX/UI / Figma / PrototypingHave an idea to clarify, a website to rethink or a product that should be simpler?
Let’s talk ↗02 / FROM QUESTION TO INTERFACE
Direction & flows
Content structure, user journeys and wireframes before diving into visual details.
UI & prototypes
Responsive screens, clear hierarchy and interactive prototypes to explore the product.
A consistent language
Documented components, typography, colors and states to connect design with development.
03 / Graphic designI make it stand out.
More than a presence.
Make an impression.
Images, color and typography can change the energy of a story. I create compositions and digital content with a distinctive character. Today my selection comes from sport and esports: a starting point, not a boundary.
Composition / Color / TypographyHave an event, an announcement or a story that needs a visual presence?
Let’s talk ↗03 / FROM IMAGE TO IMPACT
Posters & content
Visuals for events, announcements and results, with a hierarchy that puts the message first.
Compositing & retouching
Cutouts, lighting, textures and color grading: from the starting photo to the final visual.
Visual series
Coordinated graphics that preserve a project’s character across different subjects and content.
04 / The connecting threadLESS HANDOFF. MORE CONVERSATION.
Good things
don’t happen by accident.
Not a rigid package, but a shared process. I can own one part of a project or connect design and development, working with you or within your team.
Listen.
Goals, people, context. First, understand what needs to change.
Find focus.
Priorities, structure and direction. Make the decisions visible.
Build.
Design and code in conversation. Prototype, develop, refine the details.
Refine.
Tests, feedback and iterations. The first attempt isn’t the last.
UNDER THE HOODInside my toolkit
03 / The toolkitALWAYS LEARNING ↗
Clear ideas.
The right tools.
A practical overview of the technologies and disciplines I use: from the first Figma frame to the final commit and release.
01 / CORE WEB
HTML
CSS
SCSS
JavaScript
TypeScript
React
Next.js
Vue
02 / UI & STATE
Tailwind CSS
Vanilla Extract
Framer / Motion
TanStack Query
Zustand
Pinia
i18n
Zod
03 / PRODUCT & MOBILE
- React Native
Expo- REST APIs
GraphQL
Firebase- Accessibility
- Technical SEO
04 / CMS & PLATFORMS
Payload CMS- Headless CMS
WordPress
Elementor- No-code tools
05 / QUALITY & WORKFLOW
Git
Cypress
Playwright- Design systems
- Responsive design
06 / DESIGN & CREATIVE
- UI/UX Design
Figma
Adobe Photoshop- Visual identity
- Art direction
07 / AI & SYSTEMS
Claude Code
Codex
Gemini- AI agents
- Automation