Incom ist die Kommunikations-Plattform der Hochschule Hof Kommunikationsdesign

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

Incom ist die Kommunikations-Plattform der Hochschule Hof Kommunikationsdesign mehr erfahren

Das Darkweb

Diese Storytelling-Website beschäftigt sich mit der Notwendigkeit des Darkwebs, aber auch dessen Gefahren.

PROZESS

01 Ideenfindung

UX_Storytelling ML - 2-Drei Ideen mit einem Beispiel.jpgUX_Storytelling ML - 2-Drei Ideen mit einem Beispiel.jpg
UX_Storytelling ML - Copy of 2-Drei Ideen mit einem Beispiel-2.jpgUX_Storytelling ML - Copy of 2-Drei Ideen mit einem Beispiel-2.jpg
UX_Storytelling ML - Copy of 2-Drei Ideen mit einem Beispiel.jpgUX_Storytelling ML - Copy of 2-Drei Ideen mit einem Beispiel.jpg

02 Ausgangssituation, Problem, Lösung

Denkt man an das “Darkweb” oder “Deepweb”, kommen einem sofort ganz dunkle Gedanken in den Kopf: Ein illegaler Platz im Internet, in welchem ganz einfach Waffen, Drogen oder noch viel schlimmeres bestellt oder verkauft werden können?

Den meisten Menschen ist jedoch nicht bewusst, dass Vieles im Deepweb garnicht so illegal ist, wie es scheint.

Das Darkweb bringt dennoch trotzdem viele Gefahren mit sich, über die es sehr wichtig ist, aufgeklärt zu sein.

03 Recherche, Inhalte, Daten, Quellen

Grundrecherche, um eine grobe Übersicht zu sammeln

UX_Storytelling ML - Copy of 3 Recherche-2.jpgUX_Storytelling ML - Copy of 3 Recherche-2.jpg

Die Weitere Recherche wurde während dem Designprozess getätigt. Hier eine Übersicht einiger Quellen:

04 Gliederung

UX_Storytelling ML - Gliederung.jpgUX_Storytelling ML - Gliederung.jpg

Als Ordnungssystem machte es am meisten Sinn, die Themen in Kategorien aufzuteilen. 

Zum einen wird die Website in den „Lightmode“ (legales Darkweb) und in den „Darkmode“ (illegales Darkweb) aufgeteilt.

Jede der beiden Unterseiten enthält unterschiedliche Unterthemen (Ordner als Navigationssystem)

05 Moodboards

Bildschirmfoto 2024-05-07 um 17.06.42.pngBildschirmfoto 2024-05-07 um 17.06.42.png

Die oberen beiden Moodboards für den Darkmode, eher dunkler und „bedrohlicher“ gehalten, die unteren beiden Moodboards für den Lightmode, in helleren Farben.

06 Designvarianten

MacBook Pro 14_ - 3.pngMacBook Pro 14_ - 3.png
Darkmode 3.pngDarkmode 3.png
MacBook Pro 14_ - 2.pngMacBook Pro 14_ - 2.png
Darkmode 2.pngDarkmode 2.png
Lightmode 2.pngLightmode 2.png
MacBook Pro 14_ - 1.pngMacBook Pro 14_ - 1.png

_____________________________

ENDPRODUKT

07 Finales Design

