Jeff Heppert


Users have difficulty managing Clipper Card balances and fixing fare-related issues that might come up, many times due to lack of information about their account.


Create a relationship with users based on clarity and communication. Keep the user informed in ways that fit their lifestyle, in order to prevent potential service interruptions before they happen.

External Links

Live Homepage Mobile App Prototype Apple Watch Video Mockup Full Process Journal



Reduce options on the homepage to focus on acquiring new users, while allowing existing users to easily log in and find answers to questions.

Make it easier for existing users to understand the balances on their cards, change selections, and add value.

Live Homepage
Show Process

Initial website interface ideas.

Larger sketches to get feedback on initial impressions.


  1. Clean and Classy. This was ultimately the chosen theme.
  2. Fun and Playful
  3. Business as Usual

Developed three concepts based on the look and feel of the boodboards.

Progression of the homepage design.

Initial designs for the interior pages to manage card balances and ordering a new card.

Hide Process

Mobile App


Introduce a mobile app to quickly manage funds and receive native notifications.

Utilize a relatively small feature set to keep focus on managing card balances to avoid complicating on-the-go interactions.

Mobile App Prototype
Show Process

Sketches for the mobile app interface.

First version of the mobile app.

Hide Process

Wearable App


Introduce a wearable app for urgent notifications about issues that might cause service interruptions.

Keep notifications to a minimum and avoid redundancies with the mobile app.

Utilize interactions that can be completed in a few seconds.

Apple Watch Video Mockup
Show Process

Sketches for the wearable interface.

Hide Process

Brand Identity

Show Process

Ideating sketches for the new logo.

Working out the new logo in Illustrator. I started with the original logo shapes, but realized that I needed an entirely new direction.

Hide Process
Previous Work Next Work