Product Designer & Next.js Developer (Full-Stack)

Project Purpose & Vision We are completely upgrading our B2B commercial finance marketplace, Welcome Finance, which targets UK Limited Companies and LLPs looking for unregulated financial solutions (Working Capital, Growth Finance, Invoice Finance, Asset Finance, and Commercial Mortgages). We are moving completely away from traditional informational website layouts. We want to create an interactive, workspace-style design optimized intensely for mobile devices. The conversion action is straightforward: users engage with our clean comparison blocks or calculators, click a CTA, and seamlessly land on our pre-built external application form URL. Your Responsibility: You will own both the UI/UX design phase (creating high-fidelity interactive mobile/desktop layouts) and the technical development phase (Next.js frontend + Headless CMS setup). The Ultimate Handover Goal: Once deployed, our Head of SEO must be 100% self-sufficient. You must architect the headless CMS (e.g., Sanity.io or Strapi) so that our SEO team can visually launch new product pages, spin up blogs, alter comparison tables, and inject schema scripts without ever needing to contact you for code changes. Scope of Work & Deliverables 1. Phase 1: UI/UX Mobile-First Design • Deliver high-fidelity interactive wireframes/mockups (Figma preferred) for our 15+ core product pages, home page, resource hub, and blog layouts. • Prioritize an "action-first" mobile interface—replacing dense text walls with interactive product comparison cards, clean grid matrices, data badges, and progressive disclosure toggles. • Incorporate our existing branding assets into a polished, modern B2B financial workspace aesthetic. 2. Phase 2: Next.js Frontend Development • Translate approved designs into pixel-perfect Next.js (App Router) code using TypeScript and Tailwind CSS. • Achieve an automated Google Lighthouse/Core Web Vitals mobile score of 95+ out of the box via robust Server-Side Rendering (SSR). • Develop two interactive frontend utilities natively in JavaScript/React: An Indicative Multi-Product Repayment Slider and a 3-Tap Dynamic Eligibility Multi-Box. 3. Phase 3: Modular Headless CMS Integration • Configure a headless CMS (e.g., Sanity.io or Strapi) structured with reusable block-based schemas. • Expose raw configuration fields to the CMS so the SEO Lead can dynamically rearrange homepage blocks, edit grid matrix rows, update lender parameters, and inject raw JSON-LD schema metadata scripts independently.