Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Experiment Results Dashboard Block for Vue

Five running experiments with a bar for the sample reached, days left and interim lift, and number fields for the baseline rate and minimum effect that recompute the sample each arm needs and the finish date.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

Know when an experiment can be read, with this experiment results panel for Vue with Ark UI. A hairline frame with a plus mark on each corner lists five running experiments (Sign-up form, Homepage headline, Trial length, Upgrade prompt timing and Invite flow wording), each with its arms and visitors so far, a bar for the share of the needed sample it has reached, the days left at its daily traffic and the lift so far. Choose a row and the planner opens under it: two Number Input fields for the baseline conversion rate and the minimum effect you want to detect, and the sample each arm needs from the standard two-proportion formula at 80% power and 5% error, with the formula written out. Change either field and the need, the bar, the days left and the finish date recompute. "Stop now" marks an experiment stopped early and shows a warning about peeking. It's built from Number Input, Progress, Button and Guides. For experimentation and growth teams.

FAQ

How do I fill it with my experiments?

Edit EXPERIMENTS. Each has its number of arms, the baseline rate and minimum effect to start from, the visitors a day across all arms, the visitors reached in each arm, and the conversions of the control and of the leading variant. The need, the share reached, the days left, the finish date and the interim lift with its interval are all worked out from those.

Where does the needed sample come from?

From the usual two-proportion formula: the square of the sum of the z values for a 5% two-sided error (1.96) and 80% power (0.84), times the sum of the two variances, divided by the square of the difference. The baseline rate is the control's rate and the second rate is the baseline times one plus the minimum effect. The minimum effect is relative, so 10 means a rate of 8.2% must reach 9.02%.

Why does stopping early show a warning?

Reading the lift before the planned sample is in, and stopping when it looks good, makes false wins far more likely than the 5% you planned for. The warning says so with the share of the sample reached. Stopping here only marks the row, and Resume puts it back.

What stays local, and how do I wire it for real?

Everything: the counts are typed as of 11 Oct, the fields only change this page, and nothing is stopped. To make it real, read visitors and conversions per arm from your experimentation service every day, and send Stop to its API from the button's handler. A field outside its range is brought back inside it when you leave the field.

How does it look on a phone?

Each experiment is three short lines (name and share, the bar, then arms and finish), and the planner opens under the chosen row with the two fields side by side and the four figures two to a row.