Live Website: https://astapable.github.io
This landing page was created as my final Index Project for the Typography & Interaction course at Parsons School of Design in 2026.
For two semesters, I worked on hand-coded projects that made me sit for hours, test ideas, break layouts, fix bugs, and slowly understand what the browser can do when you stop treating code as something purely technical.
The Index collects all of these projects in one place. It works as a single-page portfolio and a small “business card” — introducing me as a designer who codes, while giving every project its own space, cover image, short context, and direct link.
Everything here is hand-coded with HTML, CSS, and JavaScript, without frameworks. The course started with basic HTML and CSS experiments and eventually moved into more complex interactive systems, including a browser extension.
The final page includes smooth scrolling, scroll-based skew animation on the project cards, light and dark mode, responsive layout, and metadata for the open web.
1. What Designer Can Do - https://astapable.github.io/manuscript/ What Designer Can Do is a response to the deliberately raw picture of a profession losing its cultural weight drawn in What Design Can’t Do — Graphic Design between Automation, Relativism, Élite and Cognitariat, by Silvio Lorusso does exactly that.
2. Evgenii × Zara - https://astapable.github.io/Evgenii-X-Zarah/ Evgenii and Zara team up for the collaborative design take on poetic crash course on the history of color by Cortney Cassidy.
3. F/ckts Anthology - https://astapable.github.io/binding/ F/ckts is the anthology showing that design has never been pure, impartial, or neutral. Together, the three texts reveal that design can exist only within systems of power and interest.
4. Mural in New York - https://astapable.github.io/links/ Murals in NYC is a curated collection of murals in New York City as moments of public expression focusing on the images, artists, history and places that shape them. These blocks document how murals function as as a way to reflect politics, neighborhoods, culture and change across the city.
5. Tendrils Browser Extension - https://astapable.github.io/functions/ Tendril turns any website into a quick design reference — inspect fonts, text styles, and colors in your browser side panel.
Key resources:
- GSAP ScrollTrigger (skew on scroll) — https://gsap.com/docs/v3/Plugins/ScrollTrigger/
- GSAP quickSetter (performance) — https://gsap.com/docs/v3/GSAP/gsap.quickSetter()
- Lenis smooth scroll — https://lenis.darkroom.engineering
Copyright 2024 The Geist Project Authors (https://github.com/vercel/geist-font.git) This Font Software is licensed under the SIL Open Font License, Version 1.1. https://openfontlicense.org