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

Block or report rudra-xi

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. 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

  2. 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

  3. 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

  4. quick-bezier quick-bezier Public

    A lightweight library for creating and manipulating Bézier curves. Perfect for developers and designers looking for an efficient tool to integrate Bézier curve functionalities into their projects.

    JavaScript 6

  5. wyld-ruby wyld-ruby Public

    A crimson‑drenched, scroll‑driven Next.js gallery that showcases a bold, sensual model across five intimate editorial frames.

    TypeScript 4

  6. sylvan-reveal-animation sylvan-reveal-animation Public

    Reveal Animation: A sleek project built with HTML, CSS, and JavaScript, showcasing smooth reveal animations using GSAP. Check it out and star it if you like it!

    HTML 2