https://joymeter.uk/about.html

1<html lang="en">
2<head>
3 <title>JoyMeter - About</title>
4 <meta charset="utf-8"/>
5 <meta name="viewport" content="width=device-width, initial-scale=1">
6 <link rel="icon" type="image/svg+xml" href="favicon.svg">
7 <link rel="alternative icon" href="favicon.ico" />
8 <link rel="stylesheet" type="text/css" href="css/index.css">
9<style>
10.twoCol{
11  display: grid;
12  grid-template-columns: 1fr 4fr;
13  height: 60px;
14  text-align: center;
15  max-width: 400px;
16}
17.collapsible {
18  border-radius: 8px 8px 0px 0px;
19  border: none;
20  color: green;
21  font-weight: lighter;
22  text-decoration: none;
23  display: inline-block;
24  font-size: 16px;
25  text-align: left;
26  width: 100%;
27  cursor: pointer;
28  padding: 18px;
29  outline: none;
30  background-color: #ddd; /* Green */
31  margin-bottom: 0px;
32}
33h3.collapsible {
34  width:  95%;
35  height: 28px;
36  padding-top: 5px;
37  margin-left: 5%;
38}
39.indent {
40  width:  95%;
41  margin-left: 5%;
42}
43.active, .collapsible:hover {
44  background-color: #ddd;
45}
46
47.collapsible:after {
48  content: '\002B';
49  color: white;
50  font-weight: bold;
51  float: right;
52  margin-left: 5px;
53}
54
55.active:after {
56  content: "\2212";
57}
58
59.content {
60  border-radius: 0px 0px 8px 8px;
61  padding: 0 18px;
62  max-height: 0;
63  overflow: hidden;
64  transition: max-height 0.2s ease-out;
65  background-color: #f1f1f1;
66}
67</style>
68</head>
69
70<body class='consent' style="padding:20px">
71  <img src='svg/renew_oxford_logo.svg' alt="University of Oxford" style='float:right; width:200px;'>
72  <br>
73  <h1 onclick='goJoyMeter()'>JoyMeter</h1>
74  <p>Discover your energy</p>
75  <p>A data sharing service as part of the ReNEW project at the University of Oxford</p>
76<h2 class="collapsible">Why should I take part?</h2>
77<div class="content">
78<p>Many reasons: climate, energy, empowering decisions, democratising data, fight fuel poverty, support energy science, national statistics...</p>
79<p>Your benefits:</p>
80<ul>
81  <li>Easily track your activities, enjoyment and thermal comfort</li>
82  <li>Access your smart meter data</li>
83  <li>Learn how your energy use differs to comparable households</li>
84  <li>See which of your activities drive most demand</li>
85  <li>Get personalised feedback to take you on a journey to a low carbon life</li>
86</ul>
87<p>From the data we collect, tools will be developed to give households targeted advice on some of the most challenging decisions ahead of us, such as:</p>
88<ul>
89  <li>What are the most effective changes I can make to reduce my emissions and my bills?</li>
90  <li>When is the right time for me to make technology upgrades? E.g. could a heat pump work for me?</li>
91  <li>Do my changes make a difference? Track how your emissions reduce with time.</li>
92  <li>Are the technologies in my home performing as they should?</li>
93</ul>
94
95<p>The activity diaries and energy data you submit with JoyMeter may seem innocuous individually. At scale, they can provide important insights for some of our greatest challenges for energy and climate change.</p>
96<video width="100%" controls>
97  <source src="vid/intro.mp4" type="video/mp4">
98</video>
99
100</div> <!-- why do it -->
101
102  <h3 class="collapsible">Climate</h3>
103    <div class="content indent">
104    <p>International agreements set out to prevent global temperature rises to 1.5°C. We are already at 1.1°C. Urgent and meaningful action is required at global, national, local and personal level.
105    Energy is responsible for 80% of human greenhouse-gas emissions. This is where we can make a big difference.
106    </p><p>
107    JoyMeter data is used for research into the way we use energy and how we can make the journey to net zero emissions fast and fair.
108    </p>
109  </div> <!-- Climate -->
110
111  <h3 class="collapsible">Energy</h3>
112  <div class="content indent">
113    <img src='png/ccc20.png' style='float: right; max-width: 100%; margin: 10px'>
114    <p>The UK has halved the emissions from electricity generation in the last decade. A kWh used to cause over 500g of CO<sub>2</sub> - now it is less that 250g. A great success with more to come.</p>
115    <p>As we drive this number closer to zero, with cheaper wind and solar power, new challenges emerge. Even with the best supply in the world, changes to the way 

