Rishikesh Sonawane — Design &

Rishikesh Sonawane — Design & Development Portfolio

Editorial portfolio showcasing 6 design-concept projects. Custom cursor, page loader, scroll reveals, magnetic buttons, noise overlay. Pure HTML/CSS/JS.

Link: https://rishikesh-sonawane.github.io/web-designs/

## Overview

The portfolio is the seventh project in the collection. It's not just a container for the other six, it's a project in its own right, with its own design language, its own interactions, and its own personality.

Where the six concept projects are products, the portfolio is a person. Warm, editorial, unhurried. It doesn't compete with the work. It frames it.

## Design Decisions ### Why Warm Editorial?

The six projects span quiet luxury, bohemian, technical, skeuomorphic, dark atmospheric, and Material Design. The portfolio needed to be "none of these", a neutral but warm frame that lets each project's personality shine through.

Terracotta on cream. Fraunces serif. Generous whitespace. The aesthetic of a well-designed magazine, thick paper, confident typography, no rush.

### Why Fraunces?

Fraunces is a variable font with an optical size axis, it gets more refined at larger sizes. At display sizes, it has the weight and personality of a classic serif. At body sizes, it's clean and readable. One font, two roles.

### Why Vanilla JS?

The portfolio is plain HTML/CSS/JS, no build step, no framework. Open `index.html` and it works. This is intentional: the portfolio should be as accessible as possible. No Node.js required. No `npm install`. Just the web.

## Impact

- Zero dependencies, pure HTML/CSS/JS - 12 premium interactive features - 6 case studies with unique accent colors - Fully responsive with `prefers-reduced-motion` support - Contact form with Formspree integration

## What I Learned

1. The portfolio is a project, not a container. It deserves the same care as the work it showcases. 2. Warm editorial works for portfolios. Terracotta on cream, serif headings, plenty of whitespace, it feels human. 3. Custom cursors are polarizing. The `pointer: coarse` check is essential. 4. Page loaders are vanity for static HTML, but they look cool. 5. Scroll reveal animations are the single most impactful feature for a portfolio.