Ihr Projekt für ein responsives Website-Design ist angelaufen. In diesem Teil des Kurses gehen Sie in die Phase der Ideenentwicklung im Designprozess über. Damit Sie Ideen für Designlösungen finden, führen Sie einen Wettbewerbsaudit sowie die Aktivität „How Might We“ durch und skizzieren Ideen mit „Crazy Eights“. Außerdem erfahren Sie, wie wichtig die Informationsarchitektur und Sitemaps beim Entwerfen von Websites sind.

Nachdem Sie Empathie mit den Nutzenden aufgebaut, das zu lösende Problem der Nutzenden definiert und mit der Entwicklung von Ideen für mögliche Lösungen begonnen haben, ist es an der Zeit, Ihre Ideen in Wireframes zum Leben zu erwecken. Ihre responsive Website wird – abhängig von dem Gerät und der Bildschirmgröße, für die Sie eine Website gestalten – verschiedene Layouts haben, sodass Sie viele verschiedene Wireframes erstellen werden. Zunächst sehen Sie sich gängige Website-Layouts an und erstellen Papier-Wireframes. Als Nächstes lernen Sie einige Elemente und Komponenten kennen, die häufig beim responsiven Webdesign verwendet werden. Anschließend gehen Sie zum Erstellen digitaler Wireframes in Adobe XD über. Und abschließend werden Sie Ihre Wireframes aktualisieren und optimieren, um die Barrierefreiheit zu verbessern.

Nachdem Sie nun digitale Wireframes in Adobe XD erstellt haben, ist es an der Zeit, einen Low-Fidelity-Prototyp zu erstellen, zu testen und zu iterieren. Zuerst lernen Sie, wie Sie in Adobe XD einen Low-Fidelity-Prototyp erstellen. Indem Sie eine Usability-Studie planen und durchführen, holen Sie Feedback zu Ihrem Prototyp ein. Anschließend nehmen Sie basierend auf den Erkenntnissen Ihrer Recherche Änderungen an Ihren Low-Fidelity-Designs vor.

In diesem Teil des Kurses erstellen Sie Modelle Ihrer responsiven Website in Adobe XD. Sie arbeiten auch weiter mit Designsystemen und nutzen Komponenten aus externen Designsystemen für das responsive Webdesign. Anschließend wandeln Sie Ihre Modelle in einen High-Fidelity-Prototyp um, indem Sie Verbindungen erstellen, Interaktionsdetails hinzufügen und die Animationen anpassen. Zuletzt testen Sie Ihren High-Fidelity-Prototyp im Rahmen einer Usability-Studie, um Feedback von unterschiedlichen Nutzenden zu erhalten. Am Ende dieses Kursteils ist Ihr responsives Webdesign fertig!

Wenn Sie mit Ihren responsiven Webdesigns fertig sind, können Sie Ihre Arbeit mit anderen teilen. Zunächst lernen Sie, wie Sie Designs vorbereiten und an das Engineering-Team übergeben, das das Endprodukt erstellt. Außerdem fügen Sie Ihrem professionellen UX-Portfolio eine Fallstudie mit Ihren responsiven Webdesigns hinzu. Anschließend konzentrieren Sie sich auf Ihr übergeordnetes Ziel: einen Job im UX-Design zu finden. Sie erhalten Tipps und Tricks zum Durchsuchen von Stellenausschreibungen und erstellen einen überzeugenden Lebenslauf, in dem Sie ausdrücklich auf Ihre neuen UX-Fähigkeiten hinweisen.