Adobe Photoshop ist der Klassiker und bis heute Weltmarktführer für professionelle Bildbearbeitung. Das 1990 erstmals veröffentlichte Tool bietet zahlreiche Funktionen, um Bilder und Grafiken zu bearbeiten und zu verbessern.

Figma hingegen wurde für UX (User Experience, neudeutsch für Nutzererfahrung)- bzw. UI (User Interface, neudeutsch für Benutzeroberfläche)-Design entwickelt und im Jahr 2016 veröffentlicht.

Können dennoch beide, Figma und Photoshop, verglichen werden? Wo liegen die genauen Unterschiede?

Welche Plattform für Grafiksoftware?

Adobe Photoshop nutzt als arbeitsplatzbezogene Software die klassische Plattform für Bildbearbeitung, die für macOS, Windows und iPadOS zur Verfügung steht. Diese wird zentral auf einem Computer installiert und steht damit nur dem dort angemeldeten Benutzer zur Verfügung.

Die KI-fähige Lösung Adobe Creative Cloud ermöglicht dennoch mehreren Personen, zusammen und gleichzeitig an einem Bild zu arbeiten. Dafür gibt es einen speziellen Invite-to-Edit-Schalter, mit dem andere Accounts eingeladen werden können. Wer also aus dem Büro oder Home Office an einem Bild arbeitet, benötigt weiterhin eine lokale Installation.

Die umfangreichen Funktionen und Ressourcen sorgen für eine starke Beanspruchung des Personal Computers oder Laptops. Dadurch können andere Funktionen oder die Arbeitsgeschwindigkeit beeinträchtigt werden.

Eine alternative Lösung wäre die Installation eines Fernzugriffs oder eines serverbasierten virtuellen Desktops, die aber teilweise noch größere Nachteile in der Performance haben.

Figma gibt es ebenfalls als Desktop-App, die allerdings für alle in Unternehmen gebräuchlichen Betriebssysteme zur Verfügung steht: Linux, macOS, Windows, ChromeOS, Android und iOS. Dabei gibt es auch eine webbrowserbasierte Variante, die für Google Chrome, Safari, Microsoft Edge und Firefox verfügbar ist.

Insbesondere die Webbrowservarianten beanspruchen Prozessor und Grafikkarte weitaus weniger als Photoshop und sind damit besonders beliebt. Es erlaubt das gleichzeitige Arbeiten an einem Projekt, wobei extra Tools für Projektmanagement, Versionskontrolle und eine Kommentar- bzw. Notizfunktion integriert sind. Das erlaubt ein besseres, strukturiertes Arbeiten im Team. Wer aber gerade nicht mit dem Internet verbunden ist, kann das Programm nicht nutzen.

Funktionen für die Bildbearbeitung

Photoshop bietet eine Vielzahl von leistungsstarken Funktionen für die Bildbearbeitung. Mit seinem Ebenensystem ermöglicht es eine präzise und nicht-destruktive Bearbeitung, wodurch einzelne Änderungen wieder rückgängig gemacht werden können.

Damit können verschiedene Anpassungen ausprobiert und dann auch komplett zurückgenommen werden, ohne dass ein ständiges Zwischenspeichern als verschiedene Versionen notwendig ist.

Verschiedene Auswahlwerkzeuge erlauben es, bestimmte Teile eines Bildes auszuwählen und zu bearbeiten. Retuschierwerkzeuge helfen dabei, einzelne Bereiche zu manipulieren und beispielsweise bei Gesichtern Unregelmäßigkeiten zu entfernen oder Haut zu glätten.

Zahlreiche Filter und Effekte stehen zur Verfügung, um Bilder zu verändern und zu verbessern. Textwerkzeuge ermöglichen das Hinzufügen und Formatieren von Text. Zudem bietet es umfangreiche 3D-Bearbeitungsfunktionen.

