3D Cards & Augmented Reality
N26's delightful way of selecting your card
I’m Silvia, a Product Designer working with N26 in Barcelona. Recently, my team redesigned the experience of selecting your bank card when you upgrade from a free account membership to a premium tier. Since our service is 100% digital, the card is our users’ only physical touchpoint with us. This makes the card selection one of the most important moments of our users’ journey, and a key opportunity for the business to increase conversion.
The new design showcases a floating 3D card that moves when you tilt your phone.
iOS users (and coming soon to Android) can even go a step further and simulate the card lying on a surface by using Augmented Reality. This means you can compare the card with other cards, and see how it will look next to your wallet in the real world.
How did we come up with this idea?
When we began working on the redesign of the upgrade experience, none of the designers working at N26 were happy with our existing card assets. For example, the best ones we had available for our Metal card were just photos of the real card. While the metal texture was fairly accurate, the light did not match the environment the card was meant to be placed into, which made it look unnatural.
The first thing we tried was to digitally recreate the card, but the results were not satisfying, especially the engraving of the Mastercard and N26 logos. Next, we considered using 3D renderings. This would give us the chance to get the texture and light exactly right, but would require a lot of production effort. Then we thought about an actual 3-dimensional card object which users could directly interact with.
It turned out this topic had been on the table for quite some time, but we quickly realised how little we knew about the complexity of such a thing. Back in 2018, before N26 had expanded its offices outside of Berlin, the Brand Design team began some initial explorations, but didn’t have the resources to pursue them further. This project was forgotten until we recently, when we picked it up again and started to explore the concept.
Our learnings along the way
One of the biggest challenges we found while developing the new design was to create cards with a realistic look and feel while keeping the app size small. Working with 3D assets, you can easily go crazy with textures, lighting and shadows. Finding the right balance between creating an artistic masterpiece and a lightweight application was key for a successful implementation.
We released this feature in February 2020 and we’re proud of the results! We collaborated between different disciplines across the company in order to improve a key moment in our users’ journey, adding immersion and delight. Now, we’re using the learnings from this project to find new opportunities to innovate.
