Mohamed Said — Personal Portfolio & Engineering Website
A complete redesign of my personal engineering website, combining selected production projects, detailed case studies, hundreds of technical articles, certificates, open-source work, and lead generation into one clean professional platform.
Shipped Delivered Product Owner, Designer & Full-Stack Developer
Case study
-
The challenge
The main challenge was organizing more than a decade of engineering experience, hundreds of technical articles, numerous production projects, certificates, and open-source contributions without overwhelming visitors. The previous portfolio format also needed to evolve from a simple personal profile into a professional platform capable of serving different audiences, including potential clients, recruiters, companies, and developers. The redesign needed to remain visually minimal while still providing enough technical depth to demonstrate architecture, backend expertise, real production experience, and the decisions behind each project.
-
The approach
I redesigned the website around a content-first architecture with clear separation between professional positioning, projects, technical writing, certificates, and contact paths. The homepage focuses on quickly communicating my role, experience, engineering focus, and selected work without requiring visitors to explore multiple pages before understanding what I do. Projects were rebuilt as structured case studies with categories, technologies, project status, technical challenges, implementation approach, outcomes, and dedicated project imagery. The article section was designed as an engineering library rather than a traditional blog. Articles are organized through topics, searchable content, featured articles, and technology-focused hubs so hundreds of posts remain easy to discover. The interface uses a restrained visual system with strong typography, generous spacing, reusable components, and minimal decoration to keep attention on the engineering work. SEO, semantic markup, accessibility, responsive behavior, structured metadata, performance, and lead-generation paths were considered throughout the redesign.
-
The outcome
Delivered a cleaner and more focused professional platform that presents my engineering work through projects, architecture decisions, technical writing, and open-source contributions instead of relying on a traditional résumé-style portfolio. The new structure gives clients, recruiters, engineering teams, and developers clear paths to explore relevant work, understand my technical experience, discover articles, and contact me.
Mohamed Said is my personal portfolio and engineering website, redesigned to present my professional experience, selected projects, technical writing, open-source work, certificates, and backend engineering expertise in one cohesive platform.
The main goal of the redesign was to move away from a traditional developer portfolio and create a cleaner, more mature professional presence that reflects my experience as a Senior Backend Engineer.
The website presents selected production projects as detailed case studies, highlighting not only what was built but also the architecture, technical decisions, challenges, technologies, and outcomes behind each system.
It also includes a dedicated engineering library containing hundreds of technical articles covering Laravel, PHP, APIs, databases, infrastructure, Filament, Livewire, open-source packages, and lessons learned from real production work.
The platform is designed to serve several audiences at once: potential clients evaluating previous work, companies considering me for engineering roles, developers reading technical content, and visitors discovering my open-source work.
The redesign focuses heavily on clarity, strong information hierarchy, fast navigation, accessibility, SEO, and lead generation while keeping the interface minimal and distraction-free.
Key features include:
• Professional developer profile and positioning
• Selected project portfolio and case studies
• Project filtering by category and technology
• Detailed architecture and implementation case studies
• Engineering article library
• Topic-based article discovery
• Full-text article search
• Technical certificates and achievements
• Open-source project showcase
• Lead generation and contact flows
• SEO and structured content
• Responsive design
• Light and dark appearance support
• Accessible navigation and interface components
• Content management through an administration panel
- Laravel
- PHP
- Blade
- Livewire
- Alpine.js
- Tailwind CSS
- MySQL
- FilamentPHP
- JavaScript
- Vite
- SEO
- AEO
- Structured Data
- Responsive Design