Klaver: Contemporary-Traditional Banking Design Brief

This was my first design brief from Briefbox for my Design 101 course! The goal was to create a brief for a banking company desiring to convey a contemporary yet traditional feel.

I did most of the design work yesterday, and after sleeping on it, I feel I accidentally leaned more toward the “traditional” side of the spectrum. However, I still think it looks nice. 😄

Klaver Banking Design Brief Mockups

Process

For this banking design brief, I decided to use Lunacy (compatible with Sketch) to create the designs.

Keep reading for the rest of the process! 😉

Klaver design guidelines

Colors & Fonts

I started by choosing the colors for the design. The brief had mentioned one of Klaver’s goals as to “go beyond borders, with a worldwide service”, so I decided to emphasize the “worldwide” part. I wanted to deliver an environmental-friendly feel, so I went with a brown-green-blue color combination, using Tailwind.ink to generate different colors. (Later, I realized that this decision caused me to sacrifice the modern feel of the design.)

I originally started out with a slab typeface as the display font, but I switched to Karla to convey a more modern feel. I chose Open Sans for the body font.

Klaver tagline and CTA

Word Choice

There wasn’t much direction or requirements given regarding the words to be used in the design, so I went with “the new and better way to bank” as Klaver’s tagline. For the call-to-action (CTA) button, I chose “join the waitlist“, since one of Klaver’s goals was to give a sense of “exclusivity” to its early users.

Design

The left half of the hero was the easy part, but the right side had me scratching my head. My original idea was to have a globe with a person’s hand somewhere in it. After searching for vector illustrations, however, I decided to forget about the hand part.

Globe

For the globe, I used Undraw.co‘s “the world is mine” illustration. I removed all of the SVG components excluding the globe, and changed the colors to match the new design guidelines. I also added shadows to the globe and continents to make them stand out from the contour line background.

Credit Card

The sample designs from Briefbox for Klaver included a credit card design. I thought something similar would be nice to include in my brief as well. But after laying out the logo, card number, and cardholder name, all I ended up with was a very boring-looking card.

I wanted to include the globe on it. I took the original globe from the hero section and cropped it down to fit the credit card. After removing the shadows, I added a tint to the image to make it “fade” into the background better.

Klaver credit card

Conclusion

This was fun! After I finished the original banking design last night, my first reaction was, “Wait — wow — I can actually do this!”

I went to bed happy and content. When I woke up this morning and looked over my design again, however, I immediately thought, “Oh nooooo! This looks awful.”

Well, it’s definitely a learning experience!

Default image
Catherine Chen
Inspire and be inspired.
Articles: 34

Leave a Reply