Bildschirmfoto 2024-07-21 um 21.29.05.pngBildschirmfoto 2024-07-21 um 21.29.05.png
Bildschirmfoto 2024-07-21 um 21.28.20.pngBildschirmfoto 2024-07-21 um 21.28.20.png
Bildschirmfoto 2024-07-21 um 21.28.53.pngBildschirmfoto 2024-07-21 um 21.28.53.png
Bildschirmfoto 2024-07-21 um 21.29.31.pngBildschirmfoto 2024-07-21 um 21.29.31.png
Bildschirmfoto 2024-07-21 um 21.30.01.pngBildschirmfoto 2024-07-21 um 21.30.01.png
Bildschirmfoto 2024-07-21 um 21.29.38.pngBildschirmfoto 2024-07-21 um 21.29.38.png
Bildschirmfoto 2024-07-21 um 21.29.25.pngBildschirmfoto 2024-07-21 um 21.29.25.png
Bildschirmfoto 2024-07-21 um 21.29.54.pngBildschirmfoto 2024-07-21 um 21.29.54.png
Bildschirmfoto 2024-07-21 um 21.30.17.pngBildschirmfoto 2024-07-21 um 21.30.17.png
Bildschirmfoto 2024-07-21 um 21.30.10.pngBildschirmfoto 2024-07-21 um 21.30.10.png
Bildschirmfoto 2024-07-21 um 21.31.02.pngBildschirmfoto 2024-07-21 um 21.31.02.png
Bildschirmfoto 2024-07-21 um 21.31.21.pngBildschirmfoto 2024-07-21 um 21.31.21.png
Bildschirmfoto 2024-07-21 um 21.31.27.pngBildschirmfoto 2024-07-21 um 21.31.27.png
Bildschirmfoto 2024-07-21 um 21.31.08.pngBildschirmfoto 2024-07-21 um 21.31.08.png
Bildschirmfoto 2024-07-21 um 21.31.42.pngBildschirmfoto 2024-07-21 um 21.31.42.png
Bildschirmfoto 2024-07-21 um 21.31.56.pngBildschirmfoto 2024-07-21 um 21.31.56.png
Bildschirmfoto 2024-07-21 um 21.31.14.pngBildschirmfoto 2024-07-21 um 21.31.14.png
Bildschirmfoto 2024-07-21 um 21.31.46.pngBildschirmfoto 2024-07-21 um 21.31.46.png
Bildschirmfoto 2024-07-21 um 21.32.07.pngBildschirmfoto 2024-07-21 um 21.32.07.png
Bildschirmfoto 2024-07-21 um 21.32.00.pngBildschirmfoto 2024-07-21 um 21.32.00.png
Bildschirmfoto 2024-07-21 um 21.32.12.pngBildschirmfoto 2024-07-21 um 21.32.12.png
Bildschirmfoto 2024-07-21 um 21.32.23.pngBildschirmfoto 2024-07-21 um 21.32.23.png
Bildschirmfoto 2024-07-21 um 21.32.35.pngBildschirmfoto 2024-07-21 um 21.32.35.png
Bildschirmfoto 2024-07-21 um 21.32.43.pngBildschirmfoto 2024-07-21 um 21.32.43.png

08 Prototyp Figma Screencast & Link

09 Webflow Screencast & Link

LINK ZUR WEBSITE: https://darkweb-f4c70a.webflow.io/

Der Prototyp ist teilweise Responsiv.

10 Styleguide

Styleguide.jpgStyleguide.jpg

12 Präsentationsvideo

13 Plakat

Varianten

Frame 1.jpgFrame 1.jpg
Frame 3.jpgFrame 3.jpg
Frame 4.jpgFrame 4.jpg

Finales Plakat

Poster_Mockup_2.pngPoster_Mockup_2.png
Frame 6.jpgFrame 6.jpg

Werkschau

IMG_2879.jpgIMG_2879.jpg
IMG_2880.jpgIMG_2880.jpg
IMG_2875.jpgIMG_2875.jpg

14 Ausblick

Free_Bi-Fold_A4_Brochure_2.pngFree_Bi-Fold_A4_Brochure_2.png
Free_Bi-Fold_A4_Brochure_4.pngFree_Bi-Fold_A4_Brochure_4.png
Free_Bi-Fold_A4_Brochure_1.pngFree_Bi-Fold_A4_Brochure_1.png
Free_Bi-Fold_A4_Brochure_3.pngFree_Bi-Fold_A4_Brochure_3.png

Es könnten Flyer von der Website gestaltet und gedruckt werden, welche auf die Website hinweisen und auf bestimmten Ausstellungen ausgelegt werden könnten.

Die Website könnte noch um einiges zu erweitert und umfassender gestaltet werden, da das Thema so breit gefächert ist. Ebenfalls könnte es noch interaktiver gestaltet werden, beispielsweise mit einem Quiz zwischendurch, eingebettete Videos oder auch Audios, vielleicht sogar mit geführten Interviews von Darkweb-Nutzern.

Ein Projekt von

Fachgruppe

Kommunikationsdesign

Art des Projekts

Keine Angabe

Zugehöriger Workspace

UX- und Storytelling (KD4)

Entstehungszeitraum

Sommersemester 2024