Compare commits

...

17 Commits

Author SHA1 Message Date
Jan
807d104d06 Adding disclaimer as seperate site 2024-11-19 15:58:23 +01:00
Jan
053aa4bd5a Added new disclaimer Video 2024-11-19 14:22:55 +01:00
Jan
40e24501f6 Removed the hopefuly last placeholdervideo 2024-11-13 11:16:41 +01:00
Jan
522d10f422 Small file naming typo fixed 2024-11-13 11:05:52 +01:00
Jan
789d49a2c9 Fixed error in p3info text 2024-11-13 11:02:41 +01:00
Jan
86c5f3fdea Final changes (deploy without exp videos) 2024-11-12 16:17:07 +01:00
Jan
26c28cd0da 0044 as learning phase video now 2024-10-23 15:51:42 +02:00
Jan
e1b814da4f new Videos and task 3 Text corrected 2024-10-23 14:20:07 +02:00
Jan
edcd32db47 small improvement to video management page 2024-10-13 16:13:03 +02:00
Jan
e253586467 video management page now exists 2024-10-13 16:09:42 +02:00
Jan
728c282a3d try to remove database via git 2024-10-13 15:42:25 +02:00
Jan
23e6ee55c6 multiple choice bug fixed 2024-10-13 15:29:30 +02:00
Jan
52db4cc0fb fixed small bug 2024-10-13 15:22:18 +02:00
Jan
2702ce3c3c password is checked via hash now 2024-10-13 15:18:14 +02:00
Jan
ab27d70946 More fixes, those are the final texts !!! 2024-10-07 14:05:43 +02:00
Jan
73fc70917c Small fixes 2024-10-07 12:16:42 +02:00
Jan
8898f7dfb8 root page now redirects to start, /all_links exists 2024-10-07 10:29:54 +02:00
41 changed files with 1426 additions and 122 deletions

View File

@@ -15,9 +15,9 @@ from sqlalchemy.orm import DeclarativeBase
import os import os
import csv import csv
from zipfile import ZipFile from zipfile import ZipFile
import hashlib
random_order = True # activate environment: cd C:\...\...\....\...\Code\SLAEForms Testing\.venv\Scripts\
# activate environment: cd C:\Users\Jan\Google Drive\Master Stuff\Code\SLAEForms Testing\.venv\Scripts\
# then this: activate # then this: activate
#SETUP-------------------------------------------------- #SETUP--------------------------------------------------
@@ -41,7 +41,7 @@ app.secret_key = b"29fe9e8edd407c5491d4f1c05632d9fa33e26ed8734a3f5e080ebac3772a5
UPLOAD_FOLDER = 'uploads' UPLOAD_FOLDER = 'uploads'
EXPORT_FOLDER = 'exports' EXPORT_FOLDER = 'exports'
PASSWORD = '#1ACGmsjd' PASSWORD = 'd5aff9fc14d1f20f4ccddaa8b4f2c1765228b74ed0b1dfb868bf1064e0d655e2'
CONFIGFILE = 'userstudy1.json' CONFIGFILE = 'userstudy1.json'
# CONFIGFILE = 'test.json' # CONFIGFILE = 'test.json'
# CONFIGFILE = 'default.json' # CONFIGFILE = 'default.json'
@@ -191,6 +191,7 @@ def startpage():
case "single_video": case "single_video":
order = list(config[name]["stimuli"]["list"]) # order = list of simuli keys order = list(config[name]["stimuli"]["list"]) # order = list of simuli keys
print("order: ",order) print("order: ",order)
if "order" in config[name]["stimuli"]:
if config[name]["stimuli"]["order"] == "random": if config[name]["stimuli"]["order"] == "random":
random.shuffle(order) #in random order random.shuffle(order) #in random order
session["block_order"][name] = order session["block_order"][name] = order
@@ -540,7 +541,7 @@ def export_all_videos():
with ZipFile('zip_exports/all_videos.zip', 'w') as zipf: #no compression, need to add zipfile.ZIP_DEFLATED for compression with ZipFile('zip_exports/all_videos.zip', 'w') as zipf: #no compression, need to add zipfile.ZIP_DEFLATED for compression
zipdir('uploads/', zipf) zipdir('uploads/', zipf)
return send_file("zip_exports/all_videos.zip", as_attachment=False, download_name="all_tables.zip") return send_file("zip_exports/all_videos.zip", as_attachment=False, download_name="all_videos.zip")
def create_csv(table, filename): def create_csv(table, filename):
@@ -615,6 +616,39 @@ def show_tables():
tables = meta.tables tables = meta.tables
return render_template('show_tables.html', tables=tables) return render_template('show_tables.html', tables=tables)
@app.route("/manage_uploads")
def manage_uploads():
if not session.get("logged_in"):
return redirect("/login")
videodir = "uploads/"
videolist = os.listdir(videodir)
num_videos = len(videolist)
return render_template("manage_uploads.html", videolist=videolist, num_videos=num_videos)
@app.route("/deleteuploads", methods=["POST"])
def deleteuploads():
if not session.get("logged_in"):
return redirect("/login")
print("deleting all videos")
videodir = "uploads/"
for video in os.listdir(videodir):
os.remove(os.path.join(videodir, video))
print("videos deleted")
return redirect("/all_links")
@app.route("/task3")
def task3():
return render_template("task3.html")
# Root page ----------------------------- # Root page -----------------------------
@@ -622,9 +656,10 @@ def show_tables():
def login(): def login():
if request.method == "POST": if request.method == "POST":
if request.form["password"] == PASSWORD: pwhash = hashlib.sha256(request.form["password"].encode('utf-8')).hexdigest()
if pwhash == PASSWORD:
session["logged_in"] = True session["logged_in"] = True
return redirect("/") return redirect(url_for("all_links"))
return render_template("login.html") return render_template("login.html")
@@ -640,6 +675,10 @@ def has_no_empty_params(rule):
return len(defaults) >= len(arguments) return len(defaults) >= len(arguments)
@app.route("/") @app.route("/")
def root():
return redirect("/start")
@app.route("/all_links")
def all_links(): def all_links():
links = [] links = []
for rule in app.url_map.iter_rules(): for rule in app.url_map.iter_rules():

