TOFABZA logo
TOFABZA
Portfolio

My Builds

Designed and built from scratch. No templates.

Ecommerce Store
Preview
SHOWCASE BUILD

A production-grade showcase build created to demonstrate end-to-end full-stack eCommerce development capability.

Role:
Full-Stack Development
Purpose:
Demonstrate end-to-end eCommerce application development capability

Ecommerce Store

A full-stack premium electronics store with curated product catalog, cart, orders, admin panel, and live payments.

Open website
Next.jsSupabaseImageKitRazorpayTailwind CSSGoogle Auth

Problem:

Most small business ecommerce stores are built on rigid templates — WordPress, Shopify themes — making even simple customizations a battle. They end up looking generic, loading slow, and locking owners into platforms they can't truly control.

Solution:

Built a full-stack premium electronics store from scratch with a powerful admin panel — allowing admins to add products with descriptions and images, assign them to categories (featured, latest, best-selling, fast-selling), and manage hero banners. ImageKit handles fast, optimized image delivery, auto-compressing and resizing product images on the fly. Razorpay powers live payment processing across 9 curated product categories. Google Authentication handles secure user sign-in.

Outcome:

A production-deployed store with working cart, orders, payments, and a fully functional admin — admins can manage the entire catalog, collections, and homepage content without touching code. No templates, no platform lock-in. Ready to scale with real inventory.

Cosira
Preview
PERSONAL PRODUCT

Built as a personal software product to demonstrate product development, UX design, and engineering capability.

Status:
Live
Role:
Product Design, Development
Purpose:
Demonstrate SaaS product development capability

Cosira

A suite of 11 precision color tools built on OKLCH - generate palettes, export to CSS, Tailwind, or JSON. Built for designers who care about accuracy. Cosira is a DESKTOP app. Its NOT available on small screens, but you can check out the video to see it in action.

Open website
Next.jsOKLCH EngineTailwind CSS

Problem:

Designers waste hours juggling scattered tools — color pickers, palette generators, contrast checkers — with no unified system and no perceptual accuracy.

Solution:

Built a unified platform with 11 color tools - palette generation, gradients, tints, mood & culture palettes - all in OKLCH for perceptually accurate results.

Outcome:

A one-stop color system builder with 11 tools, OKLCH accuracy, and direct export to CSS, Tailwind, and JSON — no tab-switching, no guesswork.

MotionZest Studio
Preview
PERSONAL PRODUCT (IN DEVELOPMENT)

A personal software product currently under development, demonstrating advanced frontend engineering and application architecture.

Status:
In Development
Role:
Product Design, Frontend Development
Purpose:
Demonstrate modern application architecture and frontend engineering capability

MotionZest Studio

A visual 3D animation editor that outputs clean, tree-shakable Three.js source code - no proprietary runtime. Built for creative developers and motion designers who need timeline-first control over web 3D scenes.

Open website
Three.jsReactZustandYjsTypeScriptWebGL

Problem:

Existing tools like Spline lack timeline depth, Theatre.js is code-first only, and Blender is overkill for web delivery - leaving no visual editor that produces portable, production-ready Three.js output.

Solution:

Building a modular visual editor with a non-React imperative WebGL viewport, a keyframe animation engine, and a code generation pipeline that exports named, tree-shaken Three.js imports.

Outcome:

A full scene authoring + animation studio.

Elysian
Preview
DESIGN CONCEPT

A self-initiated design concept created to demonstrate premium website design and luxury brand positioning.

Role:
Brand Strategy, UI/UX Design
Purpose:
Demonstrate premium web design and luxury brand positioning capability

Elysian

A multi-page luxury real estate website for estate builders. Built to demonstrate high-end service brand design.

Open website
Next.jsTailwind CSS

Problem:

Luxury real estate firms often have outdated or generic websites that undercut the premium nature of what they offer.

Solution:

Built a refined, editorial-style website with strong typography, project showcases, a structured services section, and a process flow - designed to command trust at first glance.

Outcome:

A production-ready design concept demonstrating how a luxury service brand should look and feel online.

Tony Stores
Preview
DESIGN CONCEPT

A self-initiated eCommerce design concept created to demonstrate conversion-focused UI and eCommerce experience design.

Role:
UI/UX Design, eCommerce Experience Design
Purpose:
Demonstrate conversion-focused eCommerce design capability

Tony Stores

Design concept - a full-page premium tech e-commerce UI. Product grids, category browsing, trending sections, and brand trust signals - built to demonstrate e-commerce layout and design depth.

Open website
Next.jsTailwind CSS

Problem:

Premium tech products are often sold through cluttered, trust-deficit storefronts that don't match the quality of what they're selling.

Solution:

Designed a clean, conversion-focused, mobile responsive e-commerce UI with clear product hierarchy, category browsing, trending sections, a staff picks highlight, brand partner display, and social proof elements - all built to showcase high-end tech products in a way that builds trust and drives sales.

Outcome:

A comprehensive e-commerce UI concept demonstrating product-led design thinking from hero to footer.

Coming soon

Upcoming Project

Concept

A new high-performance build coming soon.

Reserved for the next build

Portfolio includes a mix of personal products, design concepts, and showcase builds created to demonstrate different aspects of product strategy, design, and engineering capability.

Ready to build something real?

Find the right plan or book a call.
I'll build a custom package around your goals.