Kolibri Steinar Ingi Farestveit

Menu and Scrolling Details

  • Save
Menu and Scrolling Details principle motion menu navigation prototype interaction

Here's some interaction and motion design for the upcoming Íslandsbanki website.

One of the distinct details in the new branding of the bank is the grid and how it's used for logo and label placements (the buttons in the case of the interactive stuff). This detail is somewhat of a signature visual and we felt it was important to keep it where we could in the interactive stuff. This meant we had to get creative about what would happen with the logo and menu button when scrolling because we didn't want the latter to push up and out of sight.

With the menu we wanted to feature the red more and keep the navigational buttons in the same place. Make it bold yet also make it feel seamless with the page underneath.

The result can be seen in the in GIF or – for higher res and better fps – the attached movie.

– – –
Press L to show us some love!
Follow Kolibri on Instagram

keyboard shortcuts: L or F like