In Figma gibt es ebenfalls einige Tools, um Bilder zu bearbeiten. Dazu gehören verschiedene Möglichkeiten der Bildtransformierung wie Zuschneiden, Skalieren, Drehen und Spiegeln. Auch das Anpassen von Helligkeit, Kontrast und Farben ist möglich.

Zudem lassen sich verschiedene Ebenen und Masken verwenden, um bestimmte Bereiche eines Bildes zu isolieren und separat zu bearbeiten. Damit können Anwender grundsätzlich ebenfalls Bilder bearbeiten, jedoch nur in sehr rudimentären Ausmaßen.

Prototypen im Bereich des UX bzw. UI Design

Figma ist ein cloudbasiertes (es lässt sich über das Internet aufrufen) Design-Tool, das sich besonders für die Erstellung von Benutzeroberflächen und die Entwicklung von Prototypen (Definition: Ein Prototyp ist ein funktionsfähiges, aber vereinfachtes Versuchsmodell einer Software. Quelle: t2informatik Blog) für Webseiten und Anwendungen eignet.

Eine der besten Merkmale ist seine vektorbasierte Designumgebung. Diese ermöglicht es Designern, Grafiken zu erstellen, die unabhängig von ihrer Größe gestochen scharf sind. Durch die Verwendung von Vektoren können somit Benutzeroberflächen und Icons problemlos skaliert und angepasst werden, ohne dass das Objekt völlig in einer anderen Größenversion neu erstellt werden müsste.

Dies bedeutet, dass Designer sich weniger Gedanken über verschiedene Bildschirmgrößen und -auflösungen machen müssen und sich stattdessen auf die Gestaltung großartiger Designs konzentrieren können.

Mit Figma können Designer nicht nur statische Designs erstellen, sondern auch interaktive Prototypen, die das tatsächliche Benutzererlebnis simulieren. Dies ermöglicht es Designern, ihre Designs auf Herz und Nieren zu prüfen, bevor sie in die Entwicklung übergehen.

Es bietet auch eine Vielzahl von Bibliotheken und Ressourcen, die Designern dabei helfen, ihre Kreativität zu entfalten. Von vorgefertigten UI-Kits über Icons bis hin zu Schriftarten bietet das Programm eine umfangreiche Auswahl, die Designern helfen, Zeit zu sparen und sich auf das Wesentliche zu konzentrieren: die Gestaltung großartiger Benutzeroberflächen.

Photoshop ermöglicht es Designern, Benutzeroberflächen und UI-Elemente wie Schaltflächen, Symbole und Menüs zu erstellen. Mit den umfangreichen Grafik- und Zeichenwerkzeugen können Designer hochwertige Designs erstellen.

Obwohl es nicht über dedizierte Prototyping-Funktionen wie Figma verfügt, können Designer dennoch interaktive Prototypen erstellen, indem sie verschiedene Bildschirmzustände in separaten Ebenen entwerfen und sie dann mit Verknüpfungen oder Animationen verbinden. So kann eine Benutzeroberfläche in ihrem Usererlebnis getestet werden.

Dennoch sind diese Funktionen sehr eingeschränkt, da ein umfangreiches Testen der Benutzeroberflächen während der Entwicklung nicht möglich ist.

Weitere Unterschiede bei den Programmen

Neben diesen beiden Hauptunterschieden trennen beide Programme noch ein paar andere Dinge. Vor allem bei der Benutzerfreundlichkeit merkt man einen Unterschied, denn die Vielzahl an Funktionen macht Photoshop eher unübersichtlich. Um die verschiedenen Werkzeuge zu finden und die Möglichkeiten kennen zu lernen, ist eine gewisse Einarbeitungszeit notwendig.

Die Benutzeroberfläche von Figma ist weitaus übersichtlicher und intuitiver, sodass es auch für Anfänger einen einfacheren Einstieg ermöglicht.

Wer einmal Hilfe benötigt, findet bei beiden Programmen einen E-Mail-Support, eine Wissensdatenbank und ein Forum. Da Photoshop allerdings weitaus mehr Anwender hat, gibt es in der Community weitaus mehr Lösungen. Zudem bietet das Adobe-Programm auch einen Telefonsupport, 24/7-Erreichbarkeit und einen Chat.

