Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam

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

Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam mehr erfahren

UI Barbecue - Let’s roast and try to make it better

UI Barbecue - Let’s roast and try to make it better

Bei diesem Kurs handelte es sich um einen Projektwochenkurs, in dem die Grundlagen von Figma vermittelt wurden. Als Abschlussprojekt wählten Anja und ich die Aufgabe, eine Webseite neu zu gestalten. Wir entschieden uns für die Neugestaltung von PornHub.

1. Ist Zustand

Um eine Grundlage für das Redesign zu schaffen, haben wir zuerst die PornHub-Website analysiert und die bestehenden Frames gesammelt. Dies diente als Ausgangspunkt, um Schwachstellen zu identifizieren und mögliche Verbesserungen für das Redesign zu entwickeln.

Screenshot 2023-10-18 at 17.35 1.pngScreenshot 2023-10-18 at 17.35 1.png
Screenshot 2023-10-18 at 17.43 1.pngScreenshot 2023-10-18 at 17.43 1.png
Screenshot 2023-10-18 at 17.36 1.pngScreenshot 2023-10-18 at 17.36 1.png

2. Mindmap

Das Vorgehen, zunächst alle notwendigen Gedankenpunkte zu sammeln und sie dann in einer Zusammenfassung zu bündeln, war der Ausgangspunkt unseres Projekts. Nach dieser Zusammenfassung identifizierten wir drei Hauptbaustellen, auf die wir uns in erster Linie konzentrieren wollten:

1. Navigation: Hierbei haben wir Fehler in der Navigation behoben, um die Benutzerfreundlichkeit zu steigern.

2. Designelemente: Wir haben die überfordernden Designelemente überarbeitet, um die Seite ansprechender und benutzerfreundlicher zu gestalten.

3. Seitenaufbau: Der Aufbau der Startseite wurde optimiert, um eine bessere Nutzerführung und Hierarchie zu gewährleisten.

Um die Gestaltung aufzuwerten überarbeiteten wir auch die Farbe im Logo. 

Unsere Entscheidung, nur die Startseite zu überarbeiten, wurde getroffen, um unsere Bemühungen auf eine gründliche und effiziente Verbesserung dieses Schlüsselaspekts zu konzentrieren. Dies ermöglichte uns, gezielt auf die identifizierten Problembereiche einzugehen.

Mindmap.pngMindmap.png

3. Entwürfe

Nachdem wir grob erfasst hatten, was uns an der Startseite störte, haben wir damit begonnen, Wireframes zu erstellen. Unser Ziel war es, unsere Ideen als Konzept umzusetzen und zu überprüfen, wie sie funktionieren.

- Wireframes 

- Bausatze

Entwurf 1.pngEntwurf 1.png
Entwurf 2.pngEntwurf 2.png
Bausätze .pngBausätze .png

4. Feedback

Nach dem ersten Tag unseres Projekts haben wir eine Konsultation mit Vanessa und Alex gehabt, um erstes Feedback zu erhalten. Aufgrund dieser Rückmeldungen wurden uns neue Webseiten empfohlen, die wir in unsere Gestaltung einbeziehen könnten. Wir haben das Feedback ernst genommen und unser Design überarbeitet, insbesondere die Aufteilung der Kategorien, den Videoaufbau und die Filterfunktion. Diese Anpassungen wurden vorgenommen, um sicherzustellen, dass die Benutzererfahrung und die Usability unseres Designs verbessert werden.

Bildschirmfoto 2023-10-19 um 12.23 1.pngBildschirmfoto 2023-10-19 um 12.23 1.png
Bildschirmfoto 2023-10-19 um 14.10 1.pngBildschirmfoto 2023-10-19 um 14.10 1.png
Screenshot 2023-10-19 at 14.10 1.pngScreenshot 2023-10-19 at 14.10 1.png

5. Neues Konzept

Nachdem wir Feedback zu unserem ursprünglichen Konzept erhalten hatten, haben wir das Design erneut überarbeitet. Aufgrund des begrenzten Zeitrahmens von nur 2 Tagen haben wir uns an vorhandenen Designs orientiert. Wir haben auch weitere Webseiten als Referenz betrachtet. Für den Aufbau der Startseite haben wir uns an YouTube und Bellesa orientiert, jedoch darauf geachtet, den Charakter von PornHub beizubehalten, um die gewünschte Ausdrucksstärke zu bewahren.

Startseite Final.pngStartseite Final.png

6. Umfrage

Um die Reaktionen auf unser neues Design zu bewerten, haben wir weitere Meinungen eingeholt, indem wir 3 Personen zu unserem neuen Design befragt haben. Dabei haben wir unser ursprüngliches Design direkt neben das neue Design gestellt, um die Unterschiede und Verbesserungen leichter erkennbar zu machen. Dies ermöglichte uns, wertvolles Feedback zu sammeln und die Wirksamkeit der Überarbeitungen zu beurteilen.

Hierbei handelte es sich um zwei Männer und eine Frau.

Aufgrund des Feedbacks Fügten wir die Caption „Trends“ mit ein um den Aufbau verständlicher zu machen.

Person 1.pngPerson 1.png
Person 2.pngPerson 2.png
Person 3.pngPerson 3.png

7. (Abschluss)Präsentation Video

Fachgruppe

Perspektiven und Social Skills

Art des Projekts

Projekt-Tagebuch

Betreuung

foto: Vanessa Schmitt foto: Alexander Giese

Zugehöriger Workspace

UI Barbecue - Let’s roast and try to make it better

Entstehungszeitraum

Wintersemester 2023 / 2024

Keywords

1 Kommentare

Please login or register to leave feedback

Alter!! Ich hab mir legit diese Woche erst gedacht, dass das Redesign von Pornowebseiten voll die gute ID-Bachelorarbeit wäre, haha!