Point Admin Dash

While working as a UX Designer at the creative agency Boundary Digital, we worked with Y-combinator startup Point on admin screens and graphic assets for their public launch.

Point already had an exisiting visual style, so it was our job to adapt this style to the new set of materials.

We went through a few iterations of the admin screen after getting feedback from the client, and finished up the project by delivering email templates and social assets.

ROLES

UI/UX, Branding, Copywriting

TOOLS

Sketch, Adobe, InVision, Zeplin

DELIVERABLES

Desktop Mockups, Email Templates, Social Media Assets

INTRODUCTION

Getting to know the project.

Project Brief

  • Design an admin interface that aligns with Point's current design aesthetic.
  • Create social media assets for Product Hunt.
  • Create welcome email templates for new Point customers.
  • Main Problems to Address

  • Admin users need an intuitive way to see an overview of account and user activity.
  • Admin users need interactive charts that can show them revenue and user activity over certain periods of time.
  • Home Screen

    USER STORIES

    Prioritizing key user tasks.

    As an admin user I want to:

  • See downloads on a daily, weekly, monthly, quarterly, and yearly basis.
  • See daily active users on a daily, weekly, monthly, quarterly, and yearly basis.
  • See monthly active users on a monthly, quarterly, and yearly basis.
  • View breakdowns for Checking, Savings, and Volume.
  • View revenue broken down by user, transaction, and card.
  • See a percentage overview of fraud claims and number of recent chargebacks.
  • See overview of customer service KPIs: inquiries, resolved tickets, NPS.
  • DASHBOARD

    Breaking Down the Dashboard Experience

    Overview

  • User is able to see key information at-a-glance.
  • Point visual style is maintained throughout.
  • User can toggle between Home, User Overview, and Settings.
  • Dashboard

    Analyzing the Visual Design

  • Large font size and bronze color highlights key data points like Total Checking and Total Savings.
  • Subtle use of drop shadows creates card effect for each section of information - this helps the user to digest the data.
  • Corner radius is set to 0 throughout, which was intentional in order to be consistent with the Point app.
  • Deposits and Revenue Overview

    Thinking about the User Experience

  • Thanks to the card design, users can easily scan the page for key information they're looking for.
  • Darker highlighted tabs make it clear that users can toggle between differetn timeframes on these charts.
  • Users are able to both the total data point and the percentage change over a given time period.
  • Risk Mgmt & Customer Service At-a-Glance

    ADMIN EXPERIENCE

    User Overview Screens

    Overview

  • Once inside a user detail view, admin users have the option to ship a new card, lock a card, suspend an account, and request more info from a user.
  • The admin user sees an overview of key data: total cards per user, total amount in checking, total amount in savings.
  • There is also other key user data, such as location and account numbers.
  • User Detail

    User Detail: Transactions

  • From the transactions tab, admin users see an overview of a user's recent transaction history.
  • Like other charts within the admin experience, users can toggle between differetn timeframes: 24h, week, month, quarter, year.
  • Transactions can also be filtered by transaction type.
  • User Detail: Transactions

    BRANDING

    Creating a Consistent Design Language

    Point Style Guide

    After I completed the visual design, I compiled the style guide to ensure that future work would be consistent. The style guide was based on the existing site design for the Point product.

    Style Guide: Color

    Style Guide: UI Elements

    LAUNCH

    Communicating the Brand Story for Launch

    Product Hunt

  • For Point's public launch on Product Hunt, I was responsible for designing the visual assets that would be consumer's first glimspe into the product.
  • I used images from Point's existing website, and matched the visual style and color palette.
  • We also worked to create imagery for their social media accounts: Twitter, LinkedIn, and AngelList.
  • Product Hunt Example 1

    Product Hunt Example 2

    Twitter Banner

    CONCLUSION

    Reflecting on the Project

    What did I Learn?

  • It's okay to develop a style guide after some visual design has been completed - the style guide is a living document that evolves throughout the design process.
  • Since this was a financial product, it was really important to understand the details of how the product works. I worked with the Point team to identify top-priority information that needed to be at the top of the hierarchy.
  • It's important to pay attention to details when adapting a visual style. There were certain elements, such as corner radii, that I had initially missed when bringing over Point's visual design.
  • Agency: Boundary Digital

    Creative Director: George Renfro

    Return Home

    RedBull

    DASHBOARD DESIGN