- Client
- MyTassel
- Role
- Design & Development
- Timeline
- 3 months
- Year
- 2024
- Category
- Web Platform
Overview
MyTassel is a graduation platform: events, registry, sharing, graduate dashboard. Expo web on Firebase `my-tassel`, Stripe, Twilio SMS (A2P), Mapbox geocoder. Live: mytassel.com; staging mytassel-staging.web.app.
Why
Graduation week was texts, Instagram, and an Amazon list. Families needed one link for the event, the registry, and the announcement. MyTassel is that hub: graduate dashboard, shareable event/yearbook pages, registry, Stripe, and Twilio A2P SMS reminders.
Relevant to any lifecycle consumer product (weddings, grads, reunions) where the public page and the graduate’s ops have to stay in sync. Meeting notes in our own studio still extract onboarding, announcements, registry, and grad-fund work as real surfaces — not brochure copy.
The challenge
Graduates were coordinating celebration through texts, social posts, and wish lists — no single place for announcements, event details, and gifts.
What made it hard
- Graduation week was texts, Instagram, and an Amazon list.
- Families needed one link for the event, the registry, and the announcement.
- SMS reminders had to be real (Twilio A2P), not a wish.
Approach
Hub + events + registry + share pages, with Stripe for payments and Twilio for reminders. Admin, blog, tutorials, and Why MyTassel support the public story.
Process
- Graduate loop: Dashboard, events, registry, share.
- Family loop: Public event pages and registry.
- Ops: Admin, SMS, Stripe, affiliates hooks in code.
What we built
- Event + yearbook pages: Shareable graduation events instead of a Facebook post.
- Registry: Gifts in the same product as the announcement.
- Graduate dashboard: One place to run the week, not four apps.
- SMS + payments: Twilio reminders and Stripe checkout in the stack.
How it was built
Expo web on Firebase `my-tassel`, live mytassel.com, with a hybrid ops story: Expo client plus a Node server (Babel → PM2 on EC2 / nginx) and staging on mytassel-staging.web.app. Stripe for registry checkout. Twilio SMS (A2P) for reminders. Mapbox geocoder for locations.
Public event pages cover RSVP, countdown, poll, map, and timeline. Registry includes catalogue, goals, eCards, yearbook, and contribution/checkout. Graduate dashboard runs gifts, stats, yearbook messages, and event management. Admin, blog, tutorials, Why MyTassel, share, and contact support the public story. Affiliate hooks exist in code. Tech-lead assignment in our internal tooling is Daryl Ong — the product is in active build.
Stack
- Expo Web: Graduation web app
- Firebase: my-tassel hosting
- Stripe: Payments
- Twilio: A2P SMS
- Mapbox: Geocoding
Outcomes
- Live: mytassel.com
- 3-in-1: Events, registry, announcements
- SMS: Twilio reminders
- Live: mytassel.com
Wins
- Live platform at mytassel.com with staging on Firebase Hosting and an EC2/nginx API.
- Events, registry, and announcements as one graduate hub.
- Twilio A2P SMS reminders, not a wish-list notification.
- Stripe checkout and Mapbox geocoding in the same product.
Hard parts
- Four apps for one week: Texts, social, and a wish list are not a product. Families needed one link.
- SMS that actually sends: Twilio A2P had to be real. Fake reminders would have burned trust on the most important week.
- Graduate vs family loops: Ops dashboard and public pages share data without exposing the wrong surface to the wrong person.
Services
- Web Application
- UI/UX Design
- Registry System
- Event Management
- Social Sharing