Ledger Nano X
Cold Wallet for a Secure Crypto Journey
Overview
Ledger is a big name within the Web3 industry, renowned for its secure approach to crypto wallets. Tilipman Digital took the task to redesign the landing page for the product in a more appealing manner, a way in which the best features of the product would not only be highlighted, but also be optimized for conversions. The redesign has later on received 2 awards on Behance.
As the best things in life come for either a high cost, or no cost at all, we decided to give the user interface away as a freebie for the public to use. It is important to note that this is a non commercial project for which all copyrights belong to Ledger. And while one may use the site's design as he or she pleases, using Ledger's trademark may (and more likely than not will) come with negative consequences.
Softwares
Services
DELIVERABLES
Project Goals and Objectives
Ledger Nano X is a cold wallet for cryptocurrencies, designed with security in mind. Being a cold wallet means that it is a piece of hardware that you can carry on your person, connect it to your computer, and then see the state of your wallet. When companies craft products in such a way where they sell a combination of software and hardware, it is crucial to craft a narrative, a proper storytelling that is engaging for the users and that builds trust.
Design
Having the goals of the project in mind, it is important to showcase all of its features in the best light to the user. We found one company that does this in a perfect way — Apple. Looking at the use case, it became clear what the redesign should achieve.
Hence, we made it our primary goal to reach two objectives for the new landing page:
- First objective is the pursuit of seamless consumption of content. This is oftentimes achieved with the right use of minimalism and white space.
- Second objective was making the content more engaging, making the user feel as if they already own the product. This type of engagement in storytelling is best achieved through the usage of parallax effects, usage of scroll-triggers and other animations that slightly shift focus from one piece of content to another.
Webflow Development
The development of the project was not as straightforward as most of the builds dedicated to marketing websites. While all the hover states were done with custom CSS, making the site’s code more optimized, we used a combination of JavaScript libraries, JavaScript, and Webflow’s native interaction capabilities to bring the site to life.
When talking about libraries, we used Ukiyo.js for parallax effects, and Swiper.js for the testimonial slider. Testimonials we’re then added through CMS in order to ease the maintenance on the client’s side. JavaScript was used for both auto rotating tabs, while we used Webflow’s interactions as solutions for the rest of animations, including the scroll trigger.
