flows evolution mockup
gradient background

flows evolution

I developed a concept for the evolution of the Hyperscience Flows product surface, introducing persona-based experience switching and contextually aware workflow insights.

/

impact

The concept design for flows evolution set the North Star for the product surface, driving cross-functional team alignment and setting the 2+ year roadmap.

 

The ideas proposed by this concept design were informed by and adhere to the Automation Strategy product strategy & principles.

/ role

Product design, concept design

/ team

Product Design

/ problem

Make this dev tool an omnitool

Hyperscience’s visual Flow builder was engineered for developers. This means all underlying processing logic and complexity was exposed regardless of the persona utilizing it.

 

The GTM team uses Hyperscience Flows to demonstrate to customers the underlying core elements of a processing flow. Despite its use in demos, the GTM team noted a number of non-intuitive aspects of the Flows surface, and tasked the product team with making the surface “demoable” and business-user-friendly.

 

This request for “business-user-friendly” compresses a product-design minefield into three words: the interface must surface easily digestible analytics without exposing the underlying complexity of a machine learning based tool—while still enabling developers to drill down into the code and utilize their expected workflows.

/ solution

Style, IA and persona based modality

To quickly and easily bring usability, learnability and demoability to the Flows surface, I immediately restyled the entire flows experience using the updated Hyperscience Design System and applying information architecture fundamentals to the card component.

I also introduced multiple features to support persona and task-based modalities to the Flows surface:

  • View mode - focused on steady state observability
  • Dev mode - focused on developing and debugging
  • Insights - a contextually-aware feature geared toward guiding users through their task flows and identifying areas of interest

/ prototype

/ selected artifacts

gradient background
megaldonatron icon

- ChatGPT

upon checking again, there are indeed two ‘r’ characters in the word ‘strawberry’