View File

@@ -88,7 +88,7 @@ dialog .iframe-container {
max-width: 1690px; max-width: 1690px;
/* Maximum width to keep it from getting too wide on large screens */ /* Maximum width to keep it from getting too wide on large screens */
padding: 20px; padding: 20px;
background-color: #7b8cdb; background-color: #b6c3ff; /* used to be 7b8cdb */
/* Just for visual differentiation */ /* Just for visual differentiation */
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
} }
@@ -143,6 +143,10 @@ label {
width: 60%; width: 60%;
} }
button {
border: 1px solid #000;
}
/* buttons */ /* buttons */
.buttondisable { .buttondisable {
filter: invert(65%); filter: invert(65%);
@@ -160,6 +164,7 @@ label {
/* Optional: rounds the corners of the button */ /* Optional: rounds the corners of the button */
width: auto; width: auto;
float: right; float: right;
border: 1px solid #000;
} }
#submitbutton:hover { #submitbutton:hover {
@@ -219,7 +224,7 @@ h2 {
height: 70px; height: 70px;
/* Set a specific height for the buttons */ /* Set a specific height for the buttons */
background-color: #cae4ff; background-color: #cae4ff;
border: none; border: 1px solid #000;
color: white; color: white;
padding: 10px 20px; padding: 10px 20px;
margin: 0 10px; margin: 0 10px;
@@ -269,6 +274,7 @@ video {
width: auto; width: auto;
height: auto; height: auto;
margin: auto auto; margin: auto auto;
display: block;
} }
iframe { iframe {
@@ -285,12 +291,29 @@ iframe {
} }
.iframe-container { .iframe-container {
position: relative;
/*padding-bottom: 56.25%;*/
/* 16:9 */
padding-bottom: 100%;
/* 1:1 */
height: 0;
}
.iframe-container2 {
position: relative; position: relative;
padding-bottom: 56.25%; padding-bottom: 56.25%;
/* 16:9 */ /* 16:9 */
height: 0; height: 0;
} }
.iframe-container2 iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.video-container { .video-container {
max-width: 100%; max-width: 100%;
position: relative; position: relative;

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@@ -12,11 +12,6 @@
<div class="container"> <div class="container">
<h2>Datenschutzerklärung</h2> <h2>Datenschutzerklärung</h2>
<video controls>
<source src="{{ url_for('static', filename='videos/platzhalter-video.mp4') }}" type="video/mp4">
</video>
<div class="spacer" aria-hidden="true" style="height:20px"></div>
<div class="textblock"> <div class="textblock">
<h3> <h3>
Information betroffener Personen zur Verarbeitung personenbezogener Daten Information betroffener Personen zur Verarbeitung personenbezogener Daten

View File

@@ -1,5 +1,5 @@
<div style="margin: auto; max-width: 80%;"> <div style="margin: auto; max-width: 80%;">
<p>Demographic Question Info:</p> <p>Demografische Fragen:</p>
<ol start="1"> <ol start="1">
<li>Wie alt sind sie?</li> <li>Wie alt sind sie?</li>
<li>Wie ist ihr Geschlecht? <li>Wie ist ihr Geschlecht?
@@ -55,7 +55,7 @@
<li>Sonstige</li> <li>Sonstige</li>
</ol> </ol>
</li> </li>
<li>Haben sie schonmal Computeranimationen von Gebärdensprache gesehen? (Gebärdenavatare) <li>Haben sie schonmal Computeranimationen von Gebärdensprache gesehen? (Gebärdensprachavatare)
<ol> <ol>
<li>Ja</li> <li>Ja</li>
<li>Nein</li> <li>Nein</li>

View File

@@ -18,8 +18,7 @@
</p> </p>
<p> <p>
Wir würden uns freuen, wenn Sie die Studie mit anderen Gehörlosen oder Personen, die Gebärdensprache Wir würden uns freuen, wenn Sie die Studie mit anderen Gehörlosen oder Personen, die Gebärdensprache
sprechenden, teilen würden: <a> sprechenden, teilen würden: <a href="https://slaeforms.leafbla.de/start">https://slaeforms.leafbla.de/start</a>
href="https://slaeforms.leafbla.de/start">https://slaeforms.leafbla.de/start</a>
</p> </p>
<p> <p>
Falls Sie noch Fragen oder Anmerkungen haben, schreiben Sie uns unter: avatarstudy@proton.me Falls Sie noch Fragen oder Anmerkungen haben, schreiben Sie uns unter: avatarstudy@proton.me

View File

@@ -13,6 +13,9 @@
<h2>Impressum</h2> <h2>Impressum</h2>
<div class="textblock"> <div class="textblock">
<p>
Datenschutzerklärung: <a href="{{ url_for('datenschutz') }}" target="_blank">Datenschutz</a>
</p>
<p> <p>
Verantwortlicher für slaeforms.leafbla.de: Jan Dickmann, zusammen mit dem DFKI Saarbrücken, Affective Computing Group Verantwortlicher für slaeforms.leafbla.de: Jan Dickmann, zusammen mit dem DFKI Saarbrücken, Affective Computing Group
</p> </p>

View File

@@ -12,24 +12,19 @@
<div class="container"> <div class="container">
<h2>SLAEFORMS Gebärdensprachavatar Studie</h2> <h2>SLAEFORMS Gebärdensprachavatar Studie</h2>
<video controls>
<source src="{{ url_for('static', filename='videos/platzhalter-video.mp4') }}" type="video/mp4">
</video>
<div class="spacer" aria-hidden="true" style="height:20px"></div>
<div class="spacer" aria-hidden="true" style="height:20px"></div>
<div class="textblock"> <div class="textblock">
<p style="font-size: 22px;"> <p style="font-size: 22px;">
Bei allen Aufgaben in dieser Studie gibt es ein Erklärvideo, in dem die Aufgabe und die Antwortmöglichkeiten in Gebärdensprache erklärt werden. Bei allen Aufgaben in dieser Studie gibt es Texte, in denen die Aufgaben und die Antwortmöglichkeiten erklärt werden.
Falls Sie Fragen haben oder eine Aufgabe nicht verstehen, können Sie den "Gebärdensprach"-Button auf der rechten Seite des Bildschirms klicken, um das Video und den Erklärtext zu sehen. Falls Sie Fragen haben oder eine Aufgabe nicht verstehen, können Sie den "Info"-Button auf der rechten Seite des Bildschirms klicken, um den Erklärtext zu sehen.
Sie können den Button nochmal anklicken, um wieder zur Aufgabe zurückzukommen. Sie können den Button nochmal anklicken, um wieder zur Aufgabe zurückzukommen.
</p> </p>
<div style="margin: auto; display: block; max-width: 90px;"> <div style="margin: auto; display: block; max-width: 90px;">
<button style="margin: auto; max-width: 90px;"><img class="infoButtonIcon" id="buttonInfoIcon" <button style="margin: auto; max-width: 90px;"><img class="infoButtonIcon" id="buttonInfoIcon"
src="{{ url_for('static', filename='icons/sl-icon.png')}}" alt="sign-language-icon"></button> src="{{ url_for('static', filename='icons/info-icon.png')}}" alt="info-icon"></button>
</div> </div>
<p style="font-size: 22px; text-align: center;"> <p style="font-size: 22px; text-align: center;">
Der Gebärdensprach-Button. Das ist der Info-Button.
</p> </p>
</div> </div>

View File

@@ -0,0 +1,52 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css')}}"" /> <!-- styles.css {{ url_for('static', filename='styles.css')}}-->
<link rel=" shortcut icon" href="{{ url_for('static', filename='icons/favicon.ico') }}">
<title>DGS Avatar Study</title>
</head>
<body>
<div class="container" style="height: 100%; font-size: 22px;">
<h2>Upload management</h2>
<div class="textblock">
<p>
Anzahl Videos: {{ num_videos }}
</p>
<p>
Die aktuellen Videos:
</p>
</div>
{% for video in videolist %}
<p>{{video}}</p>
{% endfor %}
<div class="textblock">
<p>
Download <a href="{{ url_for('export_all_videos') }}" target="_blank">hier</a>.
</p>
</div>
<form class="dsgvoform" action="{{ url_for('deleteuploads') }}" method="post">
<label for="terms-and-conditions">
<input class="inline" id="terms-and-conditions" type="checkbox" required name="terms-and-conditions" />
Alle Videos löschen.
</label>
<div class="button-container">
<button id="submitbutton" type="submit">Löschen</button>
</div>
</form>
<div class="spacer" aria-hidden="true" style="height:50px"></div>
</div>
</body>
<footer>
<div class="container" style="font-size: 19px;">
<a href="{{ url_for('startpage') }}" target="_blank">Startseite</a>
<a href="{{ url_for('impressum') }}" target="_blank">Impressum</a>
<a href="{{ url_for('datenschutz') }}" target="_blank">Datenschutz</a>
</div>
</footer>
</html>

View File

@@ -0,0 +1,77 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css')}}"" /> <!-- styles.css {{ url_for('static', filename='styles.css')}}-->
<link rel=" shortcut icon" href="{{ url_for('static', filename='icons/favicon.ico') }}">
<title>DGS Avatar Study</title>
</head>
<body>
<div class="container">
<h2>SLAEFORMS Gebärdensprachavatar Studie</h2>
<div class="textblock">
<div style="margin: auto; font-size: 20px;">
<p>
Hallo und willkommen zu dieser Studie, danke für Ihre Teilnahme.
</p>
<p>
In dieser Studie geht es um die Entwicklung von Gebärdensprachavataren.
</p>
<p>
Bitte beachten Sie, dass diese Avatare noch in einer frühen Entwicklungsphase und noch nicht für den
Gebrauch in einer App/einem Computerprogramm oder auf einer Webseite geeignet sind. In dieser Studie
geht es darum, einzelne Aspekte der Avatare und neue technologische Ansätze zu testen. Dementsprechend
haben die Avatare noch viele offensichtliche Schwächen, wie zum Beispiel, dass bisher nur die Arme und
der Oberkörper, aber nicht das Gesicht animiert ist. Bitte bewerten Sie nur die Qualität der Hände und
Arme.
</p>
<p>
Diese Studie richtet sich an Menschen, die Gebärdensprache beherrschen, insbesondere gehörlose Menschen.
Nehmen Sie bitte nur Teil, wenn Sie (Deutsche) Gebärdensprache beherrschen.
Die Studie dauert ca. 20 Minuten.
</p>
<p>
Während der Studie werden sie sich Videos anschauen, diese bewerten und Feedback dazu geben können.
Verwenden Sie deshalb bitte, wenn möglich ein Gerät mit einem großen Bildschirm (Laptop, PC, Tablet) für
Ihre Teilnahme, damit Sie die Videos in ausreichender Größe sehen können.
</p>
<p>
Sie haben während der Studie die Möglichkeit (optional) Videofeedback zu geben, dazu brauchen sie eine
Webcam. Die Videos werden nicht veröffentlicht und nur Übersetzern zur Auswertung der Studienergebnisse
gezeigt.
</p>
<p>
Das Laden der Seiten kann manchmal einige Sekunden dauern. Falls es zu einem Fehler kommen sollte und ein Video nicht geladen wird, versuchen Sie bitte die Seite neu zu laden.
</p>
<p>
Für jeden Teil der Studie gibt es einen Text, der die Fragestellung und die Antwortmöglichkeiten erklärt. Falls Sie den Text während der Studie nochmal sehen möchten, können Sie es
über den „Info“-Knopf auf der rechten Seite aufrufen.
</p>
<p>
Bitte versuchen sie während der Studie nicht auf die vorherige Seite "zurück" zu gehen, da sie nicht zu vorherigen Fragen zurück können.
</p>
</div>
</div>
<form class="dsgvoform" action="{{ url_for('sendpage') }}" method="post">
<div class="button-container">
<button id="submitbutton" type="submit">Weiter</button>
</div>
</form>
<div class="spacer" aria-hidden="true" style="height:80px"></div>
</div>
</body>
<footer>
<div class="container" style="font-size: 19px;">
<a href="{{ url_for('startpage') }}" target="_blank">Startseite</a>
<a href="{{ url_for('impressum') }}" target="_blank">Impressum</a>
<a href="{{ url_for('datenschutz') }}" target="_blank">Datenschutz</a>
</div>
</footer>
</html>

View File

@@ -12,10 +12,6 @@
<div class="container"> <div class="container">
<h2>SLAEFORMS Gebärdensprachavatar Studie</h2> <h2>SLAEFORMS Gebärdensprachavatar Studie</h2>
<video controls>
<source src="{{ url_for('static', filename='videos/platzhalter-video.mp4') }}" type="video/mp4">
</video>
<div class="spacer" aria-hidden="true" style="height:20px"></div>
<div class="textblock"> <div class="textblock">
{% include "p1infos.html" %} {% include "p1infos.html" %}

View File

@@ -1,6 +1,7 @@
<div style="margin: auto; max-width: 80%; font-size: 20px;"> <div style="margin: auto; max-width: 80%; font-size: 20px;">
<p>Studie Teil 2:</p> <p>Studie Teil 2:</p>
<p>Im Folgenden sehen Sie zwei Videos, in denen der gleiche Satz mit unterschiedlichen Formulierungen gebärdet wird.</p> <p>Im Folgenden sehen Sie zwei Videos, in denen der gleiche Satz mit unterschiedlichen Formulierungen gebärdet wird.</p>
<p>Der folgende Satz wird gebärdet: Einfahrt RE 77 Richtung Köln Hauptbahnhof über Hannover, Abfahrt 3:44 Uhr.</p>
<p>Bitte verwenden Sie die Punkteskala, um zu bewerten, welches der beiden Videos Sie besser finden.</p> <p>Bitte verwenden Sie die Punkteskala, um zu bewerten, welches der beiden Videos Sie besser finden.</p>
<ol start="1"> <ol start="1">
<li>Welche Formulierung war natürlicher?</li> <li>Welche Formulierung war natürlicher?</li>

View File

@@ -12,10 +12,6 @@
<div class="container"> <div class="container">
<h2>SLAEFORMS Gebärdensprachavatar Studie</h2> <h2>SLAEFORMS Gebärdensprachavatar Studie</h2>
<video controls>
<source src="{{ url_for('static', filename='videos/platzhalter-video.mp4') }}" type="video/mp4">
</video>
<div class="spacer" aria-hidden="true" style="height:20px"></div>
<div class="textblock"> <div class="textblock">
{% include "p2infos.html" %} {% include "p2infos.html" %}

View File

@@ -9,12 +9,12 @@
<li>Das Anpassen der Richtung und der Position der Gebärde kann dabei helfen, besser zu verstehen, wo das Gleis liegt.</li> <li>Das Anpassen der Richtung und der Position der Gebärde kann dabei helfen, besser zu verstehen, wo das Gleis liegt.</li>
<li>Ich finde diesen Ansatz nicht gut.</li> <li>Ich finde diesen Ansatz nicht gut.</li>
</ol> </ol>
<p>Die Antwortmöglichkeiten sind jedesmal:</p> <p>Die Antwortmöglichkeiten sind jedes Mal:</p>
<ol start="1"> <ol start="1">
<li>Links</li> <li>Trifft überhaupt nicht zu</li>
<li>Eher links</li> <li>Trifft eher nicht zu</li>
<li>Beide gleich</li> <li>Ich weiß nicht</li>
<li>Eher rechts</li> <li>Trifft eher zu</li>
<li>Rechts</li> <li>Trifft vollkommen zu</li>
</ol> </ol>
</div> </div>

View File

@@ -12,10 +12,6 @@
<div class="container"> <div class="container">
<h2>SLAEFORMS Gebärdensprachavatar Studie</h2> <h2>SLAEFORMS Gebärdensprachavatar Studie</h2>
<video controls>
<source src="{{ url_for('static', filename='videos/platzhalter-video.mp4') }}" type="video/mp4">
</video>
<div class="spacer" aria-hidden="true" style="height:20px"></div>
<div class="textblock"> <div class="textblock">
{% include "p3infos.html" %} {% include "p3infos.html" %}

View File

@@ -13,6 +13,13 @@
allowfullscreen></iframe> allowfullscreen></iframe>
</div> </div>
{% elif (embed == "vimeo") %}
<div class="iframe-container">
<iframe title="vimeo-player" class="center" src="{{ video_url }}" frameborder="0" allowfullscreen></iframe>
</div>
{% elif (embed == "no") %} {% elif (embed == "no") %}
<video controls> <video controls>
@@ -42,8 +49,6 @@
</div> </div>
</div> </div>
<div class="dv_half"> <div class="dv_half">
<div class="iframe-container"> <div class="iframe-container">
<iframe class="center" src="{{ video_url2 }}" title="YouTube video player" frameborder="0" <iframe class="center" src="{{ video_url2 }}" title="YouTube video player" frameborder="0"
@@ -53,6 +58,25 @@
</div> </div>
</div> </div>
{% elif (embed == "vimeo") %}
<div class="double_video_container">
<div class="dv_half">
<div class="iframe-container">
<iframe title="vimeo-player" class="center" src="{{ video_url1 }}" frameborder="0" allowfullscreen></iframe>
</div>
</div>
<div class="dv_half">
<div class="iframe-container">
<iframe title="vimeo-player" class="center" src="{{ video_url2 }}" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</div>
{% elif (embed == "no") %} {% elif (embed == "no") %}
<div class="double_video_container"> <div class="double_video_container">
<div class="dv_half"> <div class="dv_half">
@@ -121,9 +145,11 @@ step={{question["step"]}}
<button class="dialogBtn" autofocus><img class="infoButtonIcon" id="buttonClose" <button class="dialogBtn" autofocus><img class="infoButtonIcon" id="buttonClose"
src="{{ url_for('static', filename='icons/x-icon.png')}}" alt="Delete Icon"></button> src="{{ url_for('static', filename='icons/x-icon.png')}}" alt="Delete Icon"></button>
{% if ("videourl" in infovideo) %}
<video controls> <video controls>
<source src="{{ url_for('static', filename=infovideo['videourl']) }}" type="video/mp4"> <source src="{{ url_for('static', filename=infovideo['videourl']) }}" type="video/mp4">
</video> </video>
{% endif %}
<div class="dialogTextContainer"> <div class="dialogTextContainer">
{% if ("infotext" in infovideo) %} {% if ("infotext" in infovideo) %}
<p>{{ infovideo["infotext"] }}</p> <p>{{ infovideo["infotext"] }}</p>
@@ -134,7 +160,7 @@ step={{question["step"]}}
</div> </div>
</dialog> </dialog>
<button class="dialogBtn"><img class="infoButtonIcon" id="buttonInfoIcon" <button class="dialogBtn"><img class="infoButtonIcon" id="buttonInfoIcon"
src="{{ url_for('static', filename='icons/sl-icon.png')}}" alt="Info Icon"></button> src="{{ url_for('static', filename='icons/info-icon.png')}}" alt="Info Icon"></button>
<script src="{{ url_for('static', filename='infoDialogScript.js')}}"></script> <script src="{{ url_for('static', filename='infoDialogScript.js')}}"></script>
{% endif %} {% endif %}
@@ -262,7 +288,8 @@ step={{question["step"]}}
{% elif (questions[question]["type"] == "multiplechoice") %} {% elif (questions[question]["type"] == "multiplechoice") %}
<div class="compressWidth"> <div class="compressWidth">
<label> <p>
<div>
{{ questions[question]['text']}} {{ questions[question]['text']}}
{% for point in questions[question]["points"] %} {% for point in questions[question]["points"] %}
@@ -272,7 +299,8 @@ step={{question["step"]}}
{{ questions[question]['points'][point]['text']}}</label> {{ questions[question]['points'][point]['text']}}</label>
{% endfor %} {% endfor %}
</label> </div>
</p>
</div> </div>
<div class="spacer" aria-hidden="true" style="height:30px"></div> <div class="spacer" aria-hidden="true" style="height:30px"></div>
@@ -319,8 +347,14 @@ step={{question["step"]}}
<div class="spacer" aria-hidden="true" style="height:30px"></div> <div class="spacer" aria-hidden="true" style="height:30px"></div>
<div class="button-container"> <div class="button-container">
{% if ("lastquestion" in stimlui) %}
<button id="submitbutton" type="submit">Studie Beenden</button>
<!-- TODO maybe I want to use this instead: <button id="submitbutton" type="submit">Submit</button> /// <input class="inputs" id="submitbutton" type="submit" value="submit" />-->
{% else %}
<button id="submitbutton" type="submit">Weiter</button> <button id="submitbutton" type="submit">Weiter</button>
<!-- TODO maybe I want to use this instead: <button id="submitbutton" type="submit">Submit</button> /// <input class="inputs" id="submitbutton" type="submit" value="submit" />--> <!-- TODO maybe I want to use this instead: <button id="submitbutton" type="submit">Submit</button> /// <input class="inputs" id="submitbutton" type="submit" value="submit" />-->
{% endif %}
</div> </div>
</form> </form>
<div class="spacer" aria-hidden="true" style="height:80px"></div> <div class="spacer" aria-hidden="true" style="height:80px"></div>

View File

@@ -12,10 +12,13 @@
<div class="container" style="height: 100%; font-size: 22px;"> <div class="container" style="height: 100%; font-size: 22px;">
<h2>SLAEFORMS Gebärdensprachavatar Studie</h2> <h2>SLAEFORMS Gebärdensprachavatar Studie</h2>
<video controls> <div class="iframe-container2">
<source src="{{ url_for('static', filename='videos/platzhalter-video.mp4') }}" type="video/mp4">
</video> <iframe title="vimeo-player" src="https://player.vimeo.com/video/1031133490?h=bfa5b559f9" frameborder="0"
<div class="spacer" aria-hidden="true" style="height:20px"></div> allowfullscreen></iframe>
</div>
<div class="textblock"> <div class="textblock">
<p> <p>
@@ -25,39 +28,21 @@
In dieser Studie geht es um die Entwicklung von Gebärdensprachavataren. In dieser Studie geht es um die Entwicklung von Gebärdensprachavataren.
</p> </p>
<p> <p>
Bitte beachten Sie, dass diese Avatare noch in einer frühen Entwicklungsphase und noch nicht für den Bitte berücksichtige, dass die Avatare, die wir zeigen, in keiner Weise der Qualität entsprechen, wie
Gebrauch in einer App/einem Computerprogramm oder auf einer Webseite geeignet sind. In dieser Studie sie genutzt werden sollen. Sie sind nur Beispiele, die niemals in einer Anwendung zu sehen sein werden.
geht es darum, einzelne Aspekte der Avatare und neue technologische Ansätze zu testen. Dementsprechend Es geht darum, dass wir die Darstellung der Hände und Arme testen wollen. Bitte bewertet deshalb nicht
haben die Avatare noch viele offensichtliche Schwächen, wie zum Beispiel, dass bisher nur die Arme und Darstellungsqualität und lasst euch nicht davon beeinflussen. Außerdem möchten wir testen, wie die
der Oberkörper, aber nicht das Gesicht animiert ist. Bitte bewerten Sie nur die Qualität der Hände und Nutzung einer Feedback-Funktion per Videoaufnahme verwendet werden kann.
Arme.
</p> </p>
<p> <p>
Diese Studie richtet sich an Menschen, die Gebärdensprache beherrschen, insbesondere gehörlose Menschen. Die Rückmeldung von euch ist wichtig und ihr könnt das in Gebärdensprache machen.
Nehmen Sie bitte nur Teil, wenn Sie (Deutsche) Gebärdensprache beherrschen. Die Teilnahme wird nur für die Auswertung genutzt. In keiner Weise wird etwas von euch veröffentlicht, auch nicht eure Videos.
Die Studie dauert ca. 20 Minuten. Alle weiteren Infos findet ihr im Text.
</p> </p>
<p> <p>
Während der Studie werden sie sich Videos anschauen, diese bewerten und Feedback dazu geben können. Danke für eure Teilnahme, die im Rahmen eine Abschlussarbeit erfolgt. Weitere Infos dazu findet ihr im Impressum.
Verwenden Sie deshalb bitte, wenn möglich ein Gerät mit einem großen Bildschirm (Laptop, PC, Tablet) für
Ihre Teilnahme, damit Sie die Videos in ausreichender Größe sehen können.
</p>
<p>
Sie haben während der Studie die Möglichkeit (optional) Videofeedback zu geben, dazu brauchen sie eine
Webcam. Die Videos werden nicht veröffentlicht und nur Übersetzern zur Auswertung der Studienergebnisse
gezeigt.
</p>
<p>
Das Laden der Seiten kann manchmal einige Sekunden dauern, bei schlechtem Internet auch länger, haben sie bitte Geduld. Falls es zu einem Fehler kommt und ein Video nicht geladen wird, versuchen sie die Seite neu zu laden.
</p>
<p>
Für jeden Teil der Studie gibt es ein Video, das die Fragestellung und die Antwortmöglichkeiten in
Gebärdensprache erklärt. Falls Sie das Video während der Studie nochmal sehen möchten, können Sie es
über den „Info“-Knopf auf der rechten Seite aufrufen.
</p>
<p>
Bitte versuchen sie während der Studie nicht auf die vorherige Seite "zurück" zu gehen, da sie nicht zu vorherigen Fragen zurück können.
</p> </p>
<div class="spacer" aria-hidden="true" style="height:20px"></div>
<p> <p>
Die Teilnahme an dieser Studie ist komplett freiwillig, Sie können die Studie zu jedem Zeitpunkt Die Teilnahme an dieser Studie ist komplett freiwillig, Sie können die Studie zu jedem Zeitpunkt
abbrechen, indem Sie die Seite einfach schließen. Sie können außerdem die Löschung aller Daten bei uns abbrechen, indem Sie die Seite einfach schließen. Sie können außerdem die Löschung aller Daten bei uns
@@ -67,7 +52,7 @@
<form class="dsgvoform" action="{{ url_for('startpage') }}" method="post"> <form class="dsgvoform" action="{{ url_for('startpage') }}" method="post">
<label for="terms-and-conditions"> <label for="terms-and-conditions">
<input class="inline" id="terms-and-conditions" type="checkbox" required name="terms-and-conditions" /> <input class="inline" id="terms-and-conditions" type="checkbox" required name="terms-and-conditions" />
Ich akezeptiere die <a href="{{ url_for('datenschutz') }}" target="_blank">Datenschutzbestimmungen</a> Ich akzeptiere die <a href="{{ url_for('datenschutz') }}" target="_blank">Datenschutzbestimmungen</a>
</label> </label>
<div class="button-container"> <div class="button-container">
<button id="submitbutton" type="submit">Weiter</button> <button id="submitbutton" type="submit">Weiter</button>

View File

@@ -21,10 +21,7 @@
<div class="container"> <div class="container">
<video controls> <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://player.vimeo.com/video/1017028141?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" frameborder="0" allow="autoplay; fullscreen; picture-in-picture; clipboard-write" style="position:absolute;top:0;left:0;width:100%;height:100%;" title="0020-simple"></iframe></div><script src="https://player.vimeo.com/api/player.js"></script>
<source src="{{ url_for('static', filename='videos/GLEISvariations.mp4') }}" type="video/mp4">
</video>
<form class="formlayout" id="question_form" action="{{ url_for('sendpage') }}" method="post"> <form class="formlayout" id="question_form" action="{{ url_for('sendpage') }}" method="post">

View File

@@ -0,0 +1,34 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css')}}" />
<!-- styles.css {{ url_for('static', filename='styles.css')}}-->
<title>Task 3 Videos</title>
</head>
<body>
<div class="container">
<div class="double_video_container">
<div class="dv_half">
<div class="iframe-container">
<video controls>
<source src="{{ url_for('static', filename='videos/0009-intro-inflected.mp4') }}" type="video/mp4">
</video>
</div>
</div>
<div class="dv_half">
<div class="iframe-container">
<video controls>
<source src="{{ url_for('static', filename='videos/0009-variation-inflected.mp4') }}" type="video/mp4">
</video>
</div>
</div>
</div>
<div class="spacer" aria-hidden="true" style="height:30px"></div>
</div>
</body>
</html>

File diff suppressed because it is too large Load Diff

View File

@@ -1,4 +1,8 @@
{ {
"Block -1":{
"type": "SinglePage",
"template": "oldstart.html"
},
"Block 0":{ "Block 0":{
"type": "SinglePage", "type": "SinglePage",
"template": "intropage.html" "template": "intropage.html"
@@ -10,6 +14,7 @@
"type": "empty", "type": "empty",
"list": { "list": {
"empty_stimulus": "" "empty_stimulus": ""
} }
}, },
"questions": { "questions": {
@@ -222,7 +227,6 @@
} }
}, },
"infovideo": { "infovideo": {
"videourl": "videos/platzhalter-video.mp4",
"htmlblock": "dqinfos.html", "htmlblock": "dqinfos.html",
"configuration": { "configuration": {
"embed": "no" "embed": "no"
@@ -292,9 +296,9 @@
"type": "single_video", "type": "single_video",
"order": "random", "order": "random",
"list": { "list": {
"video_1": "0009-inflected.mp4", "video_1": "0044-inflected.mp4",
"video_2": "0009-mocap.mp4", "video_2": "0044-mocap.mp4",
"video_3": "0009-simple.mp4" "video_3": "0044-simple.mp4"
}, },
"configuration": { "configuration": {
"embed": "no" "embed": "no"
@@ -429,7 +433,6 @@
} }
}, },
"infovideo": { "infovideo": {
"videourl": "videos/platzhalter-video.mp4",
"htmlblock": "p1infos.html", "htmlblock": "p1infos.html",
"configuration": { "configuration": {
"embed": "no" "embed": "no"
@@ -619,7 +622,6 @@
} }
}, },
"infovideo": { "infovideo": {
"videourl": "videos/platzhalter-video.mp4",
"htmlblock": "p1infos.html", "htmlblock": "p1infos.html",
"configuration": { "configuration": {
"embed": "no" "embed": "no"
@@ -663,10 +665,10 @@
"stimuli": { "stimuli": {
"type": "double_video", "type": "double_video",
"list_1": { "list_1": {
"video_1": "0009-inflected.mp4" "video_1": "0009-intro-inflected.mp4"
}, },
"list_2": { "list_2": {
"video_1": "0009-variation-wide.mp4" "video_1": "0009-variation-inflected.mp4"
}, },
"configuration": { "configuration": {
"embed": "no" "embed": "no"
@@ -676,7 +678,7 @@
"question0": { "question0": {
"type": "textblock", "type": "textblock",
"name": "fragestellung", "name": "fragestellung",
"text": "Der folgende Satz wird gebärdet: Gleis 18, Einfahrt RE 77 Richtung Köln Hauptbahnhof über Hannover, Abfahrt 3:44 Uhr." "text": "Der folgende Satz wird gebärdet: Einfahrt RE 77 Richtung Köln Hauptbahnhof über Hannover, Abfahrt 3:44 Uhr."
}, },
"question1": { "question1": {
"type": "likert-basic", "type": "likert-basic",
@@ -805,7 +807,6 @@
} }
}, },
"infovideo": { "infovideo": {
"videourl": "videos/platzhalter-video.mp4",
"htmlblock": "p2infos.html", "htmlblock": "p2infos.html",
"configuration": { "configuration": {
"embed": "no" "embed": "no"
@@ -997,7 +998,6 @@
} }
}, },
"infovideo": { "infovideo": {
"videourl": "videos/platzhalter-video.mp4",
"htmlblock": "p3infos.html", "htmlblock": "p3infos.html",
"configuration": { "configuration": {
"embed": "no" "embed": "no"
@@ -1039,29 +1039,31 @@
"type": "TaskTemplate", "type": "TaskTemplate",
"template": "standard_template.html", "template": "standard_template.html",
"stimuli": { "stimuli": {
"type": "single_video", "type": "empty",
"order": "random",
"list": { "list": {
"video_1": "platzhalter-video.mp4" "empty_stimulus": ""
}, },
"configuration": { "lastquestion": "true"
"embed": "no"
}
}, },
"questions": { "questions": {
"question0": { "question0": {
"type": "textblock", "type": "textblock",
"name": "fragestellung", "name": "fragestellung",
"text": "Vielen Dank für Ihre Teilnahme an der Studie, wenn Sie noch weiteres Feedback geben möchten oder Anmerkungen haben, können Sie uns diese hier mitteilen. Wenn Sie noch weitere Fragen haben, schreiben Sie uns bitte unter: avatarstudy@proton.me" "text": "Vielen Dank für Ihre Teilnahme an der Studie. Sie können die Studie nun abschließen, indem sie den Button unten rechts anklicken."
}, },
"question5": { "question1": {
"type": "textblock",
"name": "fragestellung",
"text": "Wenn Sie noch weiteres Feedback geben möchten oder Anmerkungen haben, können Sie uns diese hier mitteilen. Wenn Sie noch weitere Fragen haben, schreiben Sie uns bitte unter: avatarstudy@proton.me"
},
"question2": {
"type": "textinput", "type": "textinput",
"name": "text_feedback", "name": "text_feedback",
"text": "Hier können Sie Text-Feedback geben", "text": "Hier können Sie Text-Feedback geben",
"required": "false", "required": "false",
"size": "400" "size": "400"
}, },
"question6": { "question3": {
"type": "videoinput", "type": "videoinput",
"text": "Hier können Sie Video-Feedback geben (max. 70 Sekunden)", "text": "Hier können Sie Video-Feedback geben (max. 70 Sekunden)",
"name": "video_feedback", "name": "video_feedback",