forked from emmeryn/autocompaste-html
-
Notifications
You must be signed in to change notification settings - Fork 0
/
instructions.html
87 lines (79 loc) · 5.68 KB
/
instructions.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
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>CS4249 Assignment 1 - AutoComPaste vs Ctrl-C Ctrl-V</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>
<body>
<!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<nav class="navbar navbar-default">
<div class="container">
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="index.html">Welcome</a></li>
<li><a href="questionnaire-pre.html">Pre Questionnaire</a></li>
<li class="active"><a href="instructions.html">Instructions</a></li>
<li><a href="experiment.html">Experiment</a></li>
<li><a href="questionnaire-post.html">Post Questionnaire</a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h1>Instructions</h1>
<hr>
<p>Dear participant <span class="js-pid pid"></span>, please read carefully the instructions before the experiment.</p>
<p>Once you press the button "Start", the experiment will begin.</p>
<p>The experiment should last less than 45 minutes.</p>
<p>With this experiment, we want to compare the efficiency, accuracy and learnability of two copy-pasting technique. Thus, you are asked to be focused during the experiment and try to finish as fast as you can, while making as few mistakes as possible.</p>
<p>Once you press "Start", you will have an interface like this one:</p>
<img src="img/interface.png" alt="HTML5 Icon" width="900" height="400">
<p>There are 2 panels (left and right)</p>
<p>The left panel is composed of:</p>
<p style="text-indent:1em">* an array that indicates:</p>
<p style="text-indent:2em">- the technique you have to use: "TRADITIONAL" or "AUTOCOMPASTE":</p>
<p style="text-indent:3em">1) "Traditional". This is the usual technique using the keyboard : ctrl+C to copy and ctrl+V to paste.</p>
<p style="text-indent:3em">2) "AutoComPaste". This technique uses autocompletion. When you start to type, it shows you possible continuation of your sentence. You can choose then with the arrows on your keyboard and press enter to select it.</p>
<p style="text-indent:2em">- the granularity of the passage you have to copy-paste: "paragraph", "sentence" or "word"</p>
<p style="text-indent:2em">- whether you know the answer or no. Two possibilities:</p>
<p style="text-indent:3em">1) "known". In this case, the answer is prompted in the green area. <strong>This is important</strong>: if the technique is traditional, you still have to find the answer in the right panel. <strong>You are not allowed</strong> to copy-paste it directly from the green area! However, if the technique is autocompaste, you can directly type in the text editor (which is in the right panel).</p>
<p style="text-indent:3em">2) "unknown". In this case, the answer is not prompted, and you have to find it in the different articles in the right panel.</p>
<p>Remark: the answer you have to copy-paste will always be highlighted in yellow, even if it is prompted in the green area.</p>
<p style="text-indent:2em">- the number of block: current block / total number of block. Each block is identical and is composed of 36 trials.</p>
<p style="text-indent:2em">- the number of trial: current trial within the current block / total number of trial. Each trial correspond to a task.</p>
<p>To perform a task, you have to copy-paste the answer of the question that is asked in the red area, and then click "Next Task".</p>
<p>You are know ready to start the experiment. If you have any question, please ask Antoine before clicking "Start", since the timer will start then.</p>
<p>And remember, try to stay focused, and be as accurate and fast as possible. Okey ? Let's go then !</p>
<form class="form-inline">
<button type="submit" class="btn btn-primary btn-lg">Start</button>
</form>
</div>
</div>
</div>
<script src="js/vendor/jquery-1.11.2.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/DataStorage.js"></script>
<script src="js/ACPToolKit.js"></script>
<script src="js/main.js"></script>
<script>
$(function () {
$('form').submit(function (event) {
event.preventDefault();
window.location = 'experiment.html';
});
});
</script>
</body>
</html>