
"Applying the scientific method to building AI products" from Eugene Yan in https://eugeneyan.com/writing/eval-process
Notebook Walkthrough
Google Colab
colab.research.google.com
Generate traces to annotate
We will generate some LLM traces and send them to Phoenix. We will then annotate these traces to add labels, scores, or explanations directly onto specific spans.Launch Custom Annotation UI
Visit our implementation here: https://phoenix-trace-annotator.lovable.app/Note: This annotation UI was built for Phoenix Cloud demo purposes and is not optimized for high-volume trace workflows.
- Enter your Phoenix Cloud endpoint, API key, and project name. Optionally, also include an identifier to tie annotations to a specific user.
- Click Refresh Traces.
- Select the traces you want to annotate and click Send to Phoenix.
- See your annotations appear instantly in Phoenix.
Create a dataset from annotated spans
Build an Eval based on annotations
Next, you will construct an LLM-as-a-Judge template to evaluate your experiments. This evaluator will mark nonsensical outputs as incorrect. As you experiment, you’ll see evaluation results improve. Once your annotated trace dataset shows consistent improvement, you can confidently apply these changes to your production system.Experimentation Example: Improving the System Prompt
The next step is to form a hypothesis about why some outputs are failing. In our full walkthrough, we demonstrate the experimentation process by testing out different hypotheses such as swapping out models. However, for demonstration purposes, we will show an experiment that will almost certainly improve your results: modifying the weak system prompt we originally used.Applying Improvements
Now that we’ve completed a successful experimentation cycle and confirmed our improvements on the annotated traces dataset, we can update the application and test the results on the broader dataset. This helps ensure that improvements made during experimentation translate effectively to real-world usage and that your system performs reliably at scale.Tips for building your custom annotation UI
Here is a sample prompt you can feed into Lovable (or a similar tool) to start building your custom LLM trace annotation interface. Feel free to adjust it to your needs. Note that you will need to implement functionality to fetch spans and send annotations to Phoenix. We’ve also included a brief explanation of how we approached this in our own implementation. A tool like this can benefit teams that want to collect human annotation data without requiring annotators to work directly within the Phoenix platform. You can also configure features like “thumbs up” and “thumbs down” buttons to streamline filling in annotation fields. Once submitted, the annotations immediately appear in Phoenix. Prompt for Lovable: Build a platform for annotating LLM spans and traces:- Connect to Phoenix Cloud by collecting endpoint, API Key, and project name from the user
- Load traces and spans from Phoenix (via REST API or Python SDK).
- Display spans grouped by trace_id, with clear visual separation.
- Allow annotators to assign a label, score, and explanation to each span or entire trace.
- Support sending annotations back to Phoenix and reloading to see updates.
- Use a clean, modern design
- Built in Lovable for easy UI generation.
- Allows loading LLM traces, displaying spans grouped by trace_id, and annotating spans with label, score, explanation.
- Hosted on Render using FastAPI.
- Adds CORS for your Lovable frontend to communicate securely.
-
Uses two key endpoints:
- GET /v1/projects/{project_identifier}/spans
- POST /v1/span_annotations