115we use energy are inevitable.</p>
116    <p>The Committee on Climate Change estimates that 59% of measures needed for us to meet our targets involve "behavioural and societal" changes, i.e. we have to make changes ourselves.</p>
117    <p>JoyMeter observes these changes over time and helps to identify which ones are effective and agreeable, and where we should tread carefully if we want to bring everyone onto the zero carbon journey.</p>
118  </div>
119  <h3 class="collapsible">Empowering decisions</h3>
120  <div class="content indent">
121    <p>So what can I do? This is a question JoyMeter helps to address. The problem is that we all use energy in very different ways and quantities. Blanket policies and generic advice can only get us so far.</p>
122    <p>Your smart meter data is a powerful source of information that can help our understanding of your energy needs and opportunities for effective measures. The patterns of gas and electricity demand can reveal helpful insights where and when we may be using too much energy and what simple changes can help us reduce our demand. For some people that could be as simple as turning the thermostat down when not at home (or have a smart device do it for us), for others it may be time to replace the fridge or invest in some insulation or draft proofing. With the right data driven tools we can narrow down which measure is right for you. Better still, we can ensure that the expected saving have been achieved by collecting these data after making a change. At scale this learning from data can result in powerful advice tools on the best measures for your particular energy use profile.</p>
123    <img src='png/hp2.png' style='width: 100%; margin: 10px'>
124    <p>We want to <b>democratise data</b>. As things stand it is really difficult for you to access your smart meter data, let alone process it in a way that is useful for you. Our ambition is to translate confusing smart meter data into meaningful and helpful messages. Ultimately everyone should have access to their data and services that allow them to extract value from it.</p>
125  </div>
126
127  <h3 class="collapsible">Fighting fuel poverty</h3>
128  <div class="content indent">
129    <p>Britain is a wealthy country, and yet, millions of people live in fuel poverty. Many of us cannot afford to stay warm or have to pay over the odds because of poorly insulated homes with inefficient appliances.</p>
130    <p>Smart meter data can help to track down homes with 'easy wins', where a small grant could make a big difference. At the same time we can make sure that any interventions or policy measures do not inadvertently disadvantage fuel poor homes further. Imagine being sold a heat pump that locks households into higher bills for years to come. With smart meter data we can ensure that systems perform as promised.</p>
131    <p>The data we collect is made available for research. Data scientists can tease out how we can best make progress towards our net zero climate ambitions. If we hit any stumbling blocks, for instance because technologies do not perform as we expected, or result in new practices with different energy demands, we better know about it sooner rather than later. JoyMeter data can form part of this early warning system.</p>
132  </div>
133
134<h2 class="collapsible">What do I have to do?</h2>
135<div class="content">
136    <p>You don't <i><b>have</b></i> to do anything. Record as many or as few activities as you like. You also have the option to link your smart meter (if you have one) to allow us to share your data with you.</p>
137  <p>We may contact you via email to invite you to special study days. On these days we may encourage you to record activities or to try out changes to your energy practices. Again, all this is entirely voluntary and optional.</p>
138</div> <!-- how it works -->
139
140  <h3 class="collapsible">Login</h3>
141  <div class="content indent">
142    <img src='png/login.png' style='width:100%; max-width: 300px; margin: 10px'>
143    <p>No need for user names or passwords - phew. Just enter your email and we send you a code to verify it is you. Type that in and you are good to go. It is that simple.</p>
144    <p>

