Design Engineer

Remote Opportunity –

Long-Term Project PartnershipCoders Ready is looking for a highly skilled Senior Next.js Developer / Design Engineer to lead the rebuild of a modern, high-performance educational platform.

This is not a template-based website project. We are looking for a developer who can build visually impressive, performance-focused web experiences comparable to premium modern SaaS brands.

About the ProjectWe are rebuilding a complete multi-locale educational platform focused on modern UI/UX, performance, SEO, and interactive lead-generation tools.

The platform serves international users and requires:

·      Mobile-first architecture

·      High-performance frontend engineering

·      Strong animation and motion design

·      SEO-safe migration of existing content

·      Scalable CMS architecture

·      Interactive tools and conversion funnels

The website must communicate value clearly within seconds while maintaining premium design quality and smooth user experience.

What We Are BuildingA multi-locale animated marketing website replacing an existing WordPress-based setup.

Tech

Stack·      Next.js (App Router)

·      TypeScript

·      Tailwind CSS

·      GSAP

·      Lenis

·      Framer Motion

·      Vercel Hosting

·      Headless CMS (Sanity / Storyblok / Headless WordPress preferred)

·      next-intl for internationalization

Launch Deliverables (~4 Months)Initial Launch Includes·      12 page templates covering approximately 200 existing URLs

·      4 English locales initially (architecture must support future expansion)

·      Homepage and core templates provided as HTML mockups

·      Remaining templates designed and developed by the selected developer

·      SEO-safe migration of top traffic pages

·      301 redirect mapping and sitemap handling

·      Structured data implementation

·      Hreflang implementation

·      Advanced lead forms and qualification flows

·      HubSpot integration

·      GTM + Meta Pixel + GA4 setup

·      Lighthouse mobile score target: 90+

·      SEO score target: 95+

Additional Features During

Launch & RetainerThe selected developer will also build:

Interactive Lead Generation ToolsExamples include:

·      Predicted grade calculators

·      University matching tools

·      Admissions probability calculators

·      Interactive React-based tools

Quiz Funnels·      Multi-step quizzes

·      Lead capture flows

·      CRM integration

·      Conditional branching logic

Blog System·      CMS-managed blogs

·      Categories and filters

·      Related article system

·      Author pages

Event & Webinar Flows·      Registration systems

·      Calendar invites (.ics)

·      Email automation and reminders

Campaign Landing PagesReusable marketing templates for campaigns and launches.

Custom Features·      Geo-personalization

·      A/B testing

·      Additional analytics integrations

·      Expansion into more locales

Design ExpectationsThis is a design engineering role.

The project uses HTML mockups instead of Figma handoff files.

The developer is expected to:

·      Translate provided HTML mockups into production-quality Next.js applications

·      Improve spacing, typography, animation timing, and visual polish where needed

·      Extend the established visual language across new templates

·      Make thoughtful UX/UI decisions independently

Strong design judgment is required.

Project PhasesPhase 1

(3–4 Weeks)·      Stack setup

·      CMS schema creation

·      Design tokens

·      Component scaffold

·      Homepage build from provided HTML

·      Initial staging deployment

·      Weekly demos

Phase 2

(6–8 Weeks)·      Remaining templates development

·      SEO page migration

·      Forms and analytics setup

·      Structured data

·      Mobile QA

·      Performance optimization

Phase 3

(~2 Weeks)·      Performance optimization (LCP, INP, CLS)

·      SEO audit

·      Redirect handling

·      CMS training

·      Final handover

·      Soft launch support

Phase

4 (Ongoing Retainer)·      Long-tail migrations

·      Additional SEO pages

·      Interactive tools

·      Event systems

·      Localization expansion

·      Feature development

Required ProfileStrong Fit RequirementsTechnical Skills·      3+ production projects using Next.js App Router and Tailwind CSS

·      Strong TypeScript knowledge

·      Experience with GSAP and advanced motion/animation

·      Understanding of Core Web Vitals (LCP, INP, CLS)

·      Experience with headless CMS architecture

·      Experience deploying on Vercel or Netlify

·      Experience building multi-locale websites with hreflang support

Development ExperienceCandidates should have experience building:

·      Interactive React tools

·      Multi-step quiz systems

·      CRM integrations

·      Blog systems with filtering

·      Event signup flows

·      Custom plugins/features

Additional Expectations·      Strong design judgment

·      Excellent written English communication

·      Async collaboration experience

·      Problem-solving mindset

·      Ability to suggest better technical solutions

Portfolio ExpectationsYour portfolio should demonstrate:

·      High-quality animations

·      Modern responsive design

·      Strong mobile performance

·      Real production deployments

·      Lighthouse mobile score above 90

Not a Good Fit If·      Portfolio is mostly Elementor / Divi / WPBakery websites

·      No recent Vercel or Netlify deployments

·      Cannot demonstrate strong Lighthouse scores

·      Prefer pixel-perfect copying over design thinking

·      Refuse paid trial work

·      Require traditional Figma handoff workflow

·      Lack experience with production-grade Next.js applications

What to SubmitInterested developers must submit all of the following:

1. Three Portfolio LinksPlease include:

·      Live URLs only

·      Your role in each project

·      Tech stack used

·      CMS used

·      One sentence explaining what is notable about each project

Requirements:

·      At least one project with substantial animation work

·      At least one project using headless CMS

·      At least one live production website with real traffic

2. Lighthouse Mobile ScreenshotSubmit a PageSpeed Insights screenshot from your best portfolio project.

Minimum expected mobile performance score: 90+

3. One Professional ReferenceInclude:

·      Client/company name

·      Contact email

·      Phone number

·      Project duration

·      Short description of work completed

4. Written Responses to the Following QuestionsQ1How would you migrate approximately 200 existing SEO pages from WordPress without losing rankings?

Please explain:

·      Redirect strategy

·      Sitemap handling

·      Week-one migration process

·      SEO preservation techniques

Q2How would you architect a multi-locale Next.js website with shared content and region-specific customization?

Please explain:

·      CMS structure

·      URL structure

·      hreflang implementation

·      Locale scalability

Q3Choose one project from your portfolio and explain the best animation or motion design decision you made.

Include:

·      Why it worked

·      Performance considerations

·      Accessibility considerations

·      Mobile optimization considerations

Q4Study premium educational or SaaS websites and identify three ideas you would implement or improve in this project.

Focus on:

·      Information architecture

·      Motion design

·      Conversion optimization

·      Lead generation

UX improvements