THE WHITE COMPANY
Brand Strategy, Product Design, UX/UI, Visual Design
Adobe CC, Sketch, InVision, Zeplin
Responsive web for desktop, tablet, and mobile
The White Company, a cryptocurrency start-up, was launched in 2017 to offer an entire ecosystem of crypto products, including a stable coin, the first crypto debit card, a luxury marketplace, and more.
Lead brand experience to demonstrate blockchain technology integrated with consumer products and solutions and to illustrate meaningful relationships between them.
Build brand strategy through conceptual and creative execution in digital campaign and website architecture. Create an integrated web platform that seamlessly presents and serves up six independent business products: stable coins, crypto exchange, merchant processing, debit card, luxury purchases, and crypto investments.
Directed completion of the company's responsive site for successful and immediate launch inside of three months.
I wanted to understand how both direct and indirect competitive brands within the same space presented similar content on their websites. I searched for inspirational material and engaging user experiences in unique layouts, creative use of imagery, and interaction design elements and assets that could be applied to the White Company website.
LANDING PAGE A-B TESTING
We needed to have a landing page up immediately. I quickly built two different versions for testing. First, I started with a classic look. I wanted to instill a sense of legacy and stability found with brands like Tiffany’s and Goldman Sachs. Second I designed a modern version. This design focused on a more techie look found on sites like Coinbase and Stellar. We then presented both options to our friends and family focus group to inform our design direction. The modern version was a clear winner.
OPTION A: CLASSIC
OPTION B: MODERN
Because The White Company offers six products, it was important to understand what the customer of each of those products might look like. I am a student of User-Centered Design, and understanding the humans that will be using the interface I am designing is critical.
I developed the framework for the layout and structure of the pages in the form of high-fidelity wireframes. These pages were designed with responsive compatibility in mind. Additionally, close attention was given to the assets' arrangement, so they are presented in a clear aesthetic format consistent with the website's proposed look and feel.
The White Company website posed a challenge with the requirement of showing six separate products in addition to presenting the corporate information. There simply was not enough room to place them all in the top navigation bar. After exploring multiple options, I decided to create a dropdown menu (shown below) that lists each product with a short description. The menu was placed in the center of the top navigation bar to be obvious. Also, each product is presented on the homepage, so there are multiple access points. We conducted some light user testing, and this solution worked best.
Project Management / Schedule
From the beginning of the project, I met with the development team to make sure they had input into the design to make a seamless handoff when Visual Design was completed. The backend was considered in my Interaction Design process to avoid pitfalls and take advantage of options and opportunities. Once I delivered design assets and functional specs to the dev team, I acted as a Producer/Project Manager to ensure the code matched design specifications.
The project followed a hybrid agile-waterfall process, as can be seen below in the Gantt chart. Once we were in development, I conducted daily standups with the dev team to keep the project on track.
I developed a flat taxonomy site map that outlines the simplicity of the site structure I created.
BRANDING / LOGO
The client created a logo contest using an online platform. I provided creative feedback to the finalists and worked with the winner to get the logo pixel perfect.
Bouncing off the high-fi wireframes, it was straightforward to add the finishing Visual Design touches. I polished typography, iconography, copy, imagery, and color to get the design pixel perfect. The below screen is the Home Page in its entirety.
VISUAL DESIGN / White Standard
This is the Home Page for the White Standard coin. The above-the-fold section of the page includes a short description of the product, a large CTA to get the coin, a row of press for 'social proof,' and finally, proof of funds. The proof of funds section shows the bank's actual amount of money along with third-party reporting to show legitimacy.
VISUAL DESIGN / White WALLET
This is the Home Page for the White Wallet platform. White Wallet is where customers manage their cryptocurrency holdings. The above-the-fold section of the page includes a short description of the product, a large CTA to sign up, a row of press for 'social proof,' and finally, more details of the product and its benefits.
VISUAL DESIGN / White PAY
This is the Home Page for the White Pay service. White Pay is a merchant processing service for cryptocurrency. The above the fold section of the page includes a short description of the product, a large CTA to sign up, a row of press for 'social proof,' and finally, more details of the product and its benefits.
VISUAL DESIGN / White MARKET
This is the Home Page for the White Market online store. Here you can purchase luxury items using cryptocurrency. The White Market was the first to sell artwork for cryptocurrency, generating a lot of press.
VISUAL DESIGN / White CAPITAL
This is the Home Page for the White Capital service. White Capital will allow investors and cryptocurrency asset holders to invest easily and efficiently in several tokenized funds. These funds, known as Investment Tokens, will represent multiple asset classes managed by top asset managers. They will be available in the White Wallet under an “Invest” section. The above the fold section of the page includes a short description of the product, a large CTA to join a waiting list, a row of press for 'social proof,' and finally more details of the product and its benefits.
VISUAL DESIGN / PRESS
The White Company generates a lot of press, and it was critical to have a smart Press Page. I created cards for each story that included the source logo, date, teaser blurb, read more CTA, and social sharing links.
VISUAL DESIGN / THIRD PARTY REPORTS
It was critical, in my opinion, that customers knew their money is safe. Third-party reports were important in adding an additional layer of credibility.
VISUAL DESIGN / FAQ
Help sections and FAQa are perhaps one of the least fun parts of Interaction Design. Regardless, I insisted customers have access to really well throughout answers to just about any question that might come up. If the FAQ didn't have the answer, there are plenty of options to reach a person in the Contact section.
If you'd like to discuss a job opportunity or have any questions please email me or call (323) 206 0875.
Next ProjectGO TO NEXT PROJECT