Int-Learn — Student-Teacher Matching Platform
Education · Web Platform

Int-Learn

A zero-to-one student–teacher matching platform — from blank canvas to 40+ page IA, dual-user experience, on-demand testing, and full brand identity

Client
Int-Learn Startup
Agency
Skywind Co.
My Role
UX/UI + Branding Designer
Timeline
2018
Platform
Web
Project Type
New Product
01 · Context

A startup with a clear vision — and nothing else

Int-Learn had a compelling idea: match high school students preparing for SAT/ACT with college graduate tutors from elite universities. The credibility angle was clear. The product structure was not. When the project began, there was no IA, no wireframes, no brand, no copy — just a founder's vision and a blank Sketch file.

This kind of zero-to-one challenge is where UX strategy matters most. Before a single screen could be designed, the platform's entire logic had to be invented — two user roles, two sets of goals, one coherent system that serves both without compromise.

Starting Point
Zero IA, zero wireframes, zero brand
Dual Platform
Student-facing + educator-facing, one product
Full Scope
UX + UI + brand identity + product copy
02 · Two Users, Two Worlds

One platform serving completely different motivations

A two-sided marketplace lives or dies by how well it serves each side. Students and educators come to Int-Learn with opposing mental models — one looking for trust and certainty, the other looking for autonomy and opportunity. Every design decision had to honour both simultaneously.

High School Students
SAT / ACT prep · Ages 15–18
Core anxiety"How do I know this tutor is actually good?"
  • Need verifiable tutor credibility before committing
  • Want subject-specific matching — not just "any tutor"
  • Require practice tests with real time pressure and instant results
  • Parents often involved in platform decisions
Elite College Graduates
Supplemental income seekers · Ages 22–30
Core motivation"I want flexibility and fair pay on my own terms"
  • Job-transitioning or repaying student loans
  • Want to set their own rates and availability
  • Prefer minimal admin overhead — just teach and get paid
  • Value the credibility signal of their university brand
03 · UX Strategy

Three decisions that shaped the whole design

Before touching UI, I mapped the platform logic. The key strategic question in a tutor marketplace is always trust — how does a student believe a stranger online is worth their time and money? The answer shaped the entire information architecture.

College Badges as Trust Currency
Rather than star ratings or reviews (easily gamed), the core credibility signal is the tutor's university — a verifiable, legible fact that parents and students immediately understand. The college badge is the first thing visible on every tutor card.
IA Before Wireframes
With no existing structure, I spent the first phase mapping every page type across both user roles before opening a design tool. The result: 40+ page types with clear ownership, hierarchy, and state logic — preventing chaos in the build phase.
Asymmetric Power, Symmetric Respect
Students choose tutors — so students hold more power. But the design never makes educators feel second-class. Tutors own their rates, their schedule, and their subject range. The product respects both sides as equal contributors to the marketplace.
Zero-to-one design note

Starting from nothing meant every page structure, every label, and every flow had to be invented. I also wrote the initial product copy — there was no copywriter on the team. Tone: warm but credible, approachable but not informal.

04 · Student Experience

Designed to reduce anxiety at every step

The student journey has one overriding goal: arrive at the right tutor with enough confidence to book. Each feature is a trust-building layer — eliminating doubt before it can block a decision.

Trust Architecture
Find the Right Tutor — Credibility First
The tutor discovery page leads with the university badge — not the name, not the rating. Students (and their parents) make snap judgements on academic credibility, so it's the first signal they see. Below the badge: subject tags, hourly rate, and a hover-preview card for fast scanning without clicking away.
  • College badge prominently displayed on every tutor card
  • Recommended lists reduce filter decision fatigue
  • Hover-card preview: availability + subjects before committing to a profile
Int-Learn — Student tutor discovery with college badges
Precision Matching
Browse by Subject — Filter by Major
Students preparing for specific SAT subject tests need a tutor who specialises — not just someone who "teaches math." The curriculum filtering system uses subject tags as the primary sort, with a double-major filter that surfaces tutors with multiple specialisations for complex test prep needs.
  • Subject tag filtering as primary navigation
  • Double-major filter for students who need cross-subject tutoring
  • Alternate speciality options surface tutors who match adjacent subjects
Int-Learn — Curriculum and subject filtering UI
Measurable Progress
On-Demand Practice Tests — Score & Compare
Practice tests are the clearest measure of whether tutoring is working. Students can launch a timed test at any point — not just during scheduled sessions — with authentic time constraints matching real SAT/ACT conditions. Instant results and historical comparison data make progress visible and motivating.
  • On-demand access — not gated behind scheduled sessions
  • Authentic time pressure matching actual test conditions
  • Instant score results with historical comparison chart
Int-Learn — On-demand practice test with score results
05 · Educator Experience

Autonomy as the core design value

College graduates join Int-Learn because it offers flexibility that traditional tutoring agencies don't. The design reinforces this at every touchpoint — educators set their own terms, own their schedule, and manage their content. The platform is a tool, not a boss.

Economic Independence
Set Your Own Rate — Own Your Subject Range
Tutors set their own hourly rate — a non-negotiable design requirement from the earliest discovery sessions. Beyond pricing, tutors select their active subject specialisations, creating a self-managed profile that reflects exactly what they're willing and able to teach. No fixed rate cards, no mandatory curriculum.
  • Custom hourly rate input with no platform-imposed ceiling
  • Multi-subject badge selection — breadth or depth, tutor's choice
  • Transparent earnings display per session and monthly
Int-Learn — Educator rate setting and subject selection
Flexible Schedule
Customisable Availability — Draft Content Tools
Scheduling is the most common friction point in tutoring marketplaces. Tutors here set availability by day and time block — not a fixed weekly calendar — accommodating the irregular schedules of people who are also working full-time jobs or studying. Draft quiz creation lets tutors build test content on their own timeline.
  • Availability set by day-of-week + time block — not fixed slots
  • Draft quiz creation tool with save and review states
  • Booking request approval flow — tutors retain final say
Int-Learn — Educator availability scheduling and quiz drafting
06 · Visual Design

Platform UI — student and educator views

The visual system uses teal as the primary credibility colour — calm, academic, trustworthy. Yellow accent breaks hierarchy and signals calls to action. Clean card-based layouts keep complex data readable on web.

Int-Learn — Full platform UI overview, screen 1
Int-Learn — Full platform UI overview, screen 2
Int-Learn — Full platform UI overview, screen 3
07 · Design System

Brand identity — colour, type, and logo logic

The brand needed to signal academic credibility without feeling institutional. Teal communicates trust and calm intelligence. Yellow provides energy and contrast — used sparingly for CTAs and highlights. Together they read as "approachable expertise" rather than cold authority.

#008B8B
Primary — Trust
#21D0C3
Secondary — Hover
#FAD24D
Accent — CTA
#1A1A2E
Foreground
#F5FAFA
Background
Body / UI
Noto Sans CJK TC
Bilingual body text (Traditional Chinese + English) — chosen for readability at small sizes and CJK support for the Taiwanese market
Scores / Data
Alcubierre
Score display, rankings, percentile labels — a slightly geometric sans that reads as data-precise without feeling cold
Logo design rationale

The Int-Learn wordmark uses a custom lettermark combining the "I" and "L" initials in a way that visually suggests a teacher and student facing each other — subtle, but grounded in the platform's core relationship. Teal as the logo colour reinforces academic trust without borrowing from any specific university palette.

Web EdTech IA from Scratch Two-Sided Marketplace Branding Trust Design Personas
Next project
Map of Chemical Knowledge
View case study