Für beide Programme lassen sich für die meisten Funktionen umfangreiche Erklärvideos auf den gängigen Videoplattformen finden, wobei es auch hier für Photoshop mehr Auswahl gibt.

Fazit: Das beste Grafikprogramm?

Neben einigen Gemeinsamkeiten gibt es zwischen Photoshop und Figma sehr große Unterschiede.

Zwar haben beide Programme Funktionen für alle Bild- und Grafikbearbeitungen. Sie unterscheiden sich aber deutlich bei ihrem Schwerpunkt.

Während Photoshop seine großen Stärken in der Bildbearbeitung hat, ist Figma bestens für UX- und UI-Designs geeignet. Damit kommt es auf das jeweilige Projekt an, um das beste Programm zu finden.

Photoshop ist am besten geeignet für:

• Fotografen zur Verbesserung und Bearbeitung von Fotos
• Illustratoren zur Erstellung von kreativen Grafiken
• Grafikdesigner zur Erstellung von Logos und anderem
• PR-Spezialisten zur Bearbeitung von Plakaten
• Marketingfachleute zur Erstellung von Broschüren

Dagegen ist Figma eher bei folgenden Berufsgruppen anzutreffen:

• UX/UI-Designer zur Erstellung interaktiver Benutzeroberflächen
• Produktdesigner für Apps, Webseiten und anderes
• Produktmanager zur Nachverfolgung von Benutzerflüssen

Insgesamt ergänzen sich Photoshop und Figma eher, anstatt Konkurrenten zu sein.

Zusatz: Im Webdesign

Man kann sagen, dass immer mehr Webdesigner auf Figma umsteigen, da es für User Interface Design gemacht ist und es die Prozesse hier vereinfacht. Während Photoshop eigentlich für die Bearbeitung von Fotos gedacht war, um im Grunde genommen für das Webdesign umfunktioniert wurde, da man damit Benutzeroberflächen designen kann.

Der Übernahmeversuch von Figma durch Adobe zeigt, wie wichtig das UI Tool für Webdesigner geworden ist. Denn lange Zeit war Adobe das Go To Werkzeug, um Benutzeroberflächen zu erstellen. Das hat sich mit Figma geändert.

Die Übernahme wurde jedoch nicht durch den Gesetzgeber genehmigt. Auch das zeigt, dass auch die Marktregulatoren in der EU/ Großbritannien erkannt hatten, wie Markt-dominierend Adobe dadurch geworden wäre.

Interessante Links:

Ein Vergleich der beiden Werkzeuge auf getapp

Unterschiede von Figma und Photoshop (Beitrag auf Englisch)

Bilder: Canva

Der Autor: Sascha Thattil arbeitet bei YUHIRO und hilft Unternehmern und Unternehmen beim einfachen Aufbau von Programmier-Teams in Indien. YUHIRO ist ein deutsch-indisches Unternehmen welches IT Firmen, Agenturen und IT Abteilungen Softwareentwickler bereitstellt.

User Experience, auch abgekürzt UX genannt, heißt so viel wie Nutzererfahrung oder Nutzungserlebnis. Gemeint ist damit die Erfahrung eines Menschen, der ein Produkt oder eine Umgebung nutzt.

Dazu gehören auch Software und IT-Systeme. UX umfasst dabei die Erfahrungen vor, während und nach der Nutzung des Produktes. Dabei spielen drei wesentliche Punkte aus Sicht des Nutzers eine Rolle: die Stabilität des Produktes, seine Schönheit und die Nützlichkeit.

In der ISO 9241-210 wird UX über die Wahrnehmungen als auch über die Reaktionen einer Person beschrieben, die während der Nutzung des Produktes entstehen. Auch die emotionalen Empfindungen des Nutzers gehören dazu. Etliche Aspekte einer Nutzererfahrung sind allerdings subjektiv und nicht immer direkt messbar.