144If you don't get the email, do check your junk folder - that happens a lot!</p>
145  </div>
146
147  <h3 class="collapsible">Using multiple devices</h3>
148  <div class="content indent">
149    <p>JoyMeter is available as a <a href='https://joymeter.uk'>website</a> for desktop and mobile devices. You can use the app <br><a target='_blank' href='https://play.google.com/store/apps/details?id=uk.joymeter.Activities'><img src='png/google-play.png' alt='Google Play' style='width: 180px; margin:10px'></a><a target="_blank" href='https://itunes.apple.com/us/app/joymeter/id1449269656?ls=1&mt=8'><img src='png/app-store.png' alt='App Store' style='width: 180px; margin:10px'></a>.
150    </p>
151    <p>Start recording with any of them and pick up where you left off. So long as you use the same email address, all your records will be synced up.</p>
152    <p>For security reasons you have to provide your smart meter details for each device separately.</p>
153  </div>
154
155  <h3 class="collapsible">Protecting your data</h3>
156  <div class="content indent">
157    <p>Privacy is precious. To make sure only you can access the data you submit we use your email to verify it's you.</p>
158    <p>When you receive a code or a personalised link from us via email, do not share it with people you don't want to access these data.</p>
159    <p>If other people have access to this device, make sure to log out from the main menu:
160    <div class="btn menu twoCol">
161      <div><img src='svg/user.svg' height=50px></div>
162      <div class="btn-title">Log out</div>
163    </div>
164    </p>
165  </div>
166<!-- 
167    <div class='buttons' style='width: 80%; height: 60px; text-align: center'>
168style="background-image: url(&quot;svg/abort.svg&quot;); background-position: left center;"
169-->
170<a name="use" id="use"></a>
171<h2 class="collapsible">Using JoyMeter</h2>
172<div class="content">
173  <p>JoyMeter is designed to be easy to use and largely self-explanatory. How much you use it is entirely up to you. We may email you and suggest particular days on which we would like to encourage you to keep a diary. If you feel it is becoming a burden, don't do it.</p>
174  <p>When you record a lot of activities you can reach star status <img src='png/stars.png' style='width:155px; vertical-align:top'></p>
175  <p><button class='btn-green' onclick='goJoyMeter()'>Back to JoyMeter</button></p>
176</div>
177  <h3 class="collapsible">The tabs</h3>
178  <div class="content indent">
179    <p>At the top you always have four tabs:</p>
180    <img src='png/menu.png' style='width:80%; margin:10px'>
181    <p><b>Menu</b>: The main overview of options.</p>
182    <p><b>Diary</b>: Add, view and edit activities.</p>
183    <p><b>Data</b>: Energy, activities and enjoyment as graphs.</p>
184    <p><b>Help</b>: Toggle additional explanations for each button.</p>
185  </div>
186  <h3 class="collapsible">Diary</h3>
187  <div class="content indent">
188    <p>This tab lists the activities you have recorded</p>
189    <img src='png/acts.png' style='min-width:230px; max-width:80%; margin-bottom:10px'>
190    <p><b>Add activity</b>: Start a new entry. Tip: tap the clock to set the time when recording past activities. You can also make changes to the times by tapping them in the list below.</p>
191    <p><b>List view</b>: Scroll through past activities. Tap time, description or the enjoyment symbol to change them.</p>
192  </div>
193  <h3 class="collapsible">Customising</h3>
194  <div class="content indent">
195    <p>Tap the description to make changes.</p>
196    <img src='png/edit.png' style='min-width:230px; max-width:80%; margin-bottom:10px'>
197    <p><b>Save</b>: If you want to reuse this description in future, save it and it will appear under <img src='png/MyCustomList.png' style='width:155px; vertical-align:top'></p>
198    <p><b>Delete</b>: Remove this activity</p>
199    <p><b>Back</b>: Return to the previous screen without changes</p>
200  </div>
201  <h3 class="collapsible">Link your smart meter</h3>
202  <div class="content indent">
203    <p>Unless you are already registered, the</p>
204    <p><img src='png/EnergyUse.png' style='width:155px; vertical-align:top'> </p>
205    <p>button let's you link your smart meter. For this you need the 16 digit number underneath the In-Home-Display that came with your smart meter.</p>
206    <img src='svg/GUID.svg' style='min-width:230px; max-width:80%; margin-bottom:10px'>
207    <p>We also ask for your postcode, to ensure that the number you provide really belongs to your address and that there are no typos in that code.</p>
208    <p>You will receive an email with a link ot the Terms and Conditions, which you 'sign' with that same postcode.</p>
209  </div>
210
211<h2 class="collapsible">How to find out more</h2>
212<div class="content">
213  <p>Have a look at recent research on <a href='https://www.energy-use.org'>Energy-Use.org</a> or contact us directly via
214  email <a href="mailto:[email protected]">[email protected]</a>
215  </p>
216  <p><button class='btn-green' onclick='goJoyMeter()'>Back to JoyMeter</button></p>
217
218</div>
219<br> <br> <br>

220<script>
221var coll = document.getElementsByClassName("collapsible");
222for (var i = 0; i < coll.length; i++) {
223  coll[i].addEventListener("click", function() {
224    this.classList.toggle("active");
225    var content = this.nextElementSibling;
226    if (content.style.maxHeight){ content.style.maxHeight = null;
227    } else { content.style.maxHeight = content.scrollHeight + "px"; } 
228  });
229}
230function goJoyMeter() {
231  if (window.self !== window.top) {
232    window.parent.postMessage('return#', '*');
233  } else {
234    window.location.href = 'index.php';
235  }
236}
237
238</script>

238
239</body>
240</html>