DEV Community

Cover image for Geometric Journal: AI Portfolio powered by Gemini 1.5
Samuel Chimmy
Samuel Chimmy

Posted on

Geometric Journal: AI Portfolio powered by Gemini 1.5

New Year, New You Portfolio Challenge Submission

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

About Me

I'm Samuel, a Full-stack Web3 developer with over five years of experience architecting decentralized systems. My work focuses on React, TypeScript, and Solidity, with a deep emphasis on performance and inclusive design.

With this portfolio, I wanted to move away from the "static resume" feel and create a "Geometric Journal"—a space that feels as structured as code but as warm as a handwritten note. My goal is to showcase my freelance work through an interactive, intelligent interface that acts as a 24/7 executive assistant for potential clients.

Portfolio


--labels dev-tutorial=devnewyear2026

How I Built It

My portfolio is built on a "Hand-Drawn Logic" design philosophy, where strict geometric bento grids meet organic typography.

The Tech Stack

Frontend: React 19 (Vite) + TypeScript.
Styling: Tailwind CSS with custom "tactile" physics via Framer Motion.
AI Engine: Google Gemini 1.5 Flash via the @google/genai SDK.

Infrastructure: Deployed on Google Cloud Run.

Backend Integration: Google Apps Script (acting as a secure proxy for the Google Calendar API).

AI Integration with Gemini 1.5 Flash

The "Brain" of the portfolio is the AI Executive Assistant (AIChat.tsx).
Using Google AI Studio, I configured Gemini 1.5 Flash to act as my personal liaison.
Contextual Awareness: The model is fed my data.ts (projects and bio) as system instructions.
Function Calling: This is the "magic" feature. I defined tools like check_calendar and create_booking. When a user asks, "Are you free next Tuesday?", Gemini autonomously triggers a call to my Google Apps Script backend, checks my real-time availability, and responds with natural language.
Design Details
To achieve the "Journal" feel, I paired the decorative Henny Penny font for headings with Kalam for body text (via Google Fonts). I implemented "Tactile Depth" by using hard shadows that collapse by 2px on interaction, mimicking the physical sensation of pressing a button.

What I'm Most Proud Of

I am most proud of the AI Executive Assistant's speed and utility. We were able to build a functional, tool-calling assistant in less than 30 minutes using Gemini 1.5 Flash.
It transforms the site from a passive document into an active employee. Seeing the AI move from a chat bubble to rendering a custom "Success Card" after a user books a meeting through the Google Calendar integration is a perfect example of how AI can enhance the user experience without being a gimmick.

📂 Source Code

You can find the full source code for this project here:
GitHub: Portfolio-3.0 (Licensed under MIT)

Top comments (0)