Wie messe ich die User Experience einer Webseite?

Die Stabilität einer Webseite können Sie messen. Dies geschieht zum Beispiel über Zugriff- oder Antwortzeiten auf der Weboberfläche. Auch die Sicherheit spielt eine wesentliche Rolle. Kann diese Seite schnell gehackt werden, fällt sie schon durch. Um die Nützlichkeit und Schönheit einer Webseite aus Sicht des Betrachters zu messen, können Sie verschiedene Methoden mit Probanden durchführen.

Beim Eye-Tracking analysieren Sie die Augenbewegung des Nutzers. Mit einem Screen-Recording oder Session-Recording wird das Verhalten während und nach der Nutzung der Webseite am Bildschirm aufgezeichnet und anschließend analysiert. Auf diese Weise erleben Sie Ihre Webseite mit den Augen der Benutzer. Für Webentwickler ist eine solche Sichtweise wichtig, um die Nutzeroberfläche gezielt zu verbessern.

Sehr effektiv ist auch der sogenannte Fünf-Sekunden-Test. Innerhalb der ersten fünf Sekunden haben Nutzer bereits einen ersten Eindruck der Seite erhalten. Über Interviews und Fragebögen stellen Sie gezielte Fragen an die Teilnehmer, deren Beantwortung bei der Webentwicklung hilft. Für einen erfolgreichen Webauftritt müssen Sie die Bedürfnisse und Anforderungen Ihre Zielgruppe kennen. Ebenso sollten Sie wissen, wie sie sich im Netz bewegt. Interaktivität und Verweildauer sind heute sehr wichtige Aspekte für den Erfolg einer Webseite.

Was verstehen wir darunter?

User Experience Design ist das Gestalten des Nutzererlebnisses. Der Programmierer kennt die Anforderungen, Wahrnehmungen und Empfindungen der User. Daher gestaltet er von Anfang an die Nutzeroberfläche einer Software so, dass die Zielgruppe ein positives Nutzererlebnis mitnimmt. Genau genommen ist User Experience Design ein fortlaufender Prozess während der Produkterstellung.

Das beginnt bereits mit dem Branding, wenn Sie eine Markenidentität neu erschaffen. Die Wahrnehmung der Zielgruppe, für welchen Nutzen und welche Werte und Eigenschaften ein Produkt steht, ist für die weitere Softwareentwicklung sehr wichtig.

Das gilt ebenso für den weiteren Prozess der Gestaltung und Integration des Produktes. Um den Nutzern letztlich genau die für sie relevanten und sinnvollen Erfahrungen zu bieten, ist das Folgende sehr wichtig: Die Webdesigner kennen die Erwartungen und Anforderungen der Kunden von Anfang an und hinterfragen sie über den gesamten Prozess. Mit Anwendung des User Experience Designs gelingt es letztlich, dass die Schnittstelle zwischen Mensch und Maschine zu einem angenehmen Erlebnis wird.

Welche Vorteile hat die Nutzung des User Experience Design?

Sobald die von einem User Experience Designer entwickelten Schnittstellen flüssig funktionieren, hat der Anwender positive Erlebnisse bei der Nutzung. Dazu gehört auch, dass die Schnittstellen einfach, logisch und in sich geschlossen sind.

Nutzer, die über den gesamten Prozess der Produkt- oder Markenentwicklung im Focus der Entwickler standen, nehmen positive Erfahrungen mit. Diese Erfahrungen sorgen letztlich dafür, sie zu loyalen und treuen Kunden werden zu lassen.

Ist eine Webseite intuitiv gestaltet, wird sie neben einer Kundenzufriedenheit weitere Vorteile bringen. Beispielsweise werden mehr Leads generiert. Hierunter ist die Gewinnung qualifizierter Interessenten zu verstehen, die ihre Kontaktdaten aus dem eigenen Antrieb heraus übermitteln. Die Folge ist eine höhere Conversions (Umwandlungen von Interessenten in Kunden) und damit ein höherer Umsatz.

