TransferReady

Inspiration

Every year, over 100,000 California community college students dream of transferring to a 4-year university, but the journey is riddled with obstacles. Students navigate dozens of websites—assist.org for articulation agreements, individual university portals for requirements, separate platforms for internships and mentorships—all while trying to understand complex transfer requirements and deadlines. Nearly half of aspiring transfer students don't make it, not because they lack ability, but because the process is confusing, fragmented, and overwhelming.

We saw friends and classmates struggle with questions like:

“Which courses do I need to transfer to UC Berkeley for Computer Science?”
“When are the application deadlines?”
“Are there internship opportunities in my field?”

The information exists, but it's scattered across multiple platforms, buried in PDFs, and often outdated.

We knew there had to be a better way. What if we could create a single, intelligent platform that guides students through their entire transfer journey—from course planning to career opportunities—with the help of AI? That's how TransferReady was born.

What it does

TransferReady is an AI-powered transfer assistant that transforms the chaotic college transfer process into a clear, guided journey.

4-Step Profile Builder

Students complete an intuitive card-based form:

Select their current community college (searchable database of all CA colleges)
Choose target universities (can select multiple schools to compare)
Pick their intended major
Review and confirm their profile

TransferReady Assistant

A context-aware AI chatbot that knows the student's profile and provides personalized guidance:

Transfer Requirements: Pulls live data from assist.org's official API to show exact course articulation agreements.
Internship Discovery: Searches our curated database of 2026 opportunities filtered by major, location, and season.
Mentorship Programs: Surfaces community-college-friendly mentorship programs, with filters for cost and format.
Natural Language Queries: Students can ask anything in plain English and get streaming AI responses with markdown formatting.
Quick Actions: One-click shortcuts for common queries like “What are the transfer requirements?” or “Find internships in my field.”
Seamless Navigation: Students can switch between the profile form and chat interface while preserving their conversation state.

Tech Stack

Frontend: Vanilla JavaScript, Swiper.js for card animations, Marked.js for rich text, custom cursor with ripple effects.
Backend: Flask REST API integrating with assist.org, internship databases, and mentorship programs.
AI: Cloudflare Workers AI with streaming responses for real-time, conversational guidance.
Data: Live integration with assist.org plus curated JSON databases for internships and mentorships.

How we built it

Research & Planning

Talked with current and aspiring transfer students to understand their biggest pain points.
Mapped the end-to-end transfer journey and identified three core services:
- Transfer planning
- Internship discovery
- Mentorship matching

Backend Infrastructure

Built a unified Flask REST API with three modules:
- Transfer API to call assist.org’s REST endpoints and fetch real-time articulation agreements.
- Internship API to query our structured database of 2026 internship opportunities with filters for major, season, and location.
- Mentorship API to search CC-focused support programs with filters for cost and delivery format.
Scraped and cleaned data from multiple sources into normalized JSON schemas.
Implemented CORS and a simple auth layer so the frontend can talk to the APIs securely.

Frontend Experience

Designed a card-based UI with Swiper.js to create a layered, app-like flow for the 4-step profile builder.
Implemented smart search with:
- 200ms debouncing for smooth typing
- Relevance sorting so results starting with the query appear first
- Live filtering across 250+ California community colleges
Built multi-select chips for target universities so students can compare multiple destinations.
Created a custom cursor system with smooth following animations and click ripples to make the app feel premium.
Developed a full-screen chat interface that slides in from the center with a blurred backdrop.

AI Integration

Connected to Cloudflare Workers AI to power the TransferReady Assistant.
Implemented streaming responses so answers appear word-by-word instead of waiting for a full response.
Built Quick Actions that package the user’s profile into pre-written prompts (“List my transfer requirements”, “Find internships for my major in San Diego”).
Made the assistant context-aware: every query includes the student’s community college, target universities, and major so answers are tailored.

Polish & Optimization

Tuned animations with cubic-bezier curves and ~600ms card swipes to feel responsive but deliberate.
Solved inconsistent card heights by switching to a fixed-height (520px) card with internal scrolling.
Limited search results to 8 items with a 240px scrollable container for readability.
Added responsive breakpoints so the layout works on desktop, tablet, and mobile.
Used localStorage to persist the student profile between sessions.

Challenges we ran into

1. Dynamic Card Heights with Swiper.js

Getting cards to maintain consistent heights in a stacked layout while still allowing internal scrolling turned out to be trickier than expected. Our first attempt used JavaScript to calculate heights dynamically, which caused janky transitions. We eventually settled on fixed-height cards with scrollable content, which solved both the layout and animation issues.

2. assist.org API Integration

assist.org’s REST API is not heavily documented and different colleges sometimes appear under multiple name variations. We had to reverse-engineer the endpoints, normalize school names, and handle edge cases where multiple matches appeared. The result is a scraper and wrapper that gracefully handles these inconsistencies.

3. Search Performance

Searching over 250+ colleges with instant updates initially caused noticeable lag. To fix this we:

Added 200ms input debouncing
Capped results at 8 entries
Implemented a custom relevance sort (prefix matches first, then substring matches)

This turned choppy search into a smooth experience.

4. Context Preservation

Students needed to jump between the profile builder and chat without losing progress. We used localStorage to persist profile data and kept chat state in memory. The tricky part was handling the “Back” button from chat: we reset the conversation while leaving the profile untouched so the user never has to re-enter information.

5. AI Response Streaming

To support streaming AI responses, we had to handle chunked transfer encoding, decode partial text, and update the DOM incrementally. We used a TextDecoder in stream mode plus requestAnimationFrame to append new text smoothly without blocking the UI.

6. Mobile Cursor & Layout

Our custom cursor looked great on desktop but hurt usability on touch devices. We added media queries to disable it on smaller screens and adjusted the chat layout to become a full-screen overlay on mobile, with larger hit targets.

Accomplishments that we're proud of

✨ A polished, app-like UX: The card-based flow, subtle gradients, and custom cursor make TransferReady feel like a native product, not a quick demo.
🎯 Real, official data: We hook into assist.org to pull live articulation agreements, so students see information they can actually rely on.
🤖 Context-aware AI assistant: The chatbot understands each student’s college, major, and target universities and uses that context to answer detailed questions.
🚀 End-to-end solution: Instead of solving a single slice, we support the entire funnel—requirements, deadlines, internships, and mentorships—inside one interface.
⚡ Performance-focused implementation: Sub-100ms search responses, fast AI response start, and smooth 60fps animations across devices.
📱 Responsive and accessible design: Works smoothly on desktop and mobile with touch-friendly controls and clear visual hierarchy.
🎨 Attention to visual detail: Carefully tuned typography, spacing, and motion make the experience feel trustworthy and welcoming for students.

What we learned

Technical

How to integrate and stabilize undocumented third-party APIs.
Best practices for streaming AI responses in the browser and keeping the UI responsive.
Using modern CSS techniques, transforms, and requestAnimationFrame for performant animations.
Managing client-side state without a big framework, combining in-memory state with localStorage.
Practical search optimizations: debouncing, relevance scoring, and pagination.

Design & UX

Progressive disclosure works: breaking the onboarding into 4 small steps kept students from feeling overwhelmed.
Instant feedback matters: micro-animations, hover states, and loading indicators go a long way toward making the experience feel responsive.
Context is everything: The more context the assistant has (school, major, goals), the more useful and trustworthy the answers feel.

Product & Team

Talking to real students early quickly corrected our assumptions and simplified the UI.
Testing on real phones, not just the browser’s responsive mode, revealed issues like the custom cursor on mobile.
Clear role