01 Tierra Bio

Overview

  • My role: Senior Art Director
  • Team: VP, Digital Solutions; Front-End Developer; Back-End Developer; Project Manager; Client Services Lead; Motion Designer
  • Audience: Lab researchers
  • Platform: Website application

Problem: Tierra Bio built an AI-guided system that makes custom protein synthesis accessible. Lab researchers needed a way to order those proteins like any other product online, in some cases thousands of sequences at a time.

Solution: Working closely with our developers and project stakeholders, I designed the ordering platform from landing page to confirmation email. The most challenging part I worked through was the order table. Researchers can order up to 10,000 sequences, and each sequence returns one of four feasibility results. I designed a color-coded, scannable summary that counts each result above the table, inline editing for single sequences, and a subtotal that updates as the order changes. The initial scope included wireframes for a notification system, which were cut in the build due to time constraints.

Result: The result was an industry-first system that lets users submit up to 10,000 custom proteins to be synthesized, validated, and shipped in just a few clicks.

What I Did

  • Wireframing
  • End-to-end UI design
  • Order table and feasibility states
  • Checkout flow
  • Component library
  • Figma prototypes
  • Developer handoff

Related Projects

Tierra Bio homepage concept introducing the custom protein ordering platformWireframe of the Tierra Bio ordering processOrder table with color-coded feasibility results, inline editing, and a live subtotalCheckout screen for a custom protein orderAccount information form in the ordering flowSequence selection screen in the ordering flowOrder confirmation email design