This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

I still remember the first time I touched a computer and a video game. It felt like magic. The sounds, the colors, the feeling that you could explore instead of just consume. Years later, as a front-end developer, I realized something uncomfortable: most portfolios don’t feel like that anymore.

They’re clean. Minimal. Technically correct. And… kind of forgettable.

So I asked myself: where did the fun go? That question became the starting point of this project.

Instead of a traditional portfolio, I built an interactive 2D top-down game with handcrafted pixel art and a lot of CSS. You can walk through my room, interact with the objects around you, and get to know me in a more playful, human way.

About Me

Hey! I’m Larissa also known as Mewmew a Front-End developer based in São Paulo, Brazil. I’m empathetic, curious, and deeply creative, and I love bringing my passions into everything I build.

This portfolio was created during January as part of this challenge, but it’s also a reflection of my journey so far.

I hold a degree in Digital Games, studied at 42 São Paulo, and I’m currently pursuing Web Design. Even though I don’t work in the game industry professionally, game design thinking is always present in my work especially when it comes to UX, interaction, feedback, and storytelling.

In my free time, I enjoy playing indie games, building front-end side projects, creating pixel art, and working on handmade crafts. All of these interests quietly (and sometimes loudly) shape how I design interfaces.

I’ve been diving deeper into Web Accessibility, Pixel Perfect UI, and SEO. This portfolio brings all of that together in an interface inspired by 2D top-down pixel art games, with nostalgic references to Windows 95/Windows XP and Playstation 2.

By interacting with the computer, the video game, or even the backpack inside the room, you can explore my projects, play small games, and access my resume all through interaction instead of static pages.

Throughout development, I focused on maintaining a pixelated aesthetic, a consistent color palette, fluid storytelling, accessibility, responsiveness, and solid SEO foundations.

Portfolio

📎 Want to play it on your own device? You can go fullscreen or download it to “play” locally. https://devcommunityportfoliochallenge2026-574008284484.us-central1.run.app/

📎 If you’d like to explore the code: https://github.com/mewmewdevart/DevCommunityPortfolioChallenge2026

How I Built It

This portfolio was built as an interactive single-page application that simulates a retro operating system combined with classic game interfaces — while still following modern front-end, performance, and accessibility standards.

Tech Stack

• React 18 + Vite for performance and fast iteration
• TypeScript (strict mode) for safety and scalability
• Tailwind CSS v4 combined with BEM methodology for structured, maintainable styles
• React Context for global UI state (OS, sound, windows)
• XState to manage complex interaction flows and narrative states
• react-i18next for internationalization (English, Spanish and Brazilian Portuguese), including accessibility-related strings
• Vitest for unit testing critical logic

Most of the pixel art you see was handcrafted by me 💜

Architecture & Design Decisions**

The project follows a hybrid Feature-Based + Atomic Design architecture. Core logic is isolated from UI components, and each interactive system (desktop, windows, game interface) is treated as its own feature with clear boundaries.

One of the biggest challenges was building a custom window system from scratch — handling focus management, dragging, resizing, z-index stacking, and full keyboard navigation without relying on third-party UI libraries. This gave me full control over behavior and accessibility.

Accessibility First

Accessibility was a core pillar from day one (more on day four, the day I started the challenge haha)

The entire interface is fully keyboard-navigable and designed to meet WCAG 2.1 AA/AAA guidelines.

Some key strategies include:

• High-contrast global focus indicators
• Roving tabindex for grids and menus
• Screen reader–friendly live regions (aria-live="polite")
• Semantic HTML, using ARIA only when strictly necessary
• Localized accessibility labels and hidden instructions for screen readers

UX, Narrative & Feedback

• The UI relies on familiar metaphors, desktop, taskbar, memory cards, and visual novel–style dialogs to reduce cognitive load while keeping the experience playful and immersive.
• Sound effects, animations, and micro-interactions provide constant feedback, always respecting user preferences such as reduced motion or disabled audio.

Google AI Tools

Google AI tools supported the process during ideation, sound generation, copy refinement, translation, and accessibility reviews, helping improve clarity, consistency, and multilingual support without replacing core design or development decisions.

• Gemini was used for quick questions and fast problem-solving during development.
• AI Studio helped shape the core of the project, which initially started as a simple OS-style system.
• Antigravity supported organization and stability, helping keep everything structured and working smoothly.

Some Screenshots

Start the experience

Switch languages, access it on desktop or mobile, or get in touch

Choose your level of immersion

Full Experience · Résumé · Desktop · Video Game

Explore the project Interact with my cats, interact with the videogame or just take some photos in the computer

What I’m Most Proud Of

• Revisiting and deepening my knowledge of accessibility, PWA concepts, performance optimization, and component separation.

• Returning to pixel art after a long time — blending technology and art again was incredibly fun, and watching the project grow step by step was deeply rewarding.

• Making the system scalable: adding a new game to the video game console or a new folder to the desktop only requires adding a markdown file that follows a specific format and supports all three project languages.

• Designing the game grid logic inspired by so_long, a project I built at 42 São Paulo, where maps are represented as character-based grids. This approach helped me structure the game world using simple, predictable rules — making movement, collisions, interactions, and accessibility states easier to reason about and maintain.

• Continuing the project despite personal challenges that almost made me give up, persistence became part of the story too.

After the challenge results are announced, I plan to return to this project to polish and expand some areas even further.

If you’d like to connect, feel free to reach out:

• LinkedIn: https://www.linkedin.com/in/mewmewdevart/
• GitHub: https://github.com/mewmewdevart

Thanks for playing 💾✨