Payload CMS / Next.js Developer Needed to Complete and Upgrade Existing Nonprofit Website

Xiente is looking for an experienced Payload CMS + Next.js developer to complete and significantly improve an existing website that is already under development. This is not a website build from scratch. The website is currently running at: https://staging.xiente.org The project already has a substantial technical foundation, working CMS, integrations, infrastructure, and many frontend components. We need a developer who can review the existing codebase, preserve what is working, improve the architecture where necessary, and bring the website to a polished production-ready level. A major priority is transforming the current frontend into a modern, visually impressive website with a strong "WOW" experience. Our design direction is similar to: https://xienteweb-m7ntxwe6.manus.space This should be treated as a design and experience reference rather than something that must be copied exactly. Current Technology The existing project includes: Next.js 15 Payload CMS 3.87 React TypeScript MongoDB 7 DigitalOcean hosting DigitalOcean Spaces Nginx PM2 Sentry Stripe English and Spanish localization SEO functionality Drafts and versioning Scheduled publishing Redirect management Search Forms Reusable page-builder blocks Background jobs Custom Payload CMS admin experience The GitHub repository is private and will be shared with the selected developer for review. Main Objective We want to take the existing website from functional to exceptional. The final website should feel modern, dynamic, interactive, and polished while still being fast, accessible, responsive, and easy for Xiente staff to manage through Payload CMS. The project includes both: 1. Frontend/UI/UX improvements and 2. Technical completion and production readiness 1. Frontend Design and WOW Experience This is one of the most important parts of the project. The current site works, but it needs a much stronger visual experience. We want improvements such as: Modern page layouts Better visual hierarchy Strong typography Improved use of photography Better spacing and content presentation Smooth page transitions Scroll-based effects Reveal animations Hover effects Animated buttons and cards Subtle movement and micro-interactions Animated statistics/counters Image transitions Video integration Background video where appropriate Parallax or similar visual effects where appropriate Sticky or interactive content sections Dynamic hero sections Strong calls to action Improved navigation Better mobile experience Animations should enhance the experience without making the website slow or distracting. 2. Flexible Page Sections We want staff to have more flexibility when creating pages inside Payload CMS. Existing blocks should be reviewed and improved, and new reusable blocks should be created where needed. Examples include: Hero sections Full-width image sections Full-width video sections Video background sections Text + image sections Text + video sections Two-column sections Three-column sections Four-column sections Video column sections Card grids Program cards Service cards Statistics / impact sections Testimonials Staff/team sections Partner/logo sections Galleries Carousels/sliders FAQs Calls to action Forms Resource/download sections Featured stories News sections Events Related content sections Quote sections Timeline sections Custom banners For example, an administrator should be able to create a section with: Column 1: Video Column 2: Text or: Column 1: Video Column 2: Video Column 3: Video without requiring a developer to create a new page. The goal is a flexible component system that still maintains Xiente's visual standards. 3. Payload CMS Admin Experience The project already includes a customized Payload CMS admin experience. We want the developer to review it and improve it where appropriate. The CMS should be intuitive for staff who are not developers. Areas to evaluate include: Page editing experience Navigation Content organization Reusable blocks Field naming Help text/instructions Media management Page previews Draft/publish workflow English/Spanish content management SEO management Reordering page sections Selecting section layouts Managing videos Managing images Managing calls to action The goal is to give staff significant control over the website without giving them so much freedom that they can accidentally break the design. 4. Review Existing Code Before making major changes, we expect the developer to review the existing repository. Please evaluate: Code quality Project architecture Component architecture Payload CMS architecture Existing page blocks Duplicate or unnecessary code Responsive issues Performance issues Accessibility issues Security concerns Technical debt Existing integrations Deployment configuration We prefer to reuse and improve existing work rather than rebuild working functionality. If you recommend rebuilding an area, please explain why. 5. Existing Integrations Several integrations and frameworks are already implemented. Stripe Stripe Checkout and donation workflows are implemented in staging. Additional final testing may still be required. Sentry Sentry error monitoring is implemented and working. Microsoft 365 Most Microsoft 365 email configuration is already in place. Final OAuth configuration and transactional email testing remain. Salesforce A service framework exists, but credentials, mappings, and final workflow implementation are still required. Constant Contact Service integration exists but production OAuth/token lifecycle work remains. Eventbrite The service and synchronization framework exist but require credentials and final testing. The selected developer should review these integrations but should not unnecessarily rebuild working integration infrastructure. 6. Responsive Design Every page and component must work properly on: Desktop Laptop Tablet Mobile Special attention should be given to: Navigation Videos Columns Cards Typography Animations Forms Images Interactive components 7. Performance The visual improvements cannot come at the expense of performance. The developer should optimize: Next.js rendering Payload queries Images Video loading Fonts JavaScript CSS Animations Lazy loading Caching Page load performance Core Web Vitals where possible Animations should use efficient modern approaches such as CSS, Framer Motion, GSAP, or similar technologies where appropriate. 8. Accessibility The finished website should follow modern accessibility practices. This includes: Semantic HTML Keyboard navigation Accessible menus Form labels Image alt text Video accessibility Appropriate contrast Focus states Proper heading hierarchy Accessible animations and reduced-motion behavior 9. SEO SEO functionality already exists but should be reviewed as part of the frontend work. Pages should properly support: SEO titles Meta descriptions Open Graph information Social images Canonical URLs Slugs Structured heading hierarchy Sitemap/indexing requirements Appropriate metadata 10. Remaining Testing and Production Work The project is already operational in staging, but some production-hardening work remains. This includes areas such as: Browser E2E testing Expanded integration testing Deployment automation Post-deployment smoke testing Production environment preparation Deployment/rollback process Final staff acceptance Bug fixing Production launch Expected Deliverables The selected freelancer should deliver: Review of existing repository and architecture Recommendations before major development begins Improved frontend design Implementation of the agreed design direction Modern transitions and effects Reusable page sections/components Flexible image and video layouts Improved responsive design Improved Payload CMS editing experience Performance improvements Accessibility improvements Integration review and completion where required Bug fixes E2E testing of critical workflows Production-ready code Clean and maintainable architecture Deployment support Basic documentation/handoff Important Development Approach We are specifically looking for someone who will work with the existing project, not immediately recommend rebuilding everything. The project already contains substantial development work. We want someone who can identify: Keep: What is already well built. Improve: What works but needs refinement. Replace: What genuinely needs to be rebuilt. All new code should be clean, reusable, maintainable, and consistent with the existing architecture. Ideal Developer Strong experience with: Payload CMS 3 Next.js 15 React TypeScript Tailwind/CSS MongoDB Headless CMS architecture Responsive frontend development Animation libraries such as Framer Motion or GSAP UI/UX implementation Performance optimization API integrations Git/GitHub Production deployments Experience creating visually sophisticated nonprofit, corporate, agency, or storytelling websites is a major advantage. When Applying Please include: Examples of Payload CMS websites you have built Examples of visually sophisticated websites you have developed Your experience with Next.js Your experience implementing animations and transitions Your experience building reusable CMS page-builder components Your approach to reviewing an existing codebase before making changes Your availability Estimated timeline after reviewing the repository Whether you prefer fixed-price or milestone-based work Please do not provide a final quote solely from this description. We would first like you to review the existing website and repository so you understand how much has already been completed. Suggested Project Milestones We are open to recommendations, but a potential structure is: Milestone 1 — Codebase & UI Audit Review repository Review staging site Identify architecture/code issues Review Payload CMS structure Confirm frontend implementation plan Milestone 2 — Design System & Core Components Navigation Typography Buttons Cards Animation system Core reusable blocks Mobile standards Milestone 3 — Website UI/UX Implementation Implement page designs Add transitions and effects Improve imagery/video presentation Build new page sections Complete responsive layouts Milestone 4 — Payload CMS Improvements Improve admin experience Improve blocks Add flexible column/video layouts Improve editing and preview workflows Milestone 5 — Technical Completion Complete remaining integrations as agreed Performance improvements Accessibility SEO review Bug fixes Milestone 6 — QA & Production Launch E2E testing Cross-browser testing Mobile testing Production deployment Smoke testing Final fixes Documentation and handoff