-
Notifications
You must be signed in to change notification settings - Fork 12
/
index.html
187 lines (162 loc) · 6.51 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
<!DOCTYPE html>
<html lang="en">
<head>
<title>How long will your experiment take?</title>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="experiment.css" rel="stylesheet">
<link rel="shortcut icon" href="http://mcfunley.com/static/eca435547eb/images/favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="libs.js"></script>
<script type="text/javascript" src="stats.js"></script>
</head>
<body>
<div class="container-fluid">
<header class="row-fluid">
<h1 class="">How long will your experiment take?</h1>
</header>
<div class="row-fluid question">
<div class="span7 offset1">
<label for="visits">
How many eligible visits do you have per day?
</label>
</div>
<div class="span1">
<input data-format="digits" id="visits" name="visits" placeholder="100,000"></input>
</div>
</div>
<div class="row-fluid error">
<div class="message span6 offset1">
</div>
</div>
<div class="row-fluid detail">
<div class="span7 offset1">
This is the number of people visiting your site that <em>could</em> see the change on a given day.
</div>
</div>
<div class="row-fluid question">
<div class="span7 offset1">
<label for="percentage">
What percentage of visits will see the change?
</label>
</div>
<div class="span1">
<input data-format="percent" id="percentage" name="percentage" placeholder="50%"></input>
</div>
</div>
<div class="row-fluid error">
<div class="message span6 offset1">
</div>
</div>
<div class="row-fluid detail">
<div class="span7 offset1">
<div class="secondary-calc" id="visits-seeing-change"></div>
</div>
</div>
<div class="row-fluid question">
<div class="span7 offset1">
<label for="conversion">
What is your current conversion rate?
</label>
</div>
<div class="span1">
<input data-format="percent" id="conversion" name="conversion" placeholder="4.0%"></input>
</div>
</div>
<div class="row-fluid error">
<div class="message span6 offset1">
</div>
</div>
<div class="row-fluid detail">
<div class="span6 offset1">
This is the percentage of your eligible visitors that currently complete your goal (e.g. purchasing or signing up).<br />
<div class="secondary-calc" id="converting-visitors"></div>
</div>
</div>
<div class="row-fluid question">
<div class="span7 offset1">
<label for="lift">
How will you change conversion?
</label>
</div>
<div class="span1">
<input data-format="percent" id="lift" name="lift" placeholder="+1.0%"></input>
</div>
</div>
<div class="row-fluid error">
<div class="message span6 offset1">
</div>
</div>
<div class="row-fluid detail">
<div class="span7 offset1">
This is the percent by which you predict you will change your base conversion rate. Use the minimum that would be worth the effort, or play with different values.<br/>
<span class="secondary-calc" id="treatment-conversion"></span><br />
<span class="secondary-calc" id="treatment-daily-conv"></span><br />
<span class="secondary-calc" id="treatment-conv-diff"></span>
</div>
</div>
<div class="row-fluid error">
<div class="message span6 offset1">
</div>
</div>
<div class="row-fluid question">
<div class="span7 offset1">
<label for="confidence">
How confident do you want to be of this?
</label>
</div>
<div class="span1">
<input data-format="percent" id="confidence" name="confidence" placeholder="95%"></input>
</div>
</div>
<div class="row-fluid error">
<div class="message span6 offset1">
</div>
</div>
<div class="row-fluid detail">
<div id="confidence-detail" class="span6 offset1">
If you are 95% confident in a result, this implies that with 5% probability the observed difference is in fact due to chance.
</div>
</div>
<div class="row-fluid question">
<div class="span7 offset1">
<label for="power">
How likely should you be to detect the change?
</label>
</div>
<div class="span1">
<input data-format="percent" id="power" name="power" placeholder="80%"></input>
</div>
</div>
<div class="row-fluid error">
<div class="message span6 offset1">
</div>
</div>
<div class="row-fluid detail">
<div id="power-detail" class="span6 offset1">
</div>
</div>
<div id="answer-row" class="row-fluid">
<h1 id="answer" class=""></h1>
</div>
</div>
<footer>
<h5 class="row-fluid">By <a href="http://mcfunley.com">Dan McKinley</a>.
<span>
Fork this on <a href="https://github.com/mcfunley/experiment-model">Github</a>.
</span>
</h5>
<h5 class="row-fluid">
<div class="share">
<a class="bsky" href="https://bsky.app/profile/mcfunley.com">
<svg fill="none" viewBox="0 0 64 57" width="28" style="width: 28px; height: 24.9375px;"><path fill="#0085ff" d="M13.873 3.805C21.21 9.332 29.103 20.537 32 26.55v15.882c0-.338-.13.044-.41.867-1.512 4.456-7.418 21.847-20.923 7.944-7.111-7.32-3.819-14.64 9.125-16.85-7.405 1.264-15.73-.825-18.014-9.015C1.12 23.022 0 8.51 0 6.55 0-3.268 8.579-.182 13.873 3.805ZM50.127 3.805C42.79 9.332 34.897 20.537 32 26.55v15.882c0-.338.13.044.41.867 1.512 4.456 7.418 21.847 20.923 7.944 7.111-7.32 3.819-14.64-9.125-16.85 7.405 1.264 15.73-.825 18.014-9.015C62.88 23.022 64 8.51 64 6.55c0-9.818-8.578-6.732-13.873-2.745Z"></path></svg>
<span class="handle">@mcfunley.com</span>
</a>
</div>
</h5>
<h5 class="row-fluid">
<a class="club-index" href="http://dotclub.club">Part of the .club club</a>
</h5>
</footer>
</body>
</html>