Zane St. John
I'm Zane, and I build what matters to me.
This website used to be about making people smile. I constructed an identity around service, crafted every project to delight others, and positioned myself to solve other people's problems.
That changes today.
I build what matters to me. My most meaningful work happens when my interests align with solving actionable problems.
I'll still keep a finger on the pulse of culture, community, and compassion to know where and when I can create radical impact.
I won't lose myself in the pursuit of others' joy.
But I refuse to stop shipping.
If you're short on time, or if you're just trying to get in touch, here are a few quick links:
I'm a Stanford undergrad studying symbolic systems.
I'm also building in stealth, leveraging agents to create pixel-perfect design-to-code conversions.
Previously, I have built software and done creative work in:
- Generative AI for government, leading the engineering of a startup using LLMs/RAG to bring vast amounts of data to the fingertips of city governments.
- Experiential marketing, in which I helped design, engineer, and run booths at Coachella, Anime Expo, and Mecum Auctions
- Web3/Crypto, developing software/dApps for a number of companies and DAOs
When I'm not doing any of that, I'm often wearing hats like software engineer or creative technologist.
For the most up-to-date information on my work, please see my LinkedIn.
I also own a couple Gen-Z, brainrot-inspired domain names. For now it's just sdiybt.com, abhtcaq.com, and abarbershophaircutthatcostsaquarter.com. More soon, maybe!
Here are some solo projects of mine from the past few years, ranging from serious and elaborate to downright silly.
Viral clothing brand at Stanford
- Product Design
- eCommerce
- Print-on-Demand
- Marketing
In April 2023, Stanford ResEd changed the names of the University's controversial residential neighborhoods, using names chosen by the student body.
As many of us noticed, putting together the respective first letters of the new names spell out “SHAGWORM.” So the very next day, I set up an online storefront to sell SHAGWORM merchandise parodying official Stanford neighborhood merchandise: T-shirts, hats, backpacks, and even underwear.
I announced the store on Fizz (student social media), and within weeks, the site reached 4-figure revenue and made it onto the front page of the Stanford Daily.
Official site for Stanford a cappella
- TypeScript
- React
- Next.js
In partnership with Stanford's A Cappella Council, I built acappella.stanford.edu (formerly StanfordACappella.com), the university's official hub for all things a cappella.
Using the site, members of the Stanford community can find information about each a cappella, including genre, voice parts, and upcoming performances. During audition season, students can also seamlessly sign up to audition for the groups of their choice.
Thanks to the collective marketing and publicity efforts of Stanford's ten a cappella groups, the site receives thousands of pageviews and impressions during peak audition week, keeping the Stanford community informed on auditions and performances.
Auto-generated lecture notes
- AWS CDK
- ECS
- PostgreSQL
- TypeScript
- Node.js
In winter of my sophomore year, I took SYMSYS 1: Minds and Machines, a “flipped classroom”-style course, in which lectures are watched asynchronously prior to class meetings. While I thoroughly enjoyed the course material, I realized I didn't usually need to watch the entire lecture video (~40-60 minutes each) to glean relevant insights.
So, for my final project in CS 40: Cloud Infrastructure and Scalable Application Deployment, I built LectureHero, a cloud-based service to generate concise, informative lecture notes for Panopto course videos.
After writing the core application, I deployed LectureHero using AWS CDK Infrastructure-as-Code written in Python, using Fargate and Aurora (among other technologies) to ensure elasticity and scalability across the stack.
Learn more about the infrastructure and tech stack in the README!
Popup experiential promo at Stanford
- TypeScript
- React
- Image Processing
- Experiential Design
In spring quarter of my sophomore year, I designed a candy-filled experience to promote Fleet Street's 2024 Spring Show, FLEETHEARTS.
Passersby could stop by to create a custom box of candy with their face on it. Optionally, using my custom-coded photo booth and editor, users could add text and drawings to their design to further personalize. We then printed their design out and stuck it to a delicious box of conversation hearts.
In under three days, we distributed five pounds of candy to members of the community, driving hundreds of additional impressions on our website and Eventbrite.
Barbershop tags on your flip phone
- JavaScript
- Vercel
- Mobile Development
In my freshman year, the amazing Fleet Street community introduced me to barbershop tags. They're so fun to sing with a group of friends!
Trouble is, I briefly switched to a flip phone mid-year. Though it was great for my mental health and time management, the flip phone annoyed the hell out of anyone who wanted to get ahold of me. Worse yet, I couldn't access my beloved barbershop tags!
Eventually, the awkwardness of attempting to sing tags without sheet music was simply too much. Half an hour and a bottle of Dunkin' Iced Coffee later, tinytags was born!
tinytags is a shiny frontend for BarbershopTags.com, designed for flip phones. Assuming your dinky phone's web browser knows what a KeyboardEvent is, you're all set to pan, zoom, and sing!
PSA: For those of you on standard smartphones, many of the best barbershop tags are accessible through the free goodtags app.
Interactive AI-generated comedy
- OpenAI
- Node.js
- React
I made FleetGPT for Fleet Street's 2023 Spring Show. The idea was that the audience would suggest topics for a skit (in this case, person, place, and thing), and the program would use OpenAI to brainstorm and then generate an original skit. A few of us then performed the skit before the audience, never having read it before.
Given the topical nature of ChatGPT at the time, the skit was a hit! Fun fact for my Stanford folks: I wrote most of the UI code for this over a two-hour breakfast at Lakeside!
Scheduling for the COVID era
- Node.js
- MySQL
- Mobile Development
In March 2020, students at Windward School transitioned to remote learning to slow the spread of COVID-19. While students and teachers adapted impressively to the sudden change, many found it difficult to keep track of their schedules in this entirely different learning experience.
In response, I created Schoop, an open-source schedule app designed for the remote-learning era. Windward students could enter their classes and Zoom links, and each day they would see a personalized schedule.
Shoutout to Elliot for creating an awesome Google Calendar integration!
If you want to reach me about anything, please feel free to email me at hey [at] zanestjohn [dot] com.
If that doesn't work, feel free to go looking for me on campus — I'm not great at hide-and-seek!
P.S. Thanks for helping me contribute to the website obesity crisis!
I'll come back through at some point and pare down half the videos and images.
Wow! So this is what it feels like to be printed on paper. :)