::::: The Challenge :::::
The challenge in e-commerce was that each regional and country-specific site had been managed separately for over 15 years. This led to a disconnect between the sites of different countries and inconsistencies in styles, fonts, colours, and sizing. The team attempted to apply print guidelines, which resulted in a compromised colour brand guideline for the web. This resulted in the sites being non-responsive, appearing untrustworthy, and lacking brand consistency.
::::: The Solution :::::
A web-specific color palette and a design system were essential to start building pages and templates. I developed the design system and templates for the e-commerce platform using atomic design. I worked closely with the engineering team to enhance the websites and roll out new page templates for Product Detail Pages (PDP), Product Information Pages (PIP), and Landing Pages for new product launches.
::::: The Result :::::
::::: Nemesis™ Campaign :::::
This new generation of intelligent sailing data display offers unparalleled visibility, with complete customisation or easy to use pre-set multi-function templates and automatic dashboards based on your point of sail. Nemesis™ allows you to define what data you see, when and how you see it, no matter what the conditions, providing an intuitive link between your trusted instrument network and the real world. The main objective of this concept proposal was to provide tailored data solutions for diverse environments and conditions. The key challenge was to effectively showcase the range of user interfaces and demonstrate their benefits in various environments.
::::: Several storyboard concepts for a video :::::
::::: Concepts for print :::::
::::: Product with UI :::::
::::: High quality mock-ups for web :::::
::::: The approved concept hero visual :::::
My standard web design process involves collaboration with the relevant teams from start to finish, including the following steps: Briefing, sketching, conceptualising, gathering review/feedback, obtaining sign-off, handing off, and conducting user acceptance testing (UAT) before launching the site.
::::: Zeus3s™ Product information page :::::
::::: Design Systems :::::
Maintaining the design system for the B&G e-commerce platform was also part of my responsibilities. This included integrating new components in alignment with the existing design principles.
::::: Menus :::::
::::: Product information template :::::
The product information page template serves as an illustration of the application of the design system and font standardisation throughout the site.
