A minimalist sample photo-centric site with a snap scrolling function & custom navigation animation.
To build a trusted informational website with a snap scrolling function and custom nav bar animation. The build would require an option to add an online shop and payment portal at a later date. To enhance the user experience we wanted to build a clean site with clear navigation pathways.
A fully functioning photo-centric site with custom development. We also included a 'custom cover' option whereby users could build their own insurance package based on individual needs. It was built with the option to include a shop and payment portal in the future.
From a design perspective we wanted to display information clearly without making the site text heavy. We chose ‘ Montserrat’ & ‘Monserrat Extra Light’ as they are clear geometric sans-serif fonts. They are easy to read and don't distract from the information on the site.
For an insurance brand we wanted to signify trust and reliability. We chose black, grey and off-white as colours to accent the photo-centric nature of the site. It was important they didn’t overshadow the images and information being presented.
The navbar animation was created using only Webflow animations and the effect is perfect.
We included three separate navigation keystones as part of the information architecture plan for this case study. The sidebar shop & account navigation, the main navigation that we animated and then each section of content has two links one to order the insurance policy online and another that leads to a separate information page.
The design is responsive and functional across a variety of devices. The hover scroll is not visible on mobile and tablet devices, however the snap scrolling works on mobile and tablet. Whilst we anticipate most customers would purchase insurance on their desktop, it was important that the information and design was easily transferrable to mobile and tablet use.
There are no more recent projects
There are no more projects.