Alexander Grattan
I create playful experiences.
![Portrait of Alexander Grattan](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Falexander-grattan.3457b7a9.jpg&w=828&q=75)
Alexander Grattan / Software Developer
My Blog
My Projects
![Artificial Unintelligence](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FArtificial_Unintelligence.38ac15a7.png&w=3840&q=75)
Artificial Unintelligence
Online multiplayer game where players compete against each other to create the funniest AI-generated images.
Tools used:
- React/Next.js
- TypeScript
- Express.js
- Socket.io
![Food Phantoms](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FFood_Phantoms.5aa115a5.png&w=3840&q=75)
Food Phantoms
Web app to find if a restaurant on Doordash or Uber Eats is a ghost kitchen or a virtual kitchen where the food served originates from an unexpected establishment.
Tools used:
- Preact/Fresh
- TypeScript
- Deno
- Golang
![Big Burgh Redesign](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fbig-burgh.4fe75128.png&w=3840&q=75)
Big Burgh Redesign
A new design and construction of the Big Burgh app (not an official redesign) used to help Pittsburgh natives find resources such as food and shelter.
Tools used:
- React Native/Expo
- TypeScript
- Styled Components
![Secret Pittsburgh](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsecret_pittsburgh.5432027d.png&w=3840&q=75)
Secret Pittsburgh
Website for the Secret Pittsburgh class at the University of Pittsburgh (ENGLIT 1412) dedicated to uncovering hidden spaces and unusual places in the city of Pittsburgh.
Tools used:
- React/Gatsby
- Tailwind CSS
![Grademyaid](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FGradeMyAid.01d5ff9a.png&w=3840&q=75)
Grademyaid
Application that allows students to grade their college financial aid packages using data from the US Department of Education.
This was built for Pitt CSC Hacks, a competition sponsored by the University of Pittsburgh's Computer Science Club.
Tools used:
- React
- Framer Motion
- Scss
![Grosseries](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fgrosseries.b3c390df.png&w=3840&q=75)
Grosseries
A mobile app that helps individuals to track expiration dates and the inventory of their food, a group project for the University of Pittsburgh's CS1635 created with the app development framework, Flutter.
Tools used:
- Flutter
![Pollock Is Sh!t](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FPollock_Is_Shit_Screenshot.81fc2e63.png&w=3840&q=75)
Pollock Is Sh!t
Web app that manipulates image data to create a Pollock-like painting (because literally anyone could've been Pollock).
Tools used:
- React/Next.js
- Tailwind CSS
- p5.js
![Belly Button Chrome Extension](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FBelly_Button_Design.6b63d302.jpg&w=3840&q=75)
Belly Button Chrome Extension
Browser extension that helps developers and accessibility engineers inspect a website's buttons and determine if they follow HTML standards and Web Content Accessibility Guidelines (WCAG).
Tools used:
- HTML
- CSS
- JavaScript
- Chrome API
![Allegory of the Cave](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FAllegory_Cave_Screenshot.b8363770.jpg&w=3840&q=75)
Allegory of the Cave
An experiment where I created an audiovisual experience with an interactive 3D sun. Created for the University of Pittsburgh's ENGCMP 1130 class.
Tools used:
- HTML
- CSS
- JavaScript
- Three.js
![Virtual Safari](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FVirtual_Safari_Screenshot.bc0f8f84.png&w=3840&q=75)
Virtual Safari
A recreation of Timon and Pumbaa's Virtual Safari, a choose-your-own adventure from The Lion King DVD.
I edited the choices into individual clips using the video editor, DaVinci Resolve, and used JavaScript to develop the site interaction.
Tools used:
- HTML
- CSS
- JavaScript