Multidisciplinary
Designer & Frontend
Developer

davidbwaters

Building digital solutions to promote growth.

Available Now!
Start Your Project!

Skills

Skills, tools of the trade, and technologies I enjoy working with.

Selected
Works

A curated list of projects worked on and things I built.

While working as Lead Designer at Matrix in 2022, I was tasked with developing their branding and design system.


Overview

Matrix is a Web3 platform that connects creators to their followers.

They help brands, creators, and artists reach their target audience through a gamified experience that awards users with NFTs for social interaction.

The Problem

  • Creators and artists need a modern way to engage with their audience
  • Web3 allows new potential to change social networking through gamified engagement

Target Audience

  • Fans and followers looking to engage with creators
  • Web3 and crypto enthusiasts

Competitors

Decentralized, Space, Various NFT Marketplaces

The Aesthetic

I took inspiration from Matrix's logo and existing branding colors and added some accent hues for the webapp. I wanted a clean, modern, glassmorphic aesthetic to give it a modern feel.

I chose GT America for the font for it's clean grotesque form and expanded variant. The design uses lots of gradients, transparency, and blurred frosted glass to achieve the look. I started the project with a style guide to nail down the theme elements and integrate the existing branding.

The Process

In my full time role at Matrix, I worked with the product team daily to build out the design system and adding components to support the features and functionality needed. I used an iterative design process and polished it from feedback.

I also helped build out the frontend in React and assisted the dev team in handoff. We used JSON design tokens for this project that would sync directly with the Figma file as the source-of-truth and used these to keep the design in sync with code. We used a library called Figmagic, which I helped implement, to sync code changes with Figma and define tokens beyond what Figma styles and plugins support.

The Solution

  • Social network with gamified battlepass-like view to engage followers with their creators.
  • Users can earn NFTs and custom digital rewards by engaging with their followers. For example, liking a tweet from a creator awards XP that can be spent on NFTs and lootboxes through the battlepass.
  • The platform integrates with Twitch, Discord, Twitter, Spotify, etc to allow engagement through multiple platforms and reach different audiences
  • Musicians have special tools and can award their fans with early releases and encourage engagement.
  • DAOs, groups, and voting are integrated into the platform.

While working for Mainux, I helped create Fitbux's design system, UI, and branding using Figma. I was responsible for overhauling their current branding and updating it to modern standards.


Overview

FitBUX combines innovative technology and free FitBUX Coaches to help you develop and implement your financial plan.

They've helped over 11,000 Young Professionals make good decisions on student loans, retirement, home buying, and so much more. We can help you do the same.

The Problem

  • New graduates have trouble managing their finances
  • People don't have a plan for paying off student loan debt
  • People have trouble tracking expenses and budgeting

Target Audience

  • Young professionals and recent graduates
  • People with student loan debt
  • People struggling with finances

Competitors

Mobills, Walnut, Spendee, YNAB, Mint

The Aesthetic

I took inspiration from Fitbux's cool blue color scheme and existing branding and added some accent hues for the app. I wanted a clean, modern, neumorphic aesthetic to give it a modern feel.

We chose Poppins for the font for it's clean geometric forms. The design uses lots of gradients, transparency, and background blur to achieve the look. We started the project with a style guide to nail down the theme elements and integrate the current branding.

The Process

The app had complex, lengthy form sections that collected various financial data that we split up into sections. The client felt strongly about how they wanted certain parts of these to function, so we worked with them when building these out.

The main section of the app was a dashboard with a lot of complex data widgets and we had to carefully lay these out to fit across different device sizes. There was also a contact section to interact with your Fitbux coach. The design system had well over 50 components.

The Solution

  • User friendly financial platform.
  • Users can link their bank account and build a financial profile.
  • Users can track spending.
  • Users can set a budget & categorize expenses.
  • Users can set saving goals.
  • Users are connected with a Fitbux coach, certified financial advisor to guide them and help make decisions.