Classic bank websites often fall short in appealing to younger generations, such as Gen Z. Traditionally, bank websites tend to have dull and conservative designs, failing to resonate with this younger and tech-savvy demographic. Embracing a modern and vibrant design, I aimed to break away from traditional banking norms when it comes to design, in order to appeal to the younger generations.

‍

GoBank, a modern online banking platform, seeks to appeal to the Gen Z demographic, a generation characterized by their tech-savviness, digital-first mindset, and preference for seamless user experiences.

‍

‍

I started my design process with creating a mood board, which later helped me to create the look and feel of the website. As a main color I picked neon green- a vibrant color that captures attention and evokes a sense of excitement. Paired it with other green hues and lots of white.

‍

‍

‍

As a next step, I used my iPad to create digital wireframes of the homepage. Low-fidelity wireframes are best at this stage, as I like concentrating on the structure of the website and not get lost in details.

‍

I designed the main page incorporating the vibrant color palette and using some design elements?? to add authenticity and personality to the website. I focused on showcasing the bank's unique value proposition, key services, and a clear call-to-action for lead capture.

‍

‍

Once the UI design in Figma was done, I started implementing it in Webflow.

To me, it’s very important to have a style guide incorporated into the Webflow build. Only this way you can ensure consistency throughout the entire website. For example, I always set website-wide colors, styles and of course the typography hierarchy.

‍

‍

Gen Z is a mobile-first generation, relying heavily on smartphones for online activities, especially making purchases. A responsive website ensures that the user experience remains seamless and consistent across various screen sizes, including smartphones and tablets.

Once I finished implementing the design on the base desktop breakpoint (1100 px), I made the necessary adjustments to maintain usability across various screen sizes.

‍

‍

Last but not least, I added some animations in order to capture users' attention and create an engaging and interactive experience. This gives the website a well-rounded look and helps differentiate it it from the rest of the competitors in the online banking space.

‍

Less is more- by displaying testimonials one by one with this subtle scroll-triggered animations, the user is fully engaged.

‍

Implementing a bold big text animation to highlight the main call-to-action creates a sense of urgency and draws immediate attention to the desired action.

‍

For the online bank website project, I adopted Finsweet's class-naming convention called "Client First" to streamline the backend organisation and ensure a clean and efficient structure. Here’s a sneak peek of how the backend of the template looks like.

‍

‍

A Webflow website for online banks that embraces a modern and vibrant design, with a clear call-to-action for lead capture.

GoBank can help any online bank to establish a strong online presence, gain a competitive advantage, and position itself as a preferred banking solution for the younger demographic- the Gen Z.

‍