Building Careers with Knowledge

  • Project

    Website Redesign & Platform Modernization

  • Industry

    Education (Career Training & Post-Secondary)

Reeves College Website Hero
PIXELWALL Development

Revitalizing a Legacy: Strategic Redesign for a Modern Audience

Information Architecture
UX Redesign
Performance Optimization
Accessibility
SEO Migration
Challenge

Reeves College needed more than a facelift—the site had to guide prospective students from discovery to application with less friction. Content lived in inconsistent templates, some pages loaded slowly on mobile, and accessibility/SEO fundamentals had drifted over time.

Our main goal was to:

  • Unify design and content models across Programs, Campuses, Admissions, and Students.
  • Modernize motion and media without harming performance, LCP, or accessibility.
  • Preserve search equity with redirects and a clean IA; improve wayfinding.
  • Empower internal teams with modular templates and clear authoring guidance.
Strategy

We paired a template-first rebuild with a motion and content system designed for performance and clarity.

  • Template Architecture: 25+ reusable templates (Programs, Campuses, Admissions, About, Students) with shared includes (Header/Footer/Modals).
  • Motion System: A “calm-by-default” animation language—subtle, purposeful, and user-controlled—implemented with GSAP + IntersectionObserver.
  • Content Models: Delivery modes, categories, and media mapping refactored for consistency and automated rendering.
  • SEO Migration: URL strategy, sitemap automation, and redirect mapping to protect rankings during launch.
Motion System – Mobile Examples

Motion & Interaction Design

Animation should clarify, not distract. We introduced a motion system with three principles: guide focus, reinforce hierarchy, and respect accessibility.

  • Micro-interactions: Button and nav states use short, spring-like easing to confirm actions without visual noise.
  • Scroll-in reveals: Section headings and stat blocks fade/translate in at 10–15% viewport with IntersectionObserver; we pause animation when elements leave view to conserve CPU.
  • Program Cards: Image parallax (subtle, translateY 4–8px) indicates depth; reduced on mobile to protect scroll performance.
  • Hero kinetics: GSAP timelines orchestrate layered text and graphic entrances with staggered delays (60–120ms) to draw attention downward.
  • Respect preferences: All motion is disabled or simplified when prefers-reduced-motion: reduce is detected.

The result is a site that feels alive yet calm—motion supports comprehension, highlights CTAs, and never competes with program information.

Reeves College Mobile preview
Reeves College News preview
Reeves College Program preview

Performance & Accessibility

Core Web Vitals
Semantic HTML
Media Optimization
A11y-First Motion
How we kept it fast (and inclusive)
  • Core Web Vitals: Hero images are preloaded; below-the-fold media lazy-loads. We avoid layout shift by reserving aspect-ratios.
  • Modern formats: WebP/AVIF for images; MP4/H.264 with a poster image. SVG for logos/icons to keep them crisp and tiny.
  • Code splitting: Motion libraries load when needed; no animation JS blocks first paint.
  • Reduced Motion: Global CSS/JS checks honor system preferences and swap animated transitions for fades or instant states.
  • Semantics & ARIA: Landmarks, keyboard-focus outlines, and descriptive alt text across all templates.

Post-Launch Performance

Three months following the rebrand and technical overhaul, the data confirms a significant shift in user behavior and brand acquisition efficiency.

+119% New User Acquisition

A massive influx of top-of-funnel traffic was successfully absorbed by the new infrastructure without performance degradation.

+20.2% Key Conversion Events

Total high-value actions (applications and inquiries) rose significantly, proving the new UX guides users more effectively to the finish line.

+22% Average Engagement Time

Visitors arriving via search are spending nearly 1m 36s on the site, a clear indicator that our motion design and interactive animaions are capturing interest.

+57% Direct Brand Navigation

A surge in direct traffic confirms the rebranding has successfully increased brand recall and market presence.

PIXELWALL Scope & Deliverables

Engineering a Scalable Educational Platform

Architecture
SEO Strategy
UX/UI
Lead Gen
Technical Architecture

We delivered a robust, component-based ecosystem designed for a multi-campus institution where speed-to-market is critical.

  • Modular Component Library: 25+ dynamic, reusable templates that allow the Reeves team to spin up new program pages in minutes rather than days.
  • Performance Engineering: Implementation of advanced lazy-loading, WebP/AVIF image pipelines, and code-splitting to maintain sub-2-second load times.
  • SEO Integrity: Comprehensive sitemap automation and a 1-to-1 redirect mapping strategy that protected decade-old search equity during the transition.
Strategic Impact

Beyond the code, the redesign was a business transformation tool for the Admissions department.

  • Lead Optimization: Re-engineered the "Request Info" and "Take a Tour" flows, removing friction points that previously caused drop-offs.
  • Accessibility Compliance: Full WCAG 2.1 compliance audit, ensuring the site is navigable for all prospective students regardless of ability or device.
  • Analytics Instrumentation: Full GA4 Event tracking implementation to provide the marketing team with granular data on user journey bottlenecks.
PIXELWALL Testimonials

Stories

Collaboration in Motion

Weekly sprints with Reeves’ Marketing team ensured each template and motion pattern served a real user goal: clearer wayfinding, stronger CTAs, and faster paths to inquiry.

Credits

Client Team: Reeves College Marketing Team

Agency: Pixelwall — Strategy, Design & Development

Next Project