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

Orbit • Your new space for saving content

Orbit • Your new space for saving content

Deutsch:

Der Wunsch, Inhalte zu sammeln und zu organisieren, um sie später zu nutzen, wird durch die Vielfalt an analogen und digitalen Medien sowie der zahlreichen verschiedenen Speicherorte und Ordnungssysteme zu einer alltäglichen Herausforderung. Mit unserem Projekt, Orbit, adressierten wir dieses Problem und entwickelten eine potenzielle Lösung. Die App speichert plattformübergreifend Inhalte in einem zentralen „Orbit” und ermöglicht es Nutzer*innen, sie anhand automatisch generierter Tags wiederzufinden. Zudem bietet sie die Möglichkeit, Inhalte nach persönlichen Intentionen zu clustern, und damit fokussiert auf gespeicherte Inhalte zuzugreifen.

English:

The desire to collect and organize content for later use has become an everyday challenge due to the variety of analog and digital media, as well as the numerous different storage locations and organizational systems. With our project, Orbit, we addressed this problem and developed a potential solution. The app stores content across platforms in a central „Orbit“ and allows users to retrieve it using automatically generated tags. Additionally, it offers the ability to cluster content according to personal intentions, enabling focused access to stored content.


Problemvisualisierung

Das Internet hat unseren Alltag komplett durchdrungen. Wir kommunizieren und interagieren geräteübergreifend auf verschiedenen Plattformen. Sie alle bieten uns eine endlose Quelle an Ideen, Aktivitäten und Lebensrealitäten, die ideal zu uns passen sollen. Um diese für die Zukunft festzuhalten, speichern wir uns Bilder, Videos und Links in Ordnern und Listen aller Art.

Das Speichern dieser Inhalte erfolgt häufig an verschiedenen Orten, sei es auf sozialen Plattformen, in digitalen Listen und Galerien oder auch in analogen Notizheften. Dabei kann es schwierig sein, den Überblick zu behalten. Um eine gewisse Ordnung zu schaffen, greifen wir oft auf Ordnersysteme zurück. Wir sortieren Inhalte in beschriftete Boxen ein, um sie später schneller wiederzufinden. Was mit zwei bis drei Ordnern noch funktionieren mag, verliert schnell an Substanz. Unsere konsumierten Inhalte sind zu individuell, um sie in wenige Ordner zu sammeln. Ergänzt man diese und erstellt mehr Ordner, verlieren wir jedoch wieder einmal den Überblick. Ordner werden zu spezifisch oder geraten sogar in Vergessenheit. Dadurch bricht das Ordnungssystem zusammen und das Chaos der gespeicherten Eindrücke bleibt bestehen.

Ambitionen

Genau dort möchten wir mit unserer App „Orbit” ansetzen. Wir sind davon überzeugt, dass allen voran eine plattformübergreifende Lösung benötigt wird, die alle Inhalte an einem zentralen Ort speichert. Dem Orbit. Unser Ziel ist es, damit die Anzahl der Speicherorte zu minimieren und den User*innen die Gewissheit zu geben, dass sie alles an einem Ort finden werden. Zusätzlich möchten wir herkömmliche Ordnersysteme neu denken und ein nachhaltiges Clustern von Inhalten ermöglichen.

Orbit

Die Analogie

Unsere App arbeit mit der Analogie eines „Orbits“. Alle Inhalte, die User*innen mit unserer App teilen, werden als „Items“ in diesem Orbit gespeichert. Die Items sind innerhalb dessen lediglich chronologisch strukturiert und werden vorab nicht geordnet.

Die „Intentions„ bilden eine gesonderte Darstellungsart innerhalb des Orbits. Sie ermöglichen es ausgewählte Items, welche im Zusammenhang mit einer gemeinsamen Absicht stehen, innerhalb des Orbits abzukapseln.

orbit-intentions.pngorbit-intentions.png

Items hinzufügen

User*innen fügen Eindrücke, Aktivitäten, Inspirationen und Beiträge aus der digitalen und analogen Welt in ihren Orbit hinzu, indem sie Inhalte mit unserer App teilen oder dieser hinzufügen.

