I’m a Senior Product Designer in San Francisco. I work on projects end-to-end, but am most excited about using user research and prototyping to discover ways to improve both the product and people’s lives through good design.
Pantheon is a web development and operations platform that enables teams to build and launch WordPress and Drupal websites. As a product designer, I work on the dashboards used primarily by digital agencies who build and maintain client projects.
New Site Plans
To support the launch of new site plans and pricing, our main goal was to find ways to proactively communicate the value of the platform and minimize the perception of commodity web hosting. We also updated the checkout experience to fall more in line with expected patterns when buying online
We did extensive user testing to ensure we sell the benefits the customer will receive (not features), highlight our main value prop, and call out differentiators we learned users care most about.
The Performance plan comes in 4 sizes, which refer to the amount of traffic and storage a site needs. The risk here is because so many services offer pageviews for cheap, we had to find a way to minimize pre-existing notions of commodity hosting. Pantheon does host the site, but also offers benefits and tools that other services do not, so that development productivity increases and the site performs better for users.
After testing several approaches, we found that choosing the plan size as the 2nd step was the best flow because this increased the value testers reported they received for their dollar. And since this selection is positioned more as an afterthought, the perception was buying a commodity was greatly reduced.
First Time User Experience
Agencies utilize Pantheon’s workflow to solve specific challenges with website development. In an effort to increase Week 1 user retention, we improved our First Time User Experience (FTUE) starting with user research to understand common roadblocks new users encounter.
Through prototyping and testing, we synthesized an approach to (1) communicate to new users how Pantheon can solve current workflow challenges, and (2) suggest actions so users can make progress towards those problems they want solved, and more quickly realize the benefits of using the platform.
There are several areas where users are dropped into a UI with no direction. Users who know what they want to do waste time clicking everywhere to try to figure out how to do it. Users who don’t know what they should be doing are even more paralyzed.
Once users were past this step, we addressed the next roadblock to starting site development – cloning the code repository with git or connecting through SFTP.
This dropdown redesign was implemented as an A/B test, with the new design resulting in a 10% improvement in the number of users who successfully get their site code and make their first code commit on Pantheon.
Some of our developers prefer using the CLI to interact with Pantheon and their sites. To support this mode of working, we support our own CLI tool (Terminus). I worked on a project to improve the CLI experience, while increasing usage and adoption of Terminus, which we know can lead to more active users on the platform.
After synthesizing the user research and learning our main problem is discoverability and lack of useful information in one place, we formed an approach to create a Getting Started experience by communicating what Terminus is, making it easier to install, and starting users off with a set of scenarios they can immediately be applied to their workflow.
We created a Terminus Manual to consolidate information and use as an official, single source of truth. After release, the Terminus Manual became, and still is, the top-ranked page of our entire documentation.
As BinWise’s first designer, I led the design for a beverage management SaaS product for restaurants. After several years of development adding on to a product without attention to the overarching user experience, the product was fragmented, inconsistent, and users were frequently confused.
To move to a human-centered design process, we interviewed and observed our customers to learn their workflow problems. We developed personas, design principles, new interactions, and updated visual designs based on this research.
The research and new design principles informed the redesign of the Inventory system, a critical part of the product that customers use to upload counts (manual or through our barcode scanner) of their inventory on a regular basis, and track their items over time. Through usability testing of the existing system and review of common support tickets, we learned the existing 7-step process was long, overly complicated, doesn’t provide guidance, and doesn’t help users catch errors.
We redesigned this into a 3-step process which guides the user, provides more help, and proactively assists the user catch errors earlier. The improvements reduced user frustration, the amount of time spent on this task, and the number of support tickets received.
Some positive feedback we’ve received include:
- “Much cleaner, faster, and takes out unnecessary things you had to do and look at before”
- “It worked really well. It was very intuitive and simple.”
- “The variance report is very clear, much better than the old one, and it will be understandable to a newer person.”
This is a walkthrough of the redesigned system. (Set to HD for crisper text).
When users count inventory, most use a barcode scanner we provide them. The most efficient method for scanning is to use what we call a scansheet, which is a sheet of barcodes taped near a rack or bin. In order to help our customers count inventory even more efficiently, we needed to update the interface for generating a scansheet to be more usable and flexible. The most critical problem is users were unable to save existing scansheets and instead had to remake them from scratch every month!
We updated the interface to enable users to save and edit as many scansheet files as they needed, added more functionality such as renaming, duplicating, and bulk actions, and made the controls more obvious through the updated visual design, such as a previously undiscoverable drag and drop feature, which is helpful for users to organize items in the order of how items are physically arranged on racks or shelves. Many users (and many of us!) didn’t know about this.
Some positive reactions include:
- “It will be nice to have the sheet always available and be able to change it, and not have to redo it every time something changes.”
- “It’s exactly what the program needed. Having to rewrite the sheets was pretty painful, but this solves all of the problems!”
Walkthrough of the redesign:
The team and I also concepted ideas to help with other problems we’ve observed in the product. For example, the tools users needed to manage their items are scattered across different areas of the product. We envisioned a centralized interface to accomplish tasks related to item management that users would expect to be able to do.
We also concepted a new dashboard. Users know a lot of data is available in the product but they often don’t know how to access it or what to do with it. A new dashboard would put the most needed and valuable data front and center.
At Schell Games I was the UI Designer for educational desktop and mobile games.
S.E.C.R.E.T. (Project Codename: Sherlock)
I was the UI Lead on early stages for an immersive game based in the Children’s Museum of Houston. The museum has been infiltrated! Kids enlist in the Special Elite Crime Resolution and Espionage Team (aka S.E.C.R.E.T.) to crack codes, uncover clues and outsmart villains.
Daniel Tiger’s Neighborhood
Daniel Tiger’s Neighborhood is an animated program for preschoolers ages 2 to 4 which builds on the pioneering PBS series, Mister Rogers’ Neighborhood. Through imagination, creativity and music, Daniel and his friends learn the key social skills necessary for school and for life.
As the UI & UX designer, I worked with the game designer to map out flow of the website and games so that 1) all of the interactions were fun for kids to play with, and 2) the parent/guardian could intuitively navigate the site.
World of Lexica
A language arts adventure game played on a tablet, students explore a world featuring classic literary characters. Lexica, and its bundled minigames, is intended to build skills related to reading behaviors, comprehension, writing, and critiquing.
As the UI Lead in the first phase of this project, I worked closely with the game designers to begin thinking about the user interface controls and visual treatment.
Junior high students plays as a magical creature, Blott, who lives below ground and needs to repair his home by fixing wrong words and sentences. Through the game, players begin to recognize patterns and word parts to grow language art skills.
I was the UI and Art Lead on this minigame bundled with the main Lexica RPG.