HODLIT

Mobile application ui/ux design

Revolutionizing the Mobile Cryptocurrency Experience: A Look at HODLIT's UI & UX Redesign

HODLIT, a mobile cryptocurrency exchange platform, approached The Skins Factory to do a full redesign of their mobile application’s UI & UX design. We started with a complete refresh of their onboarding process and user experience. To enhance the visual design, we opted for a sleek "panther black" backdrop infused with subtle undertones of deep purple. This choice ensured that any color incorporated later would pop off the screens, injecting a playful essence while upholding the platform's gravitas. Our UI designers crafted a fusion of 2D elements and neumorphic accents, imbuing the interface with a refined, tactile quality. Meanwhile, the user experience underwent refinement, resulting in a seamlessly intuitive journey for every Hodlit user.

This is a truncated look at the complete project. We excluded images that were redundant visually. Take your time and view the entire project. We think it’s a clear example of why The Skins Factory stands far apart from other UX design studios.

★★★★★
”The Skins Factory’s work exceeded my expectations.”
Drew Optebeke, Founder, HODLIT

Sign Up + Login Screens

Whenever possible we used progress UI elements to let the user know where they were in the onboarding process - whether it was pagination circles for the “Learn More” elements on the main “Sign Up” screen or the triple, wavy line progress bar at the bottom of each screen.

SIGN UP

LOGIN
Because Sign Up and Login share a common upper panel design and a similarly shaped “enter” button, the Sign Up button utilizes a pink / purple gradient while Login (below) uses the default deep blue, tactile button to denote that you are already integrated into the application.

Main Home SCREEN

Super vibrant colors & gradients greet the user once they complete the onboarding experience.

More than just a “pretty face,” the upper, segmented rings and their coin icons are completely interactive. When a cryptocurrency segmented ring is tapped, the center values change giving the user pertinent information for that coin. We kept the segmented rings solid in their inactive state. Once tapped, the ring becomes an outline. This denotes that the ring’s content has been “emptied” and has moved to the center area.

In the Portfolio Assets section, each row is tappable and swipeable yielding different functionalities depending on how the user interacts with them. To make sure the user experience was intuitive, we included an “i” button that when tapped, releases an info panel explaining to the user how to interact with the content.

Autopilot + Roundup Screens

These automated features allow the user to auto withdraw from their bank (Autopilot) or turn expenditures into additional crypto (Roundup). We designed neumorphic, tactile jog wheels for the users to interact with that really add fantastic visuals while still being functional elements. We used different colors for both the progress rings and jog wheels to discern one from the other.

USD + Bitcoin + Cryptocurrency: Expanded Information Screens

These screens show the information after a user taps either the USD Balance or Cryptocurrency Coin rows on the Main Home screen.

Expanded Cryptocurrency Coin Info Screen

Expanded USD + Referral Screen

Buy + Sell + Send: Expanded Information Screens

As discussed previously, tapping and swiping rows on the Main Home screen yield different functionalities. The ability to buy, sell and send are as easy as swiping a finger. We used Ethereum for the main design template and designed a few other cryptocurrencies for the client to use.

Settings Screens

Referral Program Screens: Drafted + Passive

These were a 2nd & 3rd design addendum to the project we did for HODLIT as they branch out with their new feature sets. We inverted the interaction design with this ring system to differentiate it from the main dashboard. By default all rings are emptied into the Total Earned data. Tapping a coin segment signals the app you can transfer funds for that specific coin earnings.