Skip to content
All work

Phaidra · Software Engineer I

Mapping Plant Data at Scale

My first project at Phaidra: an internal tool engineers used to map a plant’s data. It came with no spec. I owned the product and UI side, and kept it fast as plants grew to thousands of components.

ReactTypeScriptVirtualizationProduct design
My part
Product and UI, from an open brief to production
Level
Software Engineer I
Worked with
Solution engineers, design and backend
Stack
React · TypeScript

01The problem

Before Phaidra's AI can work with a plant, the plant's data has to be mapped. Solution engineers did that mapping, plant by plant, in an internal tool.

This was the first project I owned, and it came with no spec and no agreed idea of how it should work. My part was the product and UI side: working out with the engineers who would use it what they needed, then building it.

This was internal product work, so the details of the product stay private. What follows is how I approached it, at the level I can share publicly.

02How I approached it

Start from the people using it

With no spec, I went back and forth with the solution engineers until we agreed on how it should work, then built it in pieces they could try early.

Trade-offA slower start, with weeks of back-and-forth before much code.

Make problems visible

The engineers' main job was spotting what was missing or wrong. I designed the UI so problems showed up at a glance, instead of hiding in long lists of values.

Trade-offMore UI to build than a plain form.

No code required

The people doing the mapping weren't programmers, so the tool let them build what they needed by picking and combining options instead of writing code.

Trade-offThe UI had to cover everything the underlying logic could do.

Size the UI for the real data

Some plants had more than 10,000 data sources, and a picker dialog crashed. Virtualization fixed the rendering. Then the backend team built a paginated search API, and I moved the picker onto it, keeping pagination and filters in the URL so a search survives a reload and can be shared. As plants grew to thousands of components, I paginated the tables and virtualized the heaviest views.

Trade-offEvery search is now a round trip to the backend, and the UI has to handle that.

03Outcome

  • No code required

    Engineers could do the mapping without writing code.

  • Problems at a glance

    Missing or broken pieces stood out instead of hiding in lists.

  • Held up at scale

    Stayed usable as plants reached thousands of components.

Next case study

Charts at a Million Points

Phaidra · Software Engineer II

esc
↑↓ to move↵ to select