From Resume to Operating System: Designing an AI-Powered Interactive Digital Twin

Star — Sat, 24 Jan 2026 04:25:50 +0000

Introduction

Traditional portfolios are often static, predictable, and easy to forget. For this challenge, I wanted to rethink what a developer portfolio could be. Instead of building another scroll-based website, I created an OS-style interactive portfolio — a living Digital Twin of my technical identity.

This project simulates a real operating system interface where visitors can explore applications, interact with dynamic UI elements, and communicate with an AI-powered assistant — all within a fully responsive, multi-device environment. Built using React, Tailwind CSS, and Google Gemini AI, the portfolio blends high-fidelity UI design, complex state-driven architecture, and real-time artificial intelligence to transform a resume into an immersive experience.

The result is not just a portfolio, but an interactive system that demonstrates how modern UI engineering, AI integration, and thoughtful design can converge into a single cohesive product.

About Me

I’m Sayad Akbar, a full-stack developer passionate about building experiences, not just applications. I enjoy working at the intersection of UI engineering, system design, and artificial intelligence, where code becomes a medium for storytelling rather than just logic.

With this portfolio, my goal was to express how I think as a developer — system-first, detail-driven, and experience-focused. I believe great products are not only functional; they feel alive. That belief led me to design my portfolio as an interactive operating system, where every animation, transition, and interaction follows real-world logic instead of static presentation.

I’m constantly exploring modern web technologies such as React, Tailwind CSS, and AI-powered systems to push beyond traditional boundaries. This project represents my mindset for the new year: build boldly, experiment deeply, and turn ideas into immersive digital experiences.

Portfolio

Experience my OS-Style Interactive Portfolio live — it’s not just a website, but a mini operating system running in the browser.

Visitors can interact with multiple device mockups (iOS, Android, and iPad), explore applications showcasing my projects and skills, and even engage with the AI-powered “Batman” assistant to learn more about my work. Every interaction is designed to feel responsive, dynamic, and immersive, transforming a traditional resume into an interactive experience.

🔗 Live Demo:
https://sayadakbar.netlify.app/

Deployment Note

While the Dev.to challenge references embedding Google Cloud Run deployments, I chose to deploy this project on Netlify. Cloud Run requires a payment method even for free-tier usage, whereas Netlify allows fully functional hosting with no payment requirement. This deployment delivers the same OS-style interactivity, multi-device support, and AI integration, ensuring the experience remains fully accessible.

⚡ Tip: For the best experience, use a desktop or large tablet viewport to see dynamic scaling and all AI features in action.

dev label: dev

How I Built It

This portfolio was designed to push the boundaries of what a resume can be — evolving it from a static webpage into an interactive, AI-powered digital twin.

Tech Stack

React (ESM) — Fast component rendering and state management

Tailwind CSS — Responsive layouts, smooth transitions, and theming

FontAwesome — Consistent iconography across the simulated OS

Google Gemini 3 Flash — Powers the AI assistant and real-time riddle generation

Design Decisions

Multi-Device Mockups
A component-driven architecture (DeviceMockup.tsx + deviceConfig) adapts layouts for iOS, Android, and iPad, including realistic hardware elements such as Dynamic Island, punch-hole cameras, and platform-specific buttons.

Dynamic Scaling Engine
Ensures proportional rendering across devices — from large 4K monitors to smaller laptop screens.

Contextual App Engine
Each app runs as a state-driven component, enabling seamless interaction without traditional page navigation.

Dual Themes & Dynamic Accents
Light and dark themes dynamically adjust backgrounds and GIF layers, while users can customize accent colors in real time.

Google AI Integration

Batman AI
A custom-tuned Gemini assistant designed to behave like a tactical agent. A developer “dossier” is injected into the prompt, allowing users to intelligently query the portfolio.

Neural Nexus Riddle Game
Gemini generates cyberpunk-themed riddles dynamically. Responses follow a structured JSON schema, enabling reliable frontend validation.

Development Process

Designed a component-driven system architecture

Implemented dynamic scaling and contextual state management

Integrated Gemini AI to make the portfolio interactive and responsive

Polished animations, transitions, and theming for an OS-like feel

This combination of UI engineering, AI integration, and immersive design transforms the portfolio into a living system rather than a static showcase.

What I’m Most Proud Of
OS-Style Interactivity

Reimagining a portfolio as a mini operating system enables users to explore content naturally through apps and interactions instead of scrolling pages.

AI-Powered Assistant

The Batman AI, powered by Google Gemini 3 Flash, adds meaningful interactivity by allowing visitors to ask questions and receive structured, contextual responses.

Neural Nexus Riddle Game

This feature demonstrates real-time AI content generation combined with strict frontend validation — blending creativity with engineering discipline.

High-Fidelity Multi-Device Mockups

Every device is carefully crafted, from iOS Dynamic Island to Android punch-hole cameras, creating a tangible and realistic experience.

Dynamic Theming & Customization

Real-time theme switching and accent color customization highlight advanced state management and design flexibility.

Overall, this project represents a balance of technical depth, thoughtful design, and AI experimentation — the kind of work I’m excited to build, refine, and expand upon.

DEV Community: Star

From Resume to Operating System: Designing an AI-Powered Interactive Digital Twin