Pay4Me is a cross-border payment platform that streamlines tuition, SEVIS, and visa application fee payments for international students. Although the platform is operational, its website would benefit from a redesign to enhance user experience, build trust, and increase conversions.

Although functional, the Pay4Me website presented multiple friction points that hindered user experience:

Overloaded hero section: Two phone mockups + two buttons + badges create visual clutter and unclear direction.

Low-resolution testimonial carousel: User video thumbnails are blurry, which undermines trust.

Text-heavy sections with weak hierarchy: Core features and benefits are buried in blocks of small text.

Non-interactive elements: Logos and icons (e.g., school affiliations, payment categories) are static and provide little context.

Missing onboarding pathway: No clear steps or flow explaining how the service works from sign-up to successful payment.

Hero Section: Competing elements (videos, phones, buttons) make the focus unclear.

Testimonials: Grainy videos don't visually communicate credibility.

Payment Info: Important sections like "Pay for SEVIS, WES, Visa..." are buried and styled like secondary content.

FAQs & Blogs: Disconnected design. FAQs feel generic, and blog cards lack category grouping or preview text.

I wasn’t sure what the platform did until I scrolled halfway through."

I didn’t trust the video reviews because the low-quality images looked fake at first.

There’s no pricing or onboarding walkthrough (do I have to download the app before knowing what it costs?)

Simplify Navigation (Help users find key info faster).

Clarify Value Proposition (Instantly communicate what Pay4Me offers).

Strengthen Trust (Use sharp visuals, verified testimonials, badges).

Improve Visual Hierarchy (Guide users naturally with clean layout and spacing).

Increase Mobile Usability (Optimize all components for touch interaction).

Simplified the navigation for easy access to core services.

Improved layout spacing and flow to prioritize readability and reduce cognitive load.

Optimized layout for mobile responsiveness, ensuring consistency across devices.

Refreshed the design with a clean, modern aesthetic using whitespace, subtle gradients, and consistent iconography.

Aligned the color palette with Pay4Me’s brand identity (green, black, and white) for a more unified look.

Replaced generic illustrations with custom graphics and mobile mockups showcasing real user scenarios.

Created a visually consistent testimonial section with polished video thumbnails and name badges.

Refined the homepage headline and subtext to clearly communicate the platform's purpose in under 10 seconds.

Reorganized key content blocks (SEVIS, Visa, WES payments) for faster scanning and comprehension.

Enhanced FAQs with categorized questions and improved clarity in answers.

Upgraded all testimonial visuals to high-resolution with real names.

Moved the partner and payment provider logos (Stripe, Paystack, Techstars) above the fold for visibility.

Added a “Why We Built Pay4Me” explainer video with real user context to humanize the brand.

Compressed and optimized images and videos to reduce load time.

Improved core web vitals (LCP, CLS, FID) by restructuring the DOM and lazy-loading media.

Ensured WCAG 2.1 compliance with proper contrast ratios, focus indicators, and keyboard navigation.

Added alt tags for all images and ARIA labels to enhance screen reader compatibility.

Improved user engagement and conversion rates.

Enhanced credibility and trust in the platform.

A smoother payment experience for international students.