Welche Methoden gibt es für UX in der Produktentwicklung?

Eine beliebte Methode ist das Lean-UX. Um schlanke und effektive UX-Prozesse zu generieren, arbeiten Sie in interdisziplinären Teams, die alle notwendigen Kompetenzen für die Produktentwicklung vereinen. Notwendige Entscheidungen trifft rasch das Team selbst. Kleine Arbeitspakete und regelmäßige UX-Tests mit echten Nutzern helfen schneller voranzukommen und lösen rasch eventuell anstehende Probleme. Alle Tätigkeiten, die nicht zum Erfolg führen, lassen Sie weg.

Eine weitere Methode, die gern angewendet wird, ist die Methode des User-Centered Design. Der Nutzer wird bereits von Beginn an einbezogen. Die Bedürfnisse der User sind der Ausgangspunkt und bestimmen den Inhalt und das Design des Endproduktes. Mit einer frühen Konzipierung und Visualisierung des Endprodukts durch den Nutzer ist eine klare Vorgabe für die Umsetzung gegeben.

Es existieren bereits klare Vorgaben für das Funktionieren der Prozesse, Produkte und Applikationen. Spätere Spezifikationen sind durch eine enge Zusammenarbeit möglich.

Was muss getan werden, um den Nutzer zu verstehen?

Es genügt nicht, zu Beginn einer Produktentwicklung den späteren Anwender der Ergebnisse nach seinen Anforderungen, Wünschen und Empfindungen zu befragen.

Dies ist nur der Anfang. Während des gesamten Gestaltungsprozesses erfragen Sie immer wieder die Bedürfnisse und konkretisieren diese in Tests.

Was ist ein User Interface Design?

Ein User Interface, als Abkürzung UI genannt, benennt die Schnittstelle der Maschine oder der Software zum Anwender. Es handelt sich also genau um die Art und Weise, wie ein Mensch in Kontakt mit der Maschine tritt.

User Interface Design ist das Design der Benutzeroberfläche. Die Interaktion des Benutzers effizient und einfach zu gestalten, ist das Ziel des User Interface Design. Gleichzeitig müssen die Nutzer darüber die Benutzerziele erreichen. Sie dürfen diese Ziele nicht über der Designgestaltung vergessen.

Welche Anforderungen muss ein User Experience Designer erfüllen?

Ein guter UX-Designer hat neben einem soliden IT-Fachwissen auch Projekterfahrungen aus mehreren Projekten. Dennoch werden zunehmend branchenfremde Quereinsteiger gern zu UX Designern. Hierfür bieten etliche Firmen spezielle Traineeprogramme an.

Die wichtigsten persönlichen Kompetenzen sind daher die Fähigkeit zu innovativem und kreativem Denken und der absolute Willen, komplexe Kundenbedürfnisse aufzunehmen. Immer auf dem Laufenden zu sein, was die Digitalisierung und neue Entwicklungen betrifft, hilft Ihnen dabei, die neuen Herausforderungen zu meistern.

Das Erlebnis des Nutzers steht für Sie im Mittelpunkt. Programmierung und Designgestaltung sind die technischen und methodischen Voraussetzungen dafür.

Fazit

User Experience Designer gestalten in enger Zusammenarbeit mit anderen für die Produktentwicklung erforderlichen Fachleuten Services und Produkte, die das Leben der Nutzer erleichtern. Dabei haben sie die potenziellen Nutzer ständig im Focus und tauschen sich mit ihnen aus.

Ein User Experience Design umfasst daher nicht nur Empfindungen und Wahrnehmungen der Nutzer, während diese das Produkt nutzen oder testen. Auch ihre Erwartungen zum Zeitpunkt vor und während der Produktentwicklung gehören dazu.

Individuelle Kundenerlebnisse werden indirekt beeinflusst, indem digitale Services und Schnittstellen so gestaltet werden, wie sie der Nutzer haben möchte. Das ist es, was User Experience besonders spannend und zunehmend beliebt macht.