adding-extern.pngadding-extern.png
adding-inside.pngadding-inside.png

Items suchen

Jedem Item werden automatisch beschreibende Tags durch Bild-, Sprach-, Text- und Videoerkennung hinzugefügt. Benutzer*innen können innerhalb ihres „Orbits“ nach diesen Tags suchen und so intuitiv ihre Inhalte wiederfinden. Durch die Kombination mehrerer Tags, wird die Suche verfeinert. So können Nutzer*innen genau beschreiben, wonach sie suchen und effizient zu ihrem Ziel navigieren.

Neben Tags können auch Filter eingegeben werden, die die Suche beispielsweise basierend auf dem Datum einschränken. Damit setzen wir auf eine intelligente Tag-Suche, die bei den User*innen das Vertrauen aufbaut, jedes Item wiederzufinden, ohne auf ein selbst angelegtes Ordnersystem angewiesen zu sein.

search.pngsearch.png
item.pngitem.png

Intentions

Dennoch kann es Sinn ergeben, mehrere Items zu gruppieren. Dafür bietet Orbit die Möglichkeit, Items innerhalb einer „Intention” zu clustern. Sobald hinter gespeicherten Inhalten eine bestimmte Absicht steht, wie zum Beispiel das Einrichten einer neuen Wohnung, können mehrere Items zu einer Intention zusammengefasst werden. User*innen verfolgen also mit dem Anlegen einer Intention ein bestimmtes Ziel und Inhalte werden nur dann hinzugefügt, wenn sie dazu beitragen.

Intentionen sind damit eine Möglichkeit, ausgewählte Items fokussiert im Orbit zu betrachten. Eine Intention bildet jedoch keinen neuen Speicherort. Alle geclusterten Items bleiben Bestandteil des gesamten Orbits. Sie stellen darin eine gesonderte Darstellungsart dar, eine Art Definition, die Items in Bezug auf eine eine individuelle Absicht setzt.

Werden die formulierten Absichten schlussendlich erreicht, verlieren Intentionen dadurch ihre Bedeutung und können somit gelöscht werden.Die enthaltenen Items werden jedoch nicht automatisch mitgelöscht, sondern verlieren lediglich ihre definierte Zugehörigkeit und bleiben Bestandteil des Orbits. Darin liegt auch der entscheidende Unterschied zu herkömmlichen Ordnersystemen. Orbit schafft auf diese Weise ein System, dass Inhalte nicht nur themenbasiert gruppiert, um sie wiederzufinden, sondern diese primär zweckorientiert organisiert.

intentions.pngintentions.png


Entstehung

Als Kursthema und damit auch Kontext für unsere erste Brainstroming Session stand das Stichwort Mashup.

Ein Mashup ist eine kreative Kombination oder Verschmelzung verschiedener Elemente, oft aus unterschiedlichen Quellen wie etwa Musikstücken, Videos und Bildern, um ein neues, einzigartiges Werk zu schaffen.

Wir hingegen sollten verschiedene Apps analysieren und diese zu neuen Apps synthetisieren. Gemeinsam wollten wir an dem Thema „Speicherung von digitalen und analogen Inhalten“ ansetzen, und dabei Funktionen von Anwendungen wie der „Spotlight-Suche„ und „Obsidian“ integrieren, da wir beide der Meinung sind, dass bestehende Systeme bisher nur eine halbgare Lösung darstellen. 

So we started cooking. 👨🏻‍🍳👨🏼‍🍳

Brainstorming

Angefangen haben wir mit einer ausgiebigen Brainstorming Session. Dabei haben wir unsere Gedanken mittels Post-It's geteilt und festgehalten, Ideen weiterentwickelt und schließlich unsere Überlegungen geclustert, um darauf aufbauend Funktionen und einen groben Aufbau für eine neue App abzuleiten.

brainstorming.pngbrainstorming.png

Zielgruppen

Nachdem wir durch das Brainstorming unsere Vorstellungen abgestimmt hatten, identifizierten wir potenzielle Zielgruppen für die Nutzung der App. Dabei entschieden wir uns, zwei Extreme zu repräsentieren und die Merkmale einer unstrukturierten (Peilo) und einer äußerst strukturierten Person (Hyperorganisierer) zu definieren.

