Personal portfolio
ibaifarina.dev is my personal portfolio as a software developer and Data Science student. I designed and developed it from scratch to have a space of my own where I could introduce myself, present the technologies I work with, and—above all—showcase the projects I create.
I wanted it to be more than a page with links. I wanted the website itself to demonstrate how I approach development by combining a polished interface, a clear visual identity, and a fluid, interactive experience.
Design and development
On the technical side, I built the project with Next.js, React, TypeScript, and Tailwind CSS, structuring the interface with reusable components for the different parts of the website: projects, experience, personal information, skills, and contact.
The design, initially planned in Figma, is intended to be minimalist while retaining its own personality, with particular attention given to typography, imagery, spacing, and transitions between content.
Animation and interaction
Motion and interaction are an important part of the project. I used GSAP and ScrollTrigger to create entrance animations, scroll-linked effects, parallax, and progressive content reveals. I also integrated Lenis to provide smoother scrolling between the different sections.
The animations are designed to support navigation without making the website feel heavy, and they also respect the device's reduced-motion preference.
Project system
The portfolio also works as a collection of my work. Each project can have its own page with information about its goal, my role, the technologies used, images, and links to the product or repository.
To support this, I developed a dynamic routing system with Next.js so that projects are generated from a shared data structure and new work can be added easily.
I currently feature projects from different areas, ranging from native iOS and macOS applications to web products, including Haze, OmniTrack, Tempo, and IB Studio.
I also wanted to explain some projects in greater depth instead of limiting them to an image and a few technologies.
That is why I implemented a system for adding Markdown articles to each project, where I can document the development process, design decisions, features, or technical details. This content is loaded automatically on the corresponding project page.
Spanish and English
The portfolio is fully available in Spanish and English. I implemented a custom internationalization system that makes it possible to change the language for both the general interface and project-specific content.
The selection is stored in the browser so the chosen language is preserved while navigating between pages.
Responsive design and user experience
The website adapts to different screen sizes, with specific changes to navigation, structure, and animations for mobile devices.
I worked to preserve the same visual identity and sense of quality on both desktop and mobile instead of simply shrinking the desktop version.
Result
This portfolio is one of the projects that best represents my profile because it brings together several of the areas I care about most: frontend development, UI/UX, animation, product, and attention to detail.
My goal was for the website to do more than list the technologies I know; I wanted the portfolio experience itself to demonstrate what I can design and develop.