jlandaeta.dev

A generic portfolio says nothing about how I work. The first version worked, but it looked like any dark portfolio with gradients, glass and effects: nothing in it was mine.

This very site, in production at jlandaeta.dev. It is my project end to end: visual direction, architecture, content and code. I launched it in June 2026 and rebuilt it in October with an identity of its own.

Let a recruiter understand in seconds what I build and how I work, with an identity that comes from my own world and without giving up clarity or speed.

• Visual direction: I defined the “Fogata” (campfire) system from my pixel-art scene of the samurai by the fire. The palette, typefaces and frames come from there.
• Architecture on Next.js 16 (App Router) and React 19, with the language in the URL so each version is indexable.
• Content: I wrote and structured the case studies in Spanish and English, checking every claim against the project repositories.
• Performance and accessibility: I measured before changing, and looked after focus, keyboard use and reduced motion.
• Process: I work with coding agents as a pair programmer. I set the direction and the criteria, review every change locally and decide what gets published.

• A 100% static site: all 28 pages are generated at build time, with no functions or environment variables.
• All content lives typed in a single bilingual module; a test checks that Spanish and English match and that every project has its case study.
• The language is part of the route (/es, /en): canonical, hreflang, Open Graph, sitemap, JSON-LD and llms.txt come from the same sources.
• Scroll entrances are CSS driven by a single IntersectionObserver; Framer Motion is kept for what needs an exit animation.
• Pixel-art sprites are defined as text grids and drawn as SVG, with one path per color.

• A hero that works as a game title screen: the scene spans the full width and the menu uses a selection cursor.
• Projects in three tiers: one main project with a heavy frame, two that accompany it with their screenshots, and the rest in a carousel.
• Case studies sharing one structure: problem, context, goal, role, architecture, solution, trade-offs, learnings and result.
• A character sheet, a stack inventory linked to the projects where I used each technology, and the Allies section.
• Game details that stay out of the way: achievements as you move through the sections and a hidden Konami code.

• Rebuilding instead of patching: I removed particles, cursor glow, glass and gradients, and kept a single ambient effect, the fire.
• Hierarchy: a grid of nine equal cards highlighted nothing. I reserved the heavy frame for three pieces and let everything else accompany them.
• Animation and performance: an entrance fade delayed the paint of the main content. Now the content paints from the first frame and the transition runs on top.
• Keeping Spanish and English in sync without duplicating the site structure.

• Identity does not come from adding effects: it comes from choosing an origin and staying coherent with it.
• Measure before optimizing: the change that helped most was removing an animation, not adding a technique.
• Learning Next.js 16 and React 19 from their docs, not from memory.
• A coding agent speeds things up, but it does not decide for you: the changes that worked started from a clear direction and were checked against evidence.