How I Built SQUIAM: A Steam-Inspired Interactive Developer Portfolio

ramiro quintana — Wed, 09 Sep 2026 13:42:22 +0000

I'm Ramiro Quintana, a Software Engineer & Full Stack Developer building software projects under quintana.dev.

Most developer portfolios follow the same structure: a short introduction, a list of skills, some projects, and a contact section.

I wanted to try something different.

Instead of building another traditional portfolio, I decided to turn mine into an interactive experience inspired by Steam's interface and the way it organizes games, libraries, profiles, and communities.

That project became SQUIAM.

The idea behind SQUIAM

SQUIAM is an interactive developer portfolio designed around the idea of exploring projects rather than simply scrolling through a page.

The main interface is organized into different sections, including:

A project library
A technical services store
A developer profile
A technology inventory
Community features
Statistics
Real-time chat
Individual project pages

The Steam-inspired design is mostly a starting point. The goal was to take some familiar concepts from the platform and adapt them to a developer portfolio.

The technology stack

SQUIAM is built with React, TypeScript and Vite.

For styling, I use Tailwind CSS together with custom styles to recreate the dark interface and desktop-application feel.

Animations are handled with Motion, mainly for transitions between views and UI elements.

For charts and statistics, I use Recharts.

The application is deployed on Cloudflare Pages and uses serverless functions for backend functionality.

The main stack is:

React
TypeScript
Vite
Tailwind CSS
Motion
Recharts
Cloudflare Pages
Serverless Functions

Designing the interface

One of the most interesting parts of the project was figuring out how to make a portfolio feel like an application.

Instead of having every section visible at once, the interface is built around navigation and discovery.

Projects have their own pages, technologies are presented as part of an inventory, and services are presented through a store-like interface.

This also meant paying more attention to small details such as transitions, navigation states, loading behavior, and responsive layouts.

The project library

The library is one of the main parts of SQUIAM.

Each project can have its own page containing information about what it does, which technologies were used, its current state, and relevant links.

This structure also makes it easier to keep adding new projects without redesigning the entire portfolio every time.

A different approach to services

I also wanted the services section to fit into the same concept.

Instead of presenting a traditional list of services, I designed it as a small software store.

The idea is to make technical services easier to understand while keeping the visual language consistent with the rest of the application.

My work mainly focuses on software development, web applications, browser extensions, SaaS projects and automation.

Why build something this complicated for a portfolio?

A portfolio is already a software project, so I decided to treat it that way.

Rather than only using the portfolio to demonstrate my work, I wanted the portfolio itself to demonstrate how I approach software development.

That meant dealing with the same kinds of problems that appear in larger applications: component architecture, routing, state management, UI consistency, performance, deployment and maintainability.

What I learned

Building SQUIAM has been a useful way to experiment with both frontend development and product design.

Some of the things I've worked with throughout the project include:

Structuring a larger React application
Building reusable UI components
Creating complex interfaces
Working with animations and transitions
Visualizing project data
Connecting frontend features with serverless functions
Deploying applications with Cloudflare Pages
Improving SEO for a JavaScript application
Designing an interface around user interaction rather than a traditional page structure

The biggest lesson for me has been that a portfolio doesn't have to be just a presentation of your work.

It can be one of your projects.

What's next?

SQUIAM is still an evolving project.

As I build new software, I want the portfolio to evolve with it rather than remaining a static collection of projects.

The long-term idea behind quintana.dev is to have a single place where I can publish and showcase the software I build, from experiments and browser extensions to larger applications.

About me

I'm Ramiro Quintana, a Software Engineer & Full Stack Developer focused on building web applications, browser extensions, SaaS projects and software solutions under quintana.dev.

You can explore SQUIAM and my other projects at:

https://quintana.dev.ar/

DEV Community: ramiro quintana