WORK, IN CONTEXT.

Most nutrition apps lock users into rigid, pre-set meal plans or force them to log food after the fact. EatyWise flips the narrative: it starts with what the user actually craves. The engine scales ingredient portions and adds complementary elements to hit daily macro goals, giving users a dynamic Macro Match Score and 100% freedom to toggle, swap, or tweak ingredients on the fly.

I designed the end-to-end product architecture, mapped the user flows, created the UI design system, and developed the MVP.

A significant focus was backend architecture prior to launch. The goal was to build a pipeline that is reliable, maintainable, and cost-efficient from day one. Every calculation that can be handled deterministically happens in code with verifiable nutritional data, while AI (Google Gemini) runs strictly at the creative culinary layer to pair ingredients and balance macros. Robust fallbacks guarantee predictability if generation misses.

The result is an edge-first architecture designed for real-time interaction — putting user autonomy and desire at the center without sacrificing nutritional precision.

The current version is live in Open Beta for user validation, prioritizing real-usage feedback over assumptions.

• •End-to-end product design, UX architecture, and Next.js/TypeScript frontend.
• •Craving-first Meal Builder with real-time ingredient toggling and Macro Match scoring.
• •Hybrid backend architecture: deterministic macro calculation layer + targeted AI culinary pairing.
• •Built on Next.js, Supabase, and Vercel for high performance and low latency.
• •Fallback-protected pipeline optimized for reliability and cost-efficiency.

Government websites explain complicated things using complicated language. DollarRelief explains the same information in plain English — with interactive calculators where they help, and quick answers before the long read.

The first version was plain HTML and JavaScript. After an initial AdSense rejection, the whole project was rebuilt on Next.js with an MDX-based content system. That gave the content a proper architecture: reusable article components, interactive blocks, custom calculators and a workflow where writing doesn't require touching React code.

The SEO structure was built intentionally from the start — semantic page hierarchy, sitemap generation, schema markup — but the actual goal is simpler: help people find out what they're eligible for.

The platform continues to grow. New articles and tools are added regularly, and everything is designed so content can scale without the codebase becoming harder to maintain.

Clients want to edit their own content. Developers want to keep writing custom code. Most solutions make you choose one or the other.

Editable Landing Panel connects to an existing Next.js project without changing the development workflow. Content — text, images, prices, buttons, page sections — is stored in Supabase and editable through a minimal client-facing interface. The frontend code stays exactly as the developer wrote it.

The editing logic is fully decoupled from the UI layer. Adding it to a project means wiring up the data layer; nothing else changes.

It's open source and has been deployed in production on a commercial client website. The client has been updating content independently since launch without any developer involvement.

After the Rain is a personal experiment with 3D in the browser. A small garden after rain, with plants you can bend, water you can move and animals you can follow.

I built it with React, TypeScript and Three.js. Tilting a leaf moves the drops on it. Wind, rain and nearby movement change animal behaviour.

The scene includes three experiments: water on a leaf, plant gas exchange and a woodlouse's response to humidity. You can change the conditions and compare results. The models are simplified, with their assumptions and limits documented.

I want to keep developing the science side of the project: use the same scene to explain more biological processes and the equations behind them.

SHARM is a commercial website for a personal styling brand. What started as a landing page became a fuller collaboration — several rounds of refinement, multiple visual directions explored, structure reworked until the brand felt right on screen.

The real work was organising a large amount of content into something that still read cleanly. Every section needed to justify its place without disrupting the visual rhythm.

I was responsible for the website's design implementation, frontend architecture, deployment, technical SEO, analytics integration and the custom content editing panel so the client can update copy independently.

After launch, Vercel became unavailable for the client. The project was migrated to a Russian hosting provider — infrastructure and deployment config only, no changes to the frontend or user experience. The site has been live and in use since.

Elan is a concept fashion e-commerce experience built as a complete shopping flow: catalogue, product pages, cart, checkout, search and editorial articles.

The focus was UI quality and interaction detail. A fashion interface is unforgiving — spacing, transitions and the balance between whitespace and content either feel right or they don't. Most of the time on this project went into getting those decisions right rather than adding more features.

It's a concept, but built with the same level of care, responsiveness and implementation standards as a commercial project.

Noir is a concept landing page exploring cinematic storytelling on the web. Instead of a product catalogue, each section is a layer of a story — revealed through scroll, pacing and motion.

GSAP drives the transitions, but the more interesting work was deciding what to leave still. Too much animation and the atmosphere collapses into noise. The restraint is what makes it feel cinematic rather than just animated.

The experience holds on mobile too — the reduced motion isn't a fallback, it's a version of the same narrative with less movement.

A landing page for a therapist's group program. The brief: introduce the program, explain its structure, guide people toward registration.

The design is intentionally simple — clear hierarchy, no visual noise, easy to follow on any screen. The project was completed and production-ready. It wasn't launched due to technical constraints on the client's side, unrelated to the website.

A landing page for a wellness retreat organiser running programs in Bali. The goal: explain the experience, answer the important questions, make it easy to get in touch.

No animations, no complexity. When the product being sold is rest and clarity, the interface should feel the same way. The design stays out of the way and lets the content do the work.

Helena Inspirante is a personal brand website where every section is its own layout. No repeating blocks, no shared templates — each section was designed and built independently, combining typography, layered visuals and custom compositions.

The complexity came from the layouts. Many sections are built from dozens of individual elements that need to work together across screen sizes. There were no reusable patterns to fall back on — almost every section had its own responsive solution.

A large number of the visual assets were produced using AI tooling as part of the creation workflow, then manually refined, positioned and integrated. The AI output was a starting point. The integration work — cutting, compositing, responsive handling, performance — was all done by hand.

The site is visually heavy but loads fast. That required careful asset optimisation throughout.

A media kit website for a YouTube creator. The idea was simple: replace a static PDF with a proper web page — one that's always current, easy to share and looks professional when a potential partner opens it.

Clean layout, clear numbers, fast load. The site is the channel's official media kit and gets updated as the channel grows.

I came across a Michelin Selected restaurant in Da Nang that had no website. Instead of waiting for a client request, I decided to build one and show what their online presence could look like.

The site covers the full set of features a restaurant website needs: multilingual digital menu, online reservations and Google Maps integration. The reservation system routes bookings directly into Google Sheets — no backend service, no new tools for the staff to learn, just a spreadsheet they already know how to use.

The menu was rebuilt from scratch: reorganised, translated and structured to work for both local and international visitors.

The restaurant kept Facebook as their primary online presence. The website is complete and production-ready regardless.

A multi-page wellness website built from an existing design as part of a university assignment. The technical requirements were intentionally simple — the goal was to follow the provided design accurately and produce clean, responsive HTML, CSS and JavaScript.

No framework, no component libraries. A focused exercise in getting frontend fundamentals right.