A Portfolio You Query, Not Scroll
Source: Dev.to
Introduction
Most developer portfolios create friction. Under time pressure, reviewers miss important details—not because they are absent, but because they are buried inside presentation choices. The reader is forced to adapt to the portfolio, which is backwards. Information systems should adapt to the user, not the other way around.
This project treats a portfolio as an information system, not a traditional webpage. It is a search‑first developer portfolio:
- No navigation menu
- No “About / Projects / Skills” tabs
- No fixed narrative to scroll through
You don’t browse it—you query it.
Example query: “What projects has Shivam built?”
Answer: “Still (his hackathon‑winning forum project).”
The portfolio retrieves only the information relevant to the question and presents it as a clear, grounded answer, delivering immediate clarity.
Live Interactive Demo
If the embed below does not load, view the full site here:
(embed placeholder)
Implementation Details
Retrieval‑Augmented Generation (RAG) System
- The portfolio is not a chatbot.
- All content is prepared and indexed ahead of time.
- At runtime, the system retrieves only the relevant snippets and generates a response strictly from that retrieved context.
In practice:
- The user asks a question.
- The system identifies intent (projects, skills, contact, background).
- Relevant portfolio content is retrieved using semantic similarity.
- Only that content is sent to the model.
- The response includes direct citations pointing back to real sources.
This keeps answers predictable, inspectable, and grounded in real data.
Flow
- Gemini 3 Flash → Structured response with citations.
- Retrieval before generation: The AI never sees the entire portfolio, only the content relevant to the current query.
- Intent‑aware filtering: Project questions prioritize project data; contact questions do not pull unrelated background information.
- Inspectable answers: Every answer is grounded in a specific source, allowing readers to verify the information.
- Precomputed embeddings: Generated at build time; runtime work is limited to retrieval and generation, keeping latency and cost predictable.
- Graceful limits: The demo runs on Gemini’s free tier. If usage limits are reached, the system transparently falls back to retrieved portfolio data and clearly indicates the change in behavior.
Tech Stack
| Component | Technology |
|---|---|
| Frontend | Next.js 16, TypeScript, Tailwind CSS |
| AI Model | Gemini 3 Flash (Google AI Studio) |
| Embeddings | text-embedding-004 |
| Search | Custom cosine similarity retrieval |
| Animations | Framer Motion, Three.js, Unicorn Studio WebGL |
| Deployment | Google Cloud Run |
The system is intentionally small.
About the Author
Hi, I’m Shivam Gawali. I’m a student of Artificial Intelligence and Data Science with a strong interest in software engineering fundamentals and backend systems. I enjoy building small, complete systems and understanding how they behave under real constraints. I care about correctness, clarity, and making reasoning visible more than surface‑level polish.
This portfolio reflects how I think: focus on the question, reduce noise, and answer precisely. Portfolios are usually reviewed under severe time pressure. Search rewards understanding. If we can search documentation to understand a system, we should be able to search a person’s work to understand how they think.