Interessante Beiträge:
Es wird auf page online aufgezeigt was User Experience Design ist
UX Design wird auf t3n einfach verständlich erklärt

Bilder: Canva

Der Autor: Sascha Thattil arbeitet bei YUHIRO und hilft Unternehmern und Unternehmen beim einfachen Aufbau von Programmier-Teams in Indien. YUHIRO ist ein deutsch-indisches Unternehmen welches IT Firmen, Agenturen und IT Abteilungen Softwareentwickler bereitstellt.

Es gibt so viele Mobile Anwendungen auf dem Markt wie noch nie. Nur einige davon werden auch zum Erfolg. Dies liegt sicherlich auch daran, dass oftmals das Design der App vernachlässigt wird und relativ schnell mit der Programmierung angefangen wird.

Ein gutes App Design ist jedoch notwendig, um heutzutage mit eine Mobilen Anwendung erfolgreich zu sein. Der folgende Beitrag gibt ein paar Tipps und zeigt den Weg auf, wie man so eine Anwendung am besten designen kann.

Web versus Mobile

Viele App Entwickler kommen aus dem Webdesign Bereich. Im Bereich Web sind jedoch andere Punkte wichtig als im Bereich Mobile. Denn im Bereich Mobile sind die Bildschirme sehr viel kleiner und es kommen immer mehr Gerätetypen hinzu. Das beste Beispiel sind die neuen Smartwatches. Diese zeigen, um ein vielfaches weniger an Informationen an und müssen dennoch schön aussehen.

Den Nutzer verstehen

Es ist wichtig herauszufinden, welchen Vorteil der Nutzer von der Anwendung hat und warum er/ sie die Anwendung mehr als einmal nutzen sollte. Um das herauszufinden kann man die folgenden Dinge unternehmen

• Personas erstellen: Personas sind Beschreibungen von möglichen Nutzern. Beispielsweise: Nutzer ist zwischen 25 und 30 Jahren alt, betreibt regelmässig Yoga und arbeitet als Projektmanager in einem IT Unternehmen. Hier ein Beispiel, wie solch eine Persona erstellt werden kann.
• Nutzer Szenarien: Szenarios geben einen Einblick, wie sich eine Persona verhalten wird, um damit eine Nutzeroberfläche zu erstellen, welche für diese am besten passt und mit welcher sie ihre Ziele erreichen können. Hier mehr zu Nutzer Szenarien.
• Experience Map: Eine Experience Map ist eine genaue Beschreibung des Weges,welcher ein Besucher der App hinlegt. Hier etwas mehr dazu: Experience Maps.

Wettbewerb analysieren

Es ist immer gut zu schauen was der Wettbewerb macht. Jedoch sollte man sich davon nicht allzusehr beeinflussen lassen. Denn man möchte im Idealfall etwas anbieten, was um Längen besser ist, als was der potenzielle Kunde derzeit nutzt. Das beste Beispiel ist Whatsapp. Es hätte für die Entwickler der Anwendung Sinn gemacht, den Wettbewerb zu analysieren. Die Umsetzung von Whatsapp selbst war jedoch um Längen besser, als dass was man vom Wettbewerb bekam.

Ein weiteres Beispiel ist Quora (Web-basiert). Auch hier wäre eine Analyse von Plattformen wie gutefrage.net von Vorteil gewesen. Die finale Version von Quora ist jedoch bei weitem besser, als diese bei gutefrage.net der Fall ist.

Auch kann man sich unterschiedliche Apps herunterladen und diese mit den eigenen Funktionalitäten vergleichen. Dabei kann man auch die Aufmachung dieser Anwendungen vergleichen und schauen welche Unterschiedlichkeiten und Ähnlichkeiten es gibt.

Gerätevielfalt beachten

Es setzen sich immer mehr Geräte im Mobile Bereich ein. Sei es durch unterschiedlich grosse Geräte (Wearables, etc.) oder über neue erfolgreiche Anbieter, wie zum Beispiel Xiaomi, welche bereits den höchsten Anteil an Smartphone-Verkäufen in China hat.

