Skip to content
View rudra-xi's full-sized avatar
🏠
Working from home
🏠
Working from home

Block or report rudra-xi

Block user

Prevent this user from interacting with your repositories and sending you notifications. Learn more about blocking users.

You must be logged in to block users.

Content in all repositories owned by your account will be closed.
Maximum 250 characters. Please don’t include any personal information such as legal names or email addresses. Markdown is supported. This note will only be visible to you.
Report abuse

Contact GitHub support about this user’s behavior. Learn more about reporting abuse.

Report abuse
rudra-xi/README.md

👋 Hey, I'm Rudra

Full-Stack Developer · UI/UX Designer · Creative Technologist

I turn ideas into fast, beautiful & interactive digital experiences.



 



GitHubCard


🧑‍💻 About Me

I'm a Full-Stack Developer + UI/UX Designer who enjoys working at the intersection of design, engineering, motion, and performance.

I believe the best digital products are not just functional — they're intentional, responsive, accessible, and memorable.

I build modern web applications with a strong focus on:

Architecture · UI/UX · Performance · Motion · Accessibility · Scalability

I don't just build websites. I build experiences people remember.


🔭 What I'm Building

  • 🚀 Next.js applications with modern App Router architecture
  • 🎨 Beautiful interfaces using shadcn/ui, Base UI & Tailwind CSS
  • 🗄️ Type-safe data layers with Drizzle ORM, Prisma & PostgreSQL
  • 🔐 Authentication, Realtime APIs, and BaaS with Supabase
  • ✨ Cinematic interactions using GSAP & Framer Motion
  • 🧊 Experimental 3D experiences with Three.js & WebGL
  • 🤖 AI-powered workflows using Gemini, DeepSeek & Perplexity
  • ⚡ High-performance experiences optimized for SEO & Core Web Vitals

⚡ What I Do

🎨 Design ⚙️ Engineering ✨ Experience
UI/UX Design Next.js Applications Motion Design
Design Systems React & TypeScript GSAP Animations
Visual Design Server Components Framer Motion
Interaction Design API Architecture Micro-interactions
Responsive Design Drizzle ORM & Prisma Three.js
Figma Prototyping PostgreSQL & Supabase WebGL
Photoshop Authentication & AuthZ Creative Frontend

🧰 Tech Stack

💻 Languages


⚛️ Frameworks & Frontend


🎨 Design


✨ Motion & Creative Development


⚡ Database, Backend & BaaS


🧐 Linters & Code Quality


🤖 Artificial Intelligence


🛠️ Editors, Cloud & Tools


🏗️ My Development Workflow

Stage Focus Area Stack & Tools
01. Ideation & UX Research, Wireframing & Design Systems Figma · UI/UX Design · Design Tokens
02. Frontend Core Component Architecture & Type Safety Next.js · TypeScript · shadcn/ui · Tailwind CSS
03. Backend & Data Auth, Realtime Database & Schema Supabase · PostgreSQL · Prisma · Drizzle ORM
04. Motion & Creative Micro-interactions & 3D Immersion GSAP · Framer Motion · Three.js · WebGL
05. Optimization Speed, Accessibility & Search Visibility SEO · Core Web Vitals · A11y · ESLint · Biome
06. Deployment CI/CD, Hosting & Environments Vercel · Git · GitHub · Zed · VS Code

🚀 Featured Projects

🧠 Memoir Veritas

A modern storytelling experience focused on immersive presentation, thoughtful UX and visual quality.

Built with

Next.js · UI/UX · GSAP · Tailwind CSS


💎 Wyld Ruby

A visually-driven web experience combining expressive design with modern frontend engineering.

Built with

React · Framer Motion · UI Design · Responsive Design


🛒 Envy E-Commerce

A modern e-commerce experience focused on usability, visual hierarchy and intuitive shopping interactions.

Built with

React · Express · MongoDB · UI/UX


🌑 Archive: Dark Desire

An experimental creative web project exploring dark aesthetics, visual storytelling and immersive interaction.

Built with

Three.js · GSAP · Vite · Creative Frontend


🎯 Currently Exploring

⚡ Tech & Architecture

  • Next.js App Router: Advanced Server Components & Caching
  • Supabase & PostgreSQL: Row Level Security (RLS) & Realtime
  • Type-Safe ORMs: Schema migrations with Prisma & Drizzle

✨ Creative & Performance

  • Interactive 3D: Shader programming in Three.js & WebGL
  • Advanced Motion: Physics-based animations with GSAP
  • Performance: Sub-second load times & Core Web Vitals

🧠 Engineering Philosophy

Design × Engineering × Performance

🎨 Design

Interfaces should be clear, intentional and memorable.

⚙️ Engineering

Software should be maintainable, scalable and type-safe.

⚡ Performance

Experiences should be fast, accessible and reliable.

✨ Motion

Animation should communicate — not simply decorate.


Build with intention. Design with empathy. Engineer with precision.


🌐 Let's Build Something

Have an idea? Building a product?

Need a frontend that doesn't look like every other website?




Let's create something worth shipping.


☕ Developer Status

I don’t always test my code, but when I do, it’s in production.

Thanks for visiting! ⭐

Built with caffeine, curiosity, creativity & an unreasonable number of browser tabs.

Pinned Loading

  1. rep-deck rep-deck Public

    A modern strength-training tracker built with Next.js 16, TypeScript 7, Tailwind v4, and Drizzle. Log workouts, track PRs, and visualize your progress.

    TypeScript 19 1

  2. archive-dark-desire archive-dark-desire Public

    Dark Desire - Archive: A visually captivating project built with HTML, CSS, and JavaScript, featuring smooth animations using GSAP. Check it out and star it if you like it!

    HTML 16

  3. am-i-here-or-not am-i-here-or-not Public

    Editorial-style photo gallery and creative manifesto built with Next.js

    TypeScript 10 1

  4. memoir-veritas memoir-veritas Public

    A cinematic, GSAP-powered photography portfolio built with Next.js and Tailwind, featuring smooth scroll-driven sections, diffused cursor interactions, and an immersive single-page gallery for prof…

    TypeScript 8

  5. envy-ecommerce envy-ecommerce Public

    A modern ReactJS app built with Vite. Features a dynamic product catalog, user authentication, seamless shopping cart, and responsive design. Ideal for scalable e-commerce platforms.

    JavaScript 7 1

  6. silk-slip silk-slip Public

    Silk Slip is a scroll-driven, crimson-toned gallery that presents eleven cinematic editorial frames in a seamless, three-column storytelling layout.

    TypeScript 7