Blockchain wallet landing (Turbowallet)

  • About client:
    TurboWallet.io is crypto chat wallet that uses #Telegram and #Discord bots to makes it easy to send and receive crypto.

    Services:
    Redesign

    Process:
    Discovery > Research > Logo redesign > Redesign > Prototype
  • Landing page
  • Logo redesign:
    There was only a png format image of the logo so the redesign process was quite simple: creating vector and exporting necessary formats. I also changed color guidelines to match new interface.
  • Logo redesign
  • Layout grid:
    I used both 8 pixels and 12 columns grids to achieve pixel-perfect quality.
  • Layout grid
  • Components, colors & typography:
    Using components is an easy way to keep the work process simple and consistent. Usually, I create components for each frame group: desktop, tablet, and mobile. Also, #figma has text and color style features which I use in every project. There were 6 color styles and 7 styles of Montserrat font family used.
  • Components, typography & colors
  • Client-side encryption
    Turbowallet as a company does not have access to, nor have any knowledge of users' account information. Secure, private and easy to use are the most important app qualities and I tried to show it visually by using clear and comprehensive copywriting, blue color palette (security & stability association), adding inside-app screenshots and other visual and UX accents.
  • Landing page details (client-side encryption)

  • Crypto collectibles
    Turbowallet gives users an opportunity to buy, transfer, view, and trade crypto collectibles. I had a lot of fun designing block that showcases this feature :)
  • Landing page details (crypto collectibles)
  • Help center
    It took a while to organize and divide information into instruction and FAQ blocks but the result is user friendly, easy to find dropdown sections.
  • Help center page
  • Help center page (full)
  • Process:
    This is how the Figma file looks during my working process. As you can see, I try to achieve website responsiveness by designing desktop, tablet and mobile versions at the same time.
  • Working process in #figma
  • Credits: Turbowallet.io, Travis Reeder, Murat Baibosunov
    Thank you!