Overview
As part of my portfolio, I recreated the Porsche Macan Electric page from the official website. The project was carried out in two main steps: design on Figma and development on WordPress using Elementor and custom code.
Development
The development process began with creating a mockup on Figma, followed by graphic adjustments using Illustrator and Photoshop. Once the design was finalized, I moved on to the WordPress integration phase.
Key step :
Figma: Created the page structure with a strong focus on visual details.
Illustrator and Photoshop: Adjusted graphic assets to match Porsche’s branding.
WordPress & Elementor: Used Elementor to build the page starting from a blank theme.
Custom Code: Added CSS and scripts directly into the WordPress database to optimize the layout and perfo
Browser Compatibility:
- Challenge: Different browsers may interpret code differently, leading to inconsistencies in the website’s appearance.
- Solution: Test the website on multiple browsers and use compatibility libraries or polyfills when necessary.
Technical Points
Responsiveness: Implemented media queries to ensure compatibility across various devices.
Optimization: Conducted performance tests and made code adjustments to improve loading speed.
Customization: Used Elementor to create dynamic sections and modified the theme’s PHP files to add advanced functionalities.
Results/Conclusion:
The final project is an accurate replica of the Porsche website, adapted for WordPress, featuring modern visuals and a smooth user interface. This project demonstrates my ability to combine design tools and technical skills to develop a professional website.