zielgruppen.pngzielgruppen.png

Jobs To Be Done

Diese Personas sollten uns im nächsten Schritt dabei helfen, sogenannte Jobs To Be Done zu formulieren. Dabei handelt es sich um eine Methodik, die nicht nach den Eigenschaften der User*innen fragt, sondern nach den Aufgaben, die sie mit der Anwendung erfüllen möchten. Dies soll dazu beitragen einen neuen Blickwinkel auf das Produkt und die Nutzer*innen zu werfen.

Rückblickend waren wir bei der Ausführung bereits durch unsere eigenen Wünsche und Vorstellungen zu voreingenommen, was dazu führte, dass wir beim Formulieren der Jobs To Be Done bereits stark in Features dachten. Dadurch verfehlten wir den eigentlichen Zweck, unserer Herangehensweise eine neue Perspektive zu geben.

jtbd.pngjtbd.png

Ziele und Wünsche

Dennoch halfen sie uns in unserem Prozess, Wünsche und Ziele unserer App besser zu formulieren und auch untereinander zu diskutieren. Auf diese Weise konnten wir einen klaren Fahrplan für die Entwicklung der App festlegen.

zieleWünsche.pngzieleWünsche.png

User Story Map

Um eine Haltestelle weiter zu kommen und das gemeinsame Zielbild unserer App festzuhalten, arbeiteten wir mit einer User Story Map. Diese half uns nicht nur dabei, Funktionen und User Flows aufzuzeigen, sondern auch einen Backlog für zu berücksichtigende Informationen zu erstellen. Gleichzeitig legten wir auch die ersten Grundsteine für die Navigation innerhalb der App.

userStory-1.pnguserStory-1.png
userStory-2.pnguserStory-2.png
userStory-3.pnguserStory-3.png

Wireframes

Mit diesem Zielbild konnten wir uns daran machen, Wireframes zu gestalten. Zugegeben, dies waren nicht die ersten Visualisierungen unserer App. Bereits zuvor hatten wir hier und da „Wireframes“ in Figma erstellt, um gemeinsame Visionen zu diskutieren. Dabei verloren wir uns jedoch oft in Designdetails, die unseren Prozess eher behinderten als bereicherten. Daher entschieden wir uns bewusst dafür, in dieser Phase des Entwicklungsprozesses auf Paperprototyping zu setzen, um den Fokus auf benötigte UI-Elemente, Hierarchie und Navigation zu legen.

wireframes2.pngwireframes2.png
wireframes1.pngwireframes1.png

Screendesign

Folgend begonnen wir damit, unsere Wireframes in Figma umzusetzen. Während dieses Prozesses überdachten wir viele Ideen erneut und strichen teilweise ganze Funktionen. Ein Beispiel hierfür ist unsere erweiterte Suchfunktion mit dem Projekttitel „Spider-Web“, die im Wireframing noch eine primäre Rolle spielte. Im endgültigen Design stellten wir jedoch fest, dass ihre Nutzung und Interaktion nicht praktikabel waren und Orbit ohne sie besser dastand. Natürlich fanden wir uns auch in zahlreichen Designiterationen wieder. Wir erkundeten dabei verschiedene Darstellungsmöglichkeiten und befassten uns mit der erforderlichen Informationsdichte von Elementen.

orbit-screendesign.pngorbit-screendesign.png

Designsystem

Schließlich entwickelten wir auf der Basis von zahlreichen Explorationen und Überarbeitungen unser Designsystem. Der gesamte Entstehungsprozess erlaubte es uns, verschiedene Optionen zu erforschen, Feedback zu integrieren und die optimalen Lösungen zu identifizieren, die den Anforderungen und Zielen unseres Projekts am besten entsprechen.

orbit-designsystem.pngorbit-designsystem.png

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im zweiten Studienabschnitt

Betreuung

foto: Paul Thiele foto: Ivo Herrmann

Zugehöriger Workspace

Mashup! Vol. 3

Entstehungszeitraum

Wintersemester 2023 / 2024

Keywords