product design

Cloud Dataflow Orchestration Platform


Vision Mockup: Dataflow IDE

Ascend is a Palo Alto startup which offers a cloud-based platform for data engineers to design and productionize complex data pipelines. Having joined as a front-end developer while Ascend was still in stealth mode, I transitioned to Product Management and Design, and was the sole Product Manager when the product was launched.

Wireframe: Dataflow IDE
Wireframe: Branching a graph

We had several projects still in flight at the time of the product launch, and needed a way to communicate a coherent product vision to the press and customers. Though we had wireframes, and some partial implementation, for each of the new features, we needed high-fidelity visuals which, while still somewhat aspirational, would be representative of the future UI.

While my usual process is to go straight from wireframes to code (by way of a design system), these vision mockups gave stakeholders a much clearer picture of what Product was planning. It was also helpful for the development team to unite around a shared vision of what they were building.

Vision Mockups: Notebook and Timeline
Mockup: Progress of multi-stage operation
Pencil sketch: Gantt chart timeline
High-fidelity wireframe: Processing details

One of the more challenging features to design for Ascend was the timeline, which helps users observe where the system is spending time and resources. Since there are dependencies between operations, a Gantt chart was a natural choice. But start and stop times alone did not give users enough insight, because each operation was executed in pieces, with individual jobs being run simultaneously or in sequence as the logic of the operation and the system's available resources required. Representing all this activity as a single bar was losing too much information; but overplotting bar segments for each job would clutter the display and make the dependences harder to see.

The solution was keep the Gantt chart focused on the overall progress of the computation, but provide an affordance to drill down to get aggregate and individual job metrics. Working through the implementation required a collaborative effort with engineering to understand the constraints, propose various solutions, and evaluate them on the basis of level of effort and benefit to users in terms of the resulting depth of detail.

Conceptual Model: Dataflow orchestration

With a highly technical product like Ascend's, it can be challenging to conceptualize the system in a way which is neither too detailed nor too abstract. The Engineering team has their architectural diagrams, but we don't want to overload users with details that are not pertinent to their understanding of the system. On the other hand, if we give too little information, users will not be able to reason about how their interaction with the system affects its operation. A concise conceptual model, even if not presented to users directly, provides a foundation to the user experience, and a context for the vocabulary used in the interface.

Geospatial Analytics Portal

Orbital Insight

Mockup: Data downloads and API access

Orbital Insight provides geospatial data products and analytical tools across multiple industries and government sectors.

Mockup: Retail traffic data

Our initial data product offering was retail traffic time series data derived from satellite imagery of parking lots. While this data was mostly consumed via an API, a visualization UI was essential for customers to evaluate the data prior to purchasing the live data feed. This UI consisted of a series of charts which demonstrated the insights that could be drawn from the data, as determined by the Product Manager and Data Science team.

Mockup: Crude oil storage data

When we released our second data product, which required different analytics, the team created a new UI to showcase those unique insights. After creating the third bespoke data visualization UI, the Frontend Engineering team nearly revolted—we can't keep doing this!

Mockup: Front page, with product listing and curated daily insights

As a result, we designed a data portal product for geospatial analytic data. We identified key abstractions that were relevant to all of our data products—geographic regions, time series, unitless indices, categories—and devised navigation mechanisms along those axes. Working with the Product Managers from each of the domains, we found ways to maintain the unique visualizations for each product, while factoring out the common ones, a win for both the customer and our development team.

Mockup: Port Monitoring