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

Figma Einführungskurs-Pnterest Prototype

Figma Einführungskurs-Pnterest Prototype

In dem Kurs „Figma - Eine Einführung” von Malte Völkner erhielten wir einen Einblick in das Tool Figma. Figma ist ein Tool, das sich auf digitales Design fokussiert und als App oder im Browser nutzbar ist.

Wir begannen mit den Grundlagen der Verwendung von Figma. Zum Beispiel, wie man neue Elemente und Funktionen wie Component und Variants erstellt.

Ich benutzte normalerweise Adobe XD, weil ich das Gefühl hatte, dass Figma als Software für die Erstellung digitaler Designs nicht sehr flexibel ist. Nach dem Einführungskurs finde ich Figma jedoch sehr praktisch. Die Grundfunktionen beider Anwendungen waren sehr ähnlich, aber Figma hat den Vorteil, dass ich bei der Online-Zusammenarbeit mit Kollegen problemlos Dateien mit Links bearbeiten kann und Auto Layout ist ebenfalls sehr nützlich, um Zeit zu sparen.

Im Lauf des Kurses haben wir auch einige Prototypen erstellt, wo man erkennt, wie die Buttons oder Animation in aktuellen Medien funktionieren. Ein Prototyp war das Abschlussprojekt.

Abschlussprojekt

Figma-1.jpgFigma-1.jpg
Figma-2.jpgFigma-2.jpg
Figma-3.jpgFigma-3.jpg

Als ein Abschlussprojekt habe ich Pinterest ausgewählt. Ich habe täglich diese App benutzt, um Design Inspiration oder kreative Idee zu bekommen. Die App ist für die Perspektive zum User-flow wunderschön aufgebaut, daher wollte ich selber die UI nachbauen und die Struktur als Entwickler lernen. Dazu kommt, dass ich einige UX-Fehler bemerkt habe und ich es verbessern wollte. Zum Beispiel habe ich den Kontrast der Farbe von Icons verstärkt, um es die gezeigte Seite einfacherer erkennbar zu machen. Des Weiteren habe ich die Reihenfolge und Positionen der Seite geändert. Da einige Seiten wie „History“ oder „Updates“ sich an Stellen befanden, die unter Berücksichtigung des Use-flows verwirrend oder nicht leicht zu finden waren, habe ich die Struktur geändert.

Als ein Fokus habe ich die Animation von der „pin“ Funktion mit Prototypen umgesetzt, wenn man ein Bild speichert. Es braucht verschiedene Frames, um diese Animation zu erstellen. Aber ich dachte, dass dies ein sehr wichtiger Schritt in der Entwicklung einer App ist, wenn man die Benutzerfreundlichkeit überprüfen und die UX mit seinen Kollegen teilen möchte. Diese Idee ist auch, eine Identität für die Pinterest-App zu schaffen, die sie von den anderen unterscheidet.

スクリーンショット 2021-10-22 午後6.42.29.pngスクリーンショット 2021-10-22 午後6.42.29.png

Fazit Kurs

Während wir technische Kenntnisse erhalten haben, haben wir auch erfahren, was wichtig für die Entwicklung von UI oder UX ist. Zwar habe ich schon lange als Web Designer gearbeitet, aber Malte Völkner hat noch viele Informationen mitgeteilt, mit denen ich meine Berufskenntnisse ergänzen kann.

Dieser Kurs war meine erste Vorlesung, in der ich als Internationalestudierende Designkenntnisse auf Deutsch gelernt habe. Mein Ziel war auch, dass ich mich an Design Begriff auf Deutsch gewöhne und reibungslos mit den nächsten Veranstaltungen anzufangen. Ich konnte einen Blick in die Vokabeln erhalten, die oft in der kreative Entwicklungsszene benutzt werden. In der Zwischenpräsentation kann man auch die Produkte von anderen Kommilitonen ansehen und andere kreative Ideen erfahren kann. Aus diesen Gründen ist es sicher, dass man diese Erfahrungen in Zukunft in der Praxis gut nutzen kann.

Ein Projekt von

Fachgruppe

Perspektiven und Social Skills

Art des Projekts

Keine Angabe

Zugehöriger Workspace

🖍️ Figma: Eine Einführung

Entstehungszeitraum

Wintersemester 2021 / 2022