ProjectsDecember 29, 2025

Mohamed Elbarry
image

Technologies used

Next.js
React
TypeScript
Tailwind CSS
Framer Motion

Overview

Designed and developed a high-performance agency website that delivers a fast, visually engaging experience. The goal was to create a responsive, SEO-optimized platform that represents an agency's brand while demonstrating technical capability using the latest web technologies like Next.js 16 and React 19.

Key Features

  • High-Performance Architecture: Built with Next.js 16 App Router and React 19 for aggressive code splitting, server components, and optimal speed.
  • Modern Design System: Styled with Tailwind CSS v4 for a utility-first approach, featuring dark mode support and a clean, hierarchy-focused aesthetic.
  • Advanced Animations: Integrated Framer Motion and Lenis for smooth scrolling, parallax effects, and scroll-triggered reveals that respect user motion preferences.
  • SEO & Accessibility: Fully optimized with semantic HTML, proper meta tags, Open Graph support, and WCAG-compliant color contrast and keyboard navigation.
  • Optimized Assets: Utilized Next.js Image and Font systems to eliminate layout shifts and ensure efficient loading across all devices.

Technologies Used

  • Next.js 16: App Router, Server Components, Image/Font Optimization.
  • React 19: Concurrent rendering, Server Actions.
  • TypeScript: Full type safety for components and API responses.
  • Tailwind CSS v4: Modern styling engine.
  • Framer Motion: Complex animations and gesture handling.
  • Lenis: Smooth scrolling behavior.

Challenges and Learnings

Focusing on performance from the start proved essential, as did prioritizing accessible design over retrofitting. Working with the latest Next.js features highlighted the importance of understanding server-side rendering nuances for effective implementation.

Outcome

The result is a lightning-fast, visually striking agency website that balances aesthetic appeal with technical excellence, ensuring a premium user experience across all devices.

HireUp - Freelance Marketplace

A high-performance, full-stack freelance marketplace featuring real-time messaging, secure payments, and role-specific dashboards.
Read case study
cAIlories — AI-Powered Calorie & Nutrition Tracking

Cross-platform (iOS, Android, Web) calorie and nutrition tracking app with AI-powered photo recognition to log meals from a single photo, in-app AI coach, gamification, and subscription monetization.
Read case study
Construction Company - Private Client Media Management

Developed a private web and mobile app for a construction company to help manage on-site media, allowing workers to capture and upload photos and videos with location assignment and access controls.
Read case study
Lumin Search - AI-Powered E-commerce Search Engine

Developed and integrated AI-powered search solutions for e-commerce platforms, focusing on semantic search features and real-time catalog syncing.
Read case study
Lumin AI - E-commerce Chatbot Platform

Developed and integrated AI solutions for e-commerce chatbot platform, including context-aware conversation flows and multilingual support.
Read case study