Once we had a clear design concept, we planned the development process, outlining the project's scope, goals, and timelines, breaking down the design into smaller sections to make the development process more manageable.
The primary, and integral function for this client was the ability to manage their own products, and while this system would not be transactional, it had to function in the same way a store would behave. The basket and purchase elements were replaced with a customised contact element.
After setting up our development environment with the necessary tools and technologies, we installed and configured the content management system (CMS) and ensured that our web servers and databases were properly configured.
To begin translating the design into a functional website, we began by converting and developing the primary navigation from the XD design. The navigation would be fully responsive having two defined states to acommodate all viewports, as we focused on structuring the primary navigation using HTML (BEM) and applied styles and visual elements using SCSS.
The footer was built with the CSS grid system to ensure uniformity across all responsive states, giving us enhanced control over the span and order of elements for the mobile device viewport.