E-commerce · 2014
FABRIQ
Pixel-perfect Magento migration from a custom Zend Framework store
FABRIQ had a running webshop on a custom Zend Framework installation and needed to migrate to Magento. My task was a pixel-perfect recreation — the client used a Chrome overlay plugin to compare screenshots of the old and new site side-by-side, and held the work to an exact visual match.
FABRIQ was a fashion e-commerce store that had built their original webshop on a custom Zend Framework application. The decision was made to migrate to Magento, and my job was to make the transition invisible to customers: a pixel-perfect recreation of the existing design, rebuilt as a proper Magento theme.
Pixel-Perfect Brief The client took the brief seriously. Using a Chrome extension that overlays a screenshot of the original site on top of the new one, they would check pages side-by-side at varying opacities to catch any visual differences — spacing, typography, colours, layout. Every detail had to match exactly.
Zend to Magento The challenge was not just making something that looked right, but doing it correctly within Magento's theming system: proper template hierarchy, layout XML, blocks, and CSS scoped to Magento's structure. The pixel-perfect output had to come from a well-structured Magento theme, not hacky overrides.
Outcome The migration preserved the full visual identity of the existing store while moving onto a proper e-commerce platform with the product management, promotions, and scalability that Magento provides.
◈Responsibilities(2)↓
Pixel-perfect recreation verified by overlay
The client used a Chrome extension to overlay screenshots of the original Zend Framework site on top of the new Magento build, comparing them at varying opacities. Every spacing, colour, and layout detail had to match the original exactly.
Full platform migration from Zend Framework to Magento
Rebuilt the entire storefront from a custom Zend Framework application into a properly structured Magento theme — correct template hierarchy, layout XML, and scoped CSS — while preserving the exact visual output of the original.