Inhaltsverzeichnis
- Web for All, Web on Everything
- UI Developer
- Verantwortlichkeiten
- Die Vorteile von UI-Entwicklern in Ihren Projekten
- Die Zukunft der Rolle des UI-Entwicklers
Wir erleben ein intensives Wachstum in der IT-Branche. Es gibt viele Unternehmen und Produkte auf dem Markt, die um die gleichen Kunden konkurrieren. Das endgültige Ergebnis hängt von mehreren Faktoren ab. Rasmus Andersson, der Mitbegründer des Erfolgs von Spotify, sagte: "Die Leute kommen wegen der Funktionen, aber sie bleiben wegen der Details." Merken Sie sich diesen Satz, während ich Ihnen die Rolle des User Interface (UI) Developers vorstelle, der sich um die Details kümmert, die ganze lange Liste davon.
Web for All, Web on Everything
Als die ersten Webseiten in den 1990er Jahren erstellt wurden, wurden sie in der Regel auf CRT-Bildschirmen mit einer Auflösung von 800 x 600 Pixeln angezeigt, die an einen PC angeschlossen waren.
Heute, über 30 Jahre später, sieht die Situation völlig anders aus. Es gibt mehr Geräte als je zuvor. Sie müssen Tablets, Smartphones und hochauflösende Fernseher berücksichtigen, aber auch die Anzeigebildschirme an Kühlschränken oder LCD-Panels in Fahrzeugcockpits. Die Bedingungen und der Kontext, in denen wir Geräte verwenden haben sich ebenfalls verändert. Der Benutzer ist nicht mehr nur ein Büroangestellter. Es könnte sich um einen Elternteil handeln, der mit seinem Kind versucht dank eines Smartphones das Busticket zu bezahlen. Oder es handelt sich um einen Touristen, der an einem regnerischen Abend auf einem Handy-Bildschirm die Route zur nächsten Herberge analysiert. Oder sie könnten bestimmte Behinderungen (visuell, kognitiv oder motorisch) haben und unterstützende Tools wie einen Bildschirmleser verwenden.
Das WC3 (World Wide Web Consortium) hat die Mission, "das World Wide Web zu seinem vollen Potenzial zu führen, indem Protokolle und Richtlinien entwickelt werden, die das langfristige Wachstum des Webs sicherstellen." Ihre grundlegenden Designprinzipien umfassen die Worte „Web for All, Web on Everything“. Das bedeutet, dass das Internet für alle zugänglich sein sollte, unabhängig von der Art der verwendeten Geräte.
Die Anpassung digitaler Produkte an diese ungewohnten Bedingungen ist heute viel komplexer als früher und erfordert eine besondere Aufmerksamkeit für Details. Bei Objectivity ist ein UI Developer die designierte Rolle, um sich um die Details im Zusammenhang mit der Benutzeroberfläche zu kümmern.
UI Developer
Lassen Sie uns einen Moment lang erklären, wo genau diese Rolle herkommt. Ein Frontend-Entwickler oder ein Softwareentwickler im Allgemeinen schreibt Code in HTML/CSS, JavaScript/TypeScript und erstellt die entsprechenden Integrationen mit dem Backend (.NET, Java, Datenbanken, externe Dienste).
Das Hauptziel besteht darin, die Geschäftslogik zu implementieren. Die Technologien und Frameworks, die von Softwareentwicklern verwendet werden, entwickeln sich schnell und erfordern ständiges Upskilling (allein im Frontend gibt es Angular, React, Vue, Svelte und viele andere). Wenn man die Feinabstimmung der Benutzeroberfläche zu diesen Aufgaben hinzufügt, wird schnell deutlich, dass dies für eine einzige Rolle zu viel ist. Der Mangel an spezialisierten UI-Entwicklern führt oft zu unzureichender Qualität der Benutzeroberfläche.
"Es gibt einen deutlichen Trend zur Aufteilung von Verantwortlichkeiten in der IT-Welt, einfach weil eine Person nicht alles erledigen kann."
Weronika Sabiniewicz - Community Lead, Teamleiterin Senior Softwareentwicklerin
Man sollte auch bedenken, dass die CSS (Cascading Style Sheet)-Sprache ein Schlüsselelement bei der Gestaltung der visuellen Ebene von Anwendungen ist. Diese Technologie hat den Punkt überschritten, an dem sie als ergänzende Aktivität zu HTML angesehen werden kann.
Mit über 570 Eigenschaften in der Spezifikation ist CSS schwierig zu erlernen. Die Fähigkeiten ergeben sich nicht nur aus dem Wissen über die Syntax, sondern auch aus dem Bewusstsein dafür, wie die Dinge in bestimmten Fällen, Browsern usw. funktionieren. Im MDN Browser Compatibility Report 2020 wurden Layout und Styling als die größten Pain Points für Entwickler genannt.
So gelangen wir an den Punkt, an dem bestimmte Aufgaben von der Rolle des Softwareentwicklers auf die des UI-Entwicklers übertragen werden müssen. Letztendlich bilden diese beiden Rollen eine synergetische Einheit. Um es kurz zu illustrieren - nehmen wir eine Schaltfläche in einer Anwendung: Der UI-Entwickler kümmert sich um das „Look & Feel“, während der Softwareentwickler für die Funktionalität verantwortlich ist und sicherstellt, dass das Klicken der Schaltfläche die richtigen Ergebnisse liefert.
„Indem man die UI-Herausforderungen an jemanden delegiert, der sich auf das Interface-Design spezialisiert hat, können sich die Softwareentwickler auf die Geschäftslogik konzentrieren.“
Rafal Świerkot - Teamleiter, Senior Softwareentwickler
Verantwortlichkeiten
Nach der Einführung der Rolle des UI-Entwicklers bei Objectivity haben sich im Laufe der Zeit die Kompetenzen erweitert. Heutzutage umfassen die Verantwortlichkeiten folgende Tätigkeiten:
- Semantischer HTML-Code: Erstellung einer angemessenen Dokumentenstruktur, Einhaltung der W3C-Standards, Gewährleistung der korrekten Darstellung und Leistung, Optimierung der Ladezeit, Bereitstellung von SEO-freundlicher Markup.
- CSS/SASS-Architektur: Erstellung der CSS-Architektur; von Single Page Applications über native Anwendungen bis hin zu komplexen Services, Umgang mit verschiedenen Technologie-Stacks (SCSS, CSS-in-JS, funktionales CSS) und Methodologien (BEM, OOCSS, CUBE CSS, TailwindCSS usw.).
- UI-Bibliotheken und Frameworks (Bootstrap, Material Design, PrimeNG, Kendo, Chakra UI usw.): Umfassendes Wissen über Bibliotheken und Frameworks, die Fähigkeit, ihre Stärken und Schwächen mit verschiedenen Technologien zu identifizieren.
- Responsive Webdesign (RWD) – Programmierschnittstellen, die auf verschiedenen Geräten (Mobilgeräte, Tablets, Desktops, Laptops, hochauflösende Bildschirme), verschiedenen Internetbrowsern und Betriebssystemen korrekt angezeigt werden. Optimierung für spezifische, individuelle Anforderungen, Implementierung von Progressive Web Applications (PWA).
- Barrierefreiheit – Erstellung digitaler Produkte für Menschen mit Einschränkungen (z. B. visuell oder manuell) gemäß den WCAG-Anforderungen. Zum Beispiel die Erweiterung der Anwendung um ARIA-Attribute, die Pflege der richtigen Dokumentstruktur, Farben, Kontraste, Typografie, Funktionalität interaktiver Elemente (Dropdowns, Tabs, Akkordeons, Datenauswahl), Tastaturbedienung (Vermeidung von Tastaturfallen), Zoom, Implementierung von Visible Fokusindikatoren, Unterstützung unterstützender Tools (Screenreader), Implementierung barrierefreier Alternativen (z. B. Deaktivierung der Animation für bewegungsempfindliche Personen).
- Benutzerdefinierte Komponenten – Änderung vorhandener Komponenten oder Erstellung neuer Komponenten, um den Anforderungen des Kunden gerecht zu werden. Wenn die Anwendung mithilfe bestehender Bibliotheken oder in Low-Code-Technologie (z. B. Mendix, Power Platform) entwickelt wird, ist der UI-Entwickler in der Lage, eine spezifische HTML/CSS-Lösung bereitzustellen, die in die komplexe Architektur des Systems passt.
- Benutzererfahrung – Durch die Arbeit mit einer Reihe von Frameworks ist der UI-Entwickler in der Lage, die richtige Komponente auszuwählen und die richtige Lösung im Hinblick auf die UX zu empfehlen.
- Interaction Design, SVG – flüssige Animationen, Aufmerksamkeit für kleine, aber wichtige Details, die einen enormen Einfluss auf das Nutzungserlebnis der Anwendung haben.
- Design und Entwicklung verbinden – ein erfahrener UI-Entwickler ist das Bindeglied zwischen Design und Entwicklung. Einerseits achten sie darauf, dass die grafische Gestaltung mit größter Sorgfalt in die Anwendung umgesetzt wird. Andererseits garantieren sie, dass der Entwurf umsetzbare Lösungen liefert, die mit der im Projekt verwendeten Bibliothek oder dem Framework kompatibel sind.
„Die Unterstützung des UI-Entwicklers ist oft bereits in der Designphase vorhanden. Der UI-Designer sollte sich bei der Überprüfung von Anforderungen und technischen Einschränkungen immer auf den UI-Entwickler verlassen können. UI-Entwickler können einfache Komponenten oder Lösungen oft selbst liefern.“
Marta Karbowska - Teamleiterin Senior UI Designer
Die Vorteile von UI-Entwicklern in Ihren Projekten
Die Rolle des UI-Entwicklers wurde vor über 10 Jahren bei Objectivity eingeführt. Ihre Verantwortlichkeiten erweitern sich ständig. Nachfolgend finden Sie eine Liste der wichtigsten Vorteile, die diese Rolle in unserer Organisation mit sich bringt.
Gesteigerte Effizienz und Arbeitskomfort
Mit einem UI-Entwickler im Team haben Softwareentwickler die Freiheit, sich auf einen engeren Aufgabenbereich zu konzentrieren. Indem sie sich um Themen wie Responsive Webdesign und Barrierefreiheit kümmern, entlasten UI-Entwickler andere Entwickler und ermöglichen es ihnen, sich um andere Dinge zu kümmern. Die beiden Rollen ergänzen sich gut und arbeiten zusammen, um dem Team einen erhöhten Arbeitskomfort zu bieten.
Beschleunigte Entwicklung
Ein erfahrener UI-Entwickler kann eine robuste und bewährte Komponentenbibliothek identifizieren, die es dem gesamten Projektteam ermöglicht, schneller zu liefern (weniger Fehler bedeuten weniger Tests und weniger Problemlösungen). In komplexen Projekten erleichtert die richtige CSS-Struktur den Entwicklern die Orientierung im Projekt.
„Die Vorteile eines UI-Entwicklers im Team sind zweifellos die Aufteilung der Verantwortlichkeiten und die Beschleunigung der Entwicklung. Wie an einer Produktionslinie geht etwas von einer Hand zur anderen und jeder trägt seinen Wert dazu bei.“
Weronika Sabiniewicz - Community Lead, Team Leader Senior Software Developer
Bessere Anwendungsleistung
Optimal geschriebenes CSS führt zu kürzeren Ladezeiten von Seiten und schnellerer Darstellung von Ansichten, was besonders für mobile Geräte wichtig ist. Immer mehr Aufgaben, die zuvor in JavaScript erledigt wurden, können mit den neuen CSS-Funktionen gelöst werden.
Details bringen eine hervorragende Qualität
Wie am Anfang erwähnt, sind es die Details, die darüber entscheiden, ob ein Benutzer unser Produkt wählt oder es beibehält, wenn eine Alternative auftaucht. Wenn die Verantwortlichkeiten einer Person zu umfangreich sind, ist es leicht, ins Hintertreffen zu geraten, insbesondere in der visuellen Ebene. Wenn Sie mit den Besten konkurrieren möchten, ist es besser, diese Details einer dedizierten Rolle anzuvertrauen.
Wissensaustausch
Bei Objectivity haben wir festgestellt, dass unsere UI-Entwickler häufiger zwischen Projekten wechseln als andere Rollen. Dies erfordert von ihnen eine hohe Organisation und gibt ihnen gleichzeitig einen breiteren Blick auf die Arbeit und die Struktur verschiedener Projektteams. Ein UI-Entwickler kann die Person sein, die bewährte Praktiken in der gesamten Organisation überträgt.
Benutzererfahrung
Normalerweise fällt diese Aufgabe dem UX-Spezialisten zu, aber in den späteren Entwicklungsphasen kann ihre Präsenz manchmal begrenzt sein. Dann liegt die Verantwortung für die Benutzererfahrung beim gesamten Team, aber der UI-Entwickler kann sich in diesem Bereich auszeichnen. Da sie hauptsächlich innerhalb der Benutzeroberfläche arbeiten, haben sie einen Überblick über Lösungen und Muster aus anderen Projekten und Frameworks.
Einhaltung der Standards
Wenn andere Teammitglieder an der Erstellung des HTML/CSS-Codes beteiligt sind, obliegt es dem UI-Entwickler, sicherzustellen, dass er den Standards und Namenskonventionen entspricht, damit er zukünftig einfach gewartet und weiterentwickelt werden kann.
„Jedes größere Projekt wird auf Probleme stoßen, die nicht mit Vorlagen gelöst werden können. Das gilt auch für Mendix-Projekte, obwohl sie bereits weitreichend mit vorgefertigten Lösungen gesättigt sind. Die Denkweise, die beim Arbeiten mit CSS benötigt wird, unterscheidet sich so sehr von der eines Programmierers, dass die meisten Programmierer keine fortgeschrittenen CSS-Probleme lösen können.“
Sergiusz Woźnicki - Team Leader Senior Software Developer
"In meiner Erfahrung ist der UI-Entwickler besser geeignet, das Produkt aus der Sicht des Benutzers zu betrachten. Dies hilft ihnen, die Anwendung benutzerfreundlich, klar und angenehm zu gestalten."
Marek Posyniak - Delivery Manager
Die Zukunft der Rolle des UI-Entwicklers
Die UI-Entwickler bei Objectivity haben eine UI Development Community geschaffen. Es ist ein Ort für Wissensaustausch, zur Meinungsäußerung und zum Austausch von Projekterfahrungen. Für uns ist dies umso wertvoller, da unsere Position in der IT-Branche noch nicht weit verbreitet ist, obwohl sich dies langsam ändert.
Sie können bereits mehrere bevorstehende technische Probleme erkennen, die mit der Beteiligung von UI-Entwicklern viel einfacher zu lösen sein werden:
- Dark Mode Support - eine Funktion, die Energie spart und je nach Umgebung des Benutzers die Belastung für die Augen verringern kann. Dies kann zu einem "obligatorischen" UI-Element werden, ähnlich wie RWD.
- Designsysteme - die Optimierung des Design-Entwicklungsprozesses ist etwas, mit dem sich viele Organisationen derzeit beschäftigen. Dank ihrer einzigartigen Fähigkeiten sind UI-Entwickler gut geeignet, wertvolle Beiträge zu leisten und gute Lösungen für die Implementierung von Designsystemen zu finden.
- CSS-Entwicklung - die Sprache entwickelt sich immer noch weiter, es werden viele neue Funktionen entwickelt. Dieser Fortschritt wird JavaScript von einigen Lösungen entlasten, aber das Erlernen von CSS noch anspruchsvoller machen.
- WCAG Änderungen - mit der bevorstehenden WCAG 2.3 und der Version 3.0 wird es für den traditionellen Softwareentwickler nahezu unmöglich sein, mit allen Anforderungen im Zusammenhang mit Barrierefreiheit Schritt zu halten.
Die kontinuierliche technologische Weiterentwicklung, insbesondere in der IT-Branche, führt zur Entstehung neuer Berufe. Der UI-Entwickler ist ein Beispiel dafür. Sie sollten sich diese Rolle genauer anschauen, wenn Sie möchten, dass Ihr Team Verantwortlichkeiten besser verteilt und Lösungen schneller liefert. Die gelieferten Lösungen werden auch in den Bereichen Benutzeroberfläche, Barrierefreiheit, RWD und anderen zukünftigen benutzerorientierten Anforderungen raffinierter sein.