Betriebssysteme berücksichtigen

Jedes der Betriebssysteme, wie zum Beispiel Android, iOS oder WindowsPhone haben deren eigenen Design Guidelines. Hier mehr Informationen dazu: Android Design Informationen.

Ein Kreativer sollte einen guten Überblick haben, wo was benötigt wird und worauf es zu achten gilt.

Mit Wireframe statt Photoshop starten

Viele Designer starten lieber mit Photoshop und erstellen gleich mal die ersten Seiten der neuen Anwendung.

Besser ist es auf Wireframes zu setzen, welche schnell erzeugt sind. Es gibt hier viele Online Tools, welche dabei unterstützen können. Wireframe|cc ist ein mögliches Tool dafür.

Diese lassen sich den Kunden, Teamkollegen und Managern schneller vorzeigen und es lassen sich auf dieses Feedback, schneller Änderungen vornehmen.

Bei einem fertiggestellten Photoshop Bild wird das bereits erheblich schwieriger und verbraucht viel Zeit.

Auf Papier zeichnen

Eine andere Möglichkeit ist es, die Wireframes auf Papier zu zeichnen und diese dann als Wireframes zu nutzen.

Prototyping

Mit den Wireframes oder den Papierzeichnungen lassen sich daraufhin erste klickbare Anwendungen erstellen. In manchen Online Werkzeugen, ist diese Funktion bereits erhalten. Zum Beispiel in Axure.

Mobile First

Immer mehr setzt sich der Mobile First (Englisch für: Mobil zuerst) Gedanke durch. Man erzeugt das Design also für den kleinsten Bildschirm und arbeitet sich dann langsam zu den grösseren Bildschirmen hin.

Besonders für Anwendungen, welche auch auf Desktops und Laptops laufen, kann das sinnvoll sein. Denn oftmals startet man in der Web-Welt, um dann auf die Smartphones zu übersetzen. Wenn man jedoch von der Mobilen Version als Ausgangspunkt ausgeht, dann ist man bereits gezwungen, sich darüber Gedanken zu machen. Man wird dadurch andere Ansätze finden.

Mit Mobile First schafft man es auch, ein wenig weiter weg vom Webhintergrund zu kommen. Das ist gut so, denn immer mehr Menschen gehen Mobil ins Netz und nicht via Rechner, Laptop und anderen grösseren Geräten. Dies ist auch deshalb wichtig, weil die meisten Nutzer heutzutage Mobil ins Internet gehen und weniger über PC’s.

Beim Mobile First Ansatz kommt dem Content (den Inhalten wie, Buttons, Texte, Bilder, Videos, Grafiken, etc.) eine grosse Wichtigkeit zu. Denn je nachdem wie der Content aussieht, wird sich auch die Anwendung verändern. So ändert sich die Anwendung, wenn zum Beispiel überwiegend Bilder genutzt werden und weniger Text.

Dicke Finger

Nutzer haben in den meisten Fällen dicke Finger und auch eine unterschiedliche Weise ein Gerät in der Hand zu halten. Das muss berücksichtigt werden, wenn man die Interaktionselemente zeichnet.

Auch unterscheidet sich die Art und Weise wie man ein Smartphone oder ein Tablet hält. Hier spielt wiederum die Grösse des Gerätes eine Rolle. Bei einem Smartphone wird man höchstwahrscheinlich das Smartphone in einer Hand halten und mit dem Finger der anderen Hand die Befehle angeben. Während manche bei Tablets beide Hände und die Daumen für die Navigation nutzen.

Im ständigen Wandel

Wichtig ist für einen App Designer auch zu verstehen, dass sich Design Anforderungen ständig ändern. Heutzutage ist zum Beispiel das Flat Design eher gefragt. Auch das von Google eingeführte Material Design scheint immer mehr Anhänger zu finden.

Auch macht es Sinn ein erstes Modell zu erzeugen, und mögliche Nutzer dann nach Änderungswünschen oder Vorschlägen zu fragen, anstatt etwas Fertiges zu bauen.

Mobile Technologien ändern sich schnell, also Up-To-Date bleiben

Auch die Technologien hinter den Anwendungen ändern sich im Monatstakt. Auch hier sollte ein Kreativer up-to-date bleiben und dies in der Arbeit berücksichtigen. Besonders die Betriebssysteme Android und iOS ändern sich ständig.

Der Experte muss aus Sicht der Anwender handeln

Als Kreativer kann man schnell aus seinen eigenen Erfahrungen schöpfen, und wird oftmals den Nutzen für den Kunden nicht berücksichtigen. Der Experte weiss eventuell, das bei einer bestimmten Aktion, etwas auf dem Bildschirm passiert. Der normale Nutzer mag sich damit eventuell nicht auskennen.

Daher sollte man seine eigene Sichtweise zurückstellen und die Sichtweise des Nutzers in den Vordergrund stellen.

Branding

Wie im Web auch, muss im Bereich Mobile das Branding auch stimmig sein.

Für die gleichen Buttons (Tasten) sollte man also die gleiche Beschriftung und auch die gleichen Farben angeben.

Gemeinsame Sprache finden

Die Menschen die das Feedback geben werden, kennen viele Begriffe, die ein Kreativer verwendet nicht. Umgekehrt mag ein Entwickler andere Wörter nutzen, als ein Designer.

Man sollte sich also mit den Projektteilhabern auf einfache Begriffe einigen, welcher jeder mit der gleichen Sache assoziiert. Nicht jeder weiss was ein UI, UX, Material Design, Flat Design oder eine Customer Journey Map ist. Umgekehrt kann es sein, dass der Kreative nicht weiss, was eine API, ein Call-To-Action oder ein Sprint ist.

Durch Nutzung der gleichen Sprache, kann man die Zusammenarbeit vereinfachen und mögliche Missverständnisse vermeiden.

Teamarbeit wertschätzen

Eine gute Nutzeroberfläche kann nicht in Isolation entstehen. Verschiedenste Abteilungen, Test-Nutzergruppen, Entwickler und in manchen Fällen Mitarbeiter und Manager auf Kundenseite, müssen zusammenarbeiten, um ein gutes Ergebnis zu kommen.

Hier benötigt es sehr viel Interaktion mit diesen Gruppen/ Menschen. Dabei sollten jedoch immer die Wünsche und Bedürfnisse der Nutzer im Vordergrund stehen.

Testing nicht vernachlässigen

Im Bereich Web lassen sich Photoshop Designs schnell überprüfen. Da das Gerät auf welchem man zeichnet und das Gerät auf welchem das Bild angezeigt wird, in den meisten Fällen die Gleichen sind.

Mobile Anwendungen werden oftmals auch am PC erstellt. Hier benötigt es dann weitere Software, um diese auf dem Smartphone darzustellen.

Um hier nicht aus dem Konzept zu kommen, kann man die Bilder nacheinander für die verschiedenen Betriebssysteme erzeugen. Beispielsweise kann man mit Android oder iOS starten und nach der Fertigstellung der Bilder für das jeweilige Betriebssystem, geht man auf das nächste Betriebssystem über.

Fazit

Viele Kreative, welche in der Web Welt gross geworden sind, steigen in den Bereich Mobile ein. Wichtig ist jedoch zu verstehen, das die Ansätze unterschiedlich sind und sich daher auch die Arbeitsweise ändern muss.

Bilder: Flickr.com/ Sonin/ gdsteam/ Wroblewski/ Mann/ Buttfield-Addison

Der Autor: Sascha Thattil arbeitet bei YUHIRO und hilft Unternehmern und Unternehmen beim einfachen Aufbau von Programmier-Teams in Indien. YUHIRO ist ein deutsch-indisches Unternehmen welches IT Firmen, Agenturen und IT Abteilungen Softwareentwickler bereitstellt.