Durch den Einsatz dieser Verbraucherfaktenbox mit Erfahrungslernen (experience-based fact box) soll den Verbrauchern ein Verständnis für die Eintrittswahrscheinlichkeit unsicherer Ereignisse vermittelt werden

Michael Zitzmann 8c4c3c3858 Initial commit 5 年之前
assets 8c4c3c3858 Initial commit 5 年之前
aurelia_project 8c4c3c3858 Initial commit 5 年之前
data 8c4c3c3858 Initial commit 5 年之前
scripts 8c4c3c3858 Initial commit 5 年之前
src 8c4c3c3858 Initial commit 5 年之前
test 8c4c3c3858 Initial commit 5 年之前
.babelrc.js 8c4c3c3858 Initial commit 5 年之前
.editorconfig 8c4c3c3858 Initial commit 5 年之前
.eslintrc.json 8c4c3c3858 Initial commit 5 年之前
.gitignore 8c4c3c3858 Initial commit 5 年之前
README.md 8c4c3c3858 Initial commit 5 年之前
favicon.ico 8c4c3c3858 Initial commit 5 年之前
index.html 8c4c3c3858 Initial commit 5 年之前
jsconfig.json 8c4c3c3858 Initial commit 5 年之前
karma.conf.js 8c4c3c3858 Initial commit 5 年之前
package.json 8c4c3c3858 Initial commit 5 年之前
sampling.html 8c4c3c3858 Initial commit 5 年之前

README.md

Erfahrungsfaktenbox – ohne Ziel

Die Faktenbox soll den Verbrauchern ein Verständnis für die Eintrittswahrscheinlichkeit bestimmter Ereignisse geben und ihm Handlungsoptionen vermitteln.

Entwicklungsumgebung

Diese WebApp wurde auf Basis von aurelia entwickelt. Für die Weiterentwicklung des Projekts werden nodejs und npm benötigt. Die Abhängigkeiten werden wie üblich per npm install installiert.

Für die Entwicklung steht der Development Build Prozess zur Verfügung, in dem Javascript Dateien transpiliert, und css aus den scss Dateien generiert werden. Zudem wird ein Entwicklungsserver gestartet, der bei Änderungen an Quelldateien nach einem erneuten Ausführen des Build Prozesses die Dateien neu lädt. Gestartet wird dieser Prozess mit folgendem Befehl:

au run --watch

Ein Production Build kann folgendermaßen erstellt werden:

au build --env production

Die so erzeugten Dateien sind unter scripts zu finden.

Verzeichnisstruktur

.
├── README.md
├── assets                                          // Resourcen zur Generierung von PDFs und für umgebendes HTML
│   ├── blob-stream.min.js
│   ├── fonts
│   │   ├── Asap-Bold.ttf
│   │   ├── Asap-Italic.ttf
│   │   ├── Asap-Regular.ttf
│   │   ├── AsapCondensed-Regular.ttf
│   │   ├── fontello.eot
│   │   ├── fontello.svg
│   │   ├── fontello.ttf
│   │   ├── fontello.woff
│   │   └── fontello.woff2
│   ├── pdfkit.min.js
│   └── shared
│       ├── css
│       │   └── main.css
│       └── fonts
│           ├── lora
│           │   ├── Lora-Regular.ttf
│           │   └── SIL\ Open\ Font\ License.txt
│           └── montserrat
│               ├── Montserrat-SemiBold.otf
│               └── SIL\ Open\ Font\ License.txt
├── aurelia_project
│   └── …                                           // Aurelia Projektkonfiguration
├── data
│   ├── data.json
│   ├── data.tsv
│   └── original
│       └── RA_ExpFB_Renditedaten.xlsx
├── favicon.ico
├── index.html                                      // Umgebende HTML Datei mit Kontextinformationen
├── jsconfig.json
├── karma.conf.js
├── package-lock.json
├── package.json
├── sampling.html                                   // HTML Datei der WebApp
├── scripts                                         // Build Verzeichnis
│   └── …
└── src
    ├── app.html
    ├── app.js                                      // Controller der WebApp
    ├── config_visual.js                            // Konfiguration der Visualisierung
    ├── configuration.js                            // Konfiguration der Anwendungslogik
    ├── d3custom.js                                 // Definition der verwendeten d3 Module
    ├── environment.js                                      // aurelia Environment Konfiguration
    ├── main.js                                             // aurelia Bootstrapper
    ├── messages.js                                         // Definition von Messages zur Kommunikation zwischen Anwendungsteilen
    ├── pdfExport.js                                // PDF Generator
    ├── resources
    │   ├── HardingCenter_Logo_de.svg
    │   └── index.js
    ├── sampler-textual.html                        // Textuelle Darstellung des zuletzt gezogenen Samples
    ├── sampler-visual.html                         // Visuelle Repräsentation
    ├── sampler-visual.js                           // Implementierung der d3 Visualisierung
    ├── sampler.js                                  // Logik des Samplings
    ├── sampling-info.html                          // Kontextinformation für HTML overlay
    ├── sampling-info.json                          // Kontextinformation für PDF
    └── scss                                        // Stylesheets der WebApp
        ├── partials
        │   ├── _colours.scss
        │   └── _form_elements.scss
        └── styles.scss

Wie ändere ich Labels und Texte der WebApp?

In der Datei src/configuration.js sind alle Labels und Texte definiert. Außerdem sind dort die Farben und zugrunde liegenden geometrischen Daten für das Layout der Icon Arrays definiert.

Entwicklungshistorie

Dieses Projekt entstand aus einem Prototyp für eine Studie zum erfahrungsbasierten Sampling. Einige Konfigurationsoptionen sind Überbleibsel davon und wurden nur aufgrund von Zeitmangel nicht bereinigt.