Arabic and English interface with proper RTL/LTR switching
Case StudyVercel - Production
Bayoumy Co.
A bilingual Arabic/English corporate website for Mohamed Abdelwahab Bayoumy Company. I built a polished construction-company presence with responsive layouts, motion-led presentation, optimized imagery, multi-step forms, and technical SEO that helps the brand show up clearly across devices and search.
Frontend Stack
- Next.js
- React
- TypeScript
- Tailwind CSS
- Framer Motion
Performance
- Static generation for heavy marketing pages
- Next.js Image optimization for banners and galleries
- Code splitting so non-critical UI loads later
- Font loading with next/font
- Prefetching for the main internal links
Quality & Reliability
- TypeScript models for bilingual content, forms, and UI props
- Clear form validation and anti-spam protection
- Consistent layout behavior across screen sizes
- Career and supplier forms sent through a dedicated email integration
Key Features
Corporate layouts that stay clear on mobile, tablet, and desktop
Page transitions and small interactions with Framer Motion
Image optimization with Next.js Image and modern formats
Multi-step career and supplier forms with clear validation
Project gallery with search and category filters
Technical SEO with metadata, sitemap, and structured data
Gold, dark, and light themes for a consistent brand look
Frontend Architecture
Bilingual page routes and shared layouts Reusable UI and section components Motion and interaction layer Theme, language, and loading contexts Optimized static media assets
UI Engineering Strategies
- Keep marketing pages static, and add interactivity only where it helps
- Reusable React components for corporate sections
- Bilingual routing and metadata that search engines can follow
- Next.js Image pipeline for responsive photos
- Motion that supports the brand without getting in the way
- Form UX with spam protection and clear success/error feedback
Visual Interface
