Monthly Subscription Starting at AED 99 + VAT
- Level Foundation
- Duration 40 hours
-
Offered by
About
„Responsives Web Design in Adobe XD“ ist der sechste Kurs des Zertifikatsprogramms, mit dem Sie die nötigen Fähigkeiten erwerben, um sich für Einstiegspositionen im Bereich User Experience Design (UX-Design) zu bewerben. In diesem Kurs entwerfen Sie mit dem beliebten Designtool Adobe XD eine responsive Website. Sie werden den gesamten Designprozess durchlaufen: sich in die Anwendenden hineinversetzen, ihre Probleme identifizieren, Ideen für Designlösungen finden, Wireframes und Prototypen erstellen, Designs testen und Feedback einholen. Am Ende des Kurses haben Sie ein neues Designprojekt, das Sie in Ihr professionelles UX-Portfolio aufnehmen können. Darüber hinaus lernen Sie, wie Sie nach Einstiegspositionen im Bereich UX-Design suchen, einen Lebenslauf erstellen, der Ihre Fähigkeiten und Leistungen hervorhebt, und Ihre professionelle Portfolio-Website aufbauen. Der Kurs wird von aktuell bei Google tätigen UX-Designschaffenden und UX-Forschenden geleitet. Bei praktischen Aktivitäten werden Sie reale UX-Designszenarien simulieren. Lernende, die die sieben Kurse dieses Zertifikatsprogramms absolvieren, können sich auf Einstiegspositionen im Bereich UX-Design bewerben. Nach Abschluss dieses Kurses können Sie: - Alle Schritte des UX-Designprozesses durchführen (Empathie aufbauen, Fokus definieren, Ideen entwickeln, Prototypen erstellen, Konzepte testen), um eine responsive Website zu erstellen - Designs mit dem beliebten Design-Tool Adobe XD entwickeln - Eine Informationsarchitektur planen und Sitemaps für Website-Designs erstellen - Gängige Layouts für Webseiten umsetzen - Usability-Studien planen und durchführen, um Feedback zu Ihren Designs einzuholen - Designs basierend auf Forschungserkenntnissen iterieren - Mit Designsystemen in Adobe XD arbeiten - Ihrem professionellen UX-Portfolio ein neues Designprojekt hinzufügen - [Optional] Einen UX-fokussierten Lebenslauf erstellen oder aktualisieren - [Optional] Erfahren, wie Sie nach Einstiegspositionen im Bereich UX suchen und sich darauf bewerben Dieser Kurs ist für UX-Designschaffende auf Anfängerniveau geeignet, die die vorherigen fünf Kurse des Google UX Design Certificate abgeschlossen haben. Alternativ müssen Lernende ein solides grundlegendes Verständnis von Designprozessen haben, Erfahrungen in der Erstellung von Wireframes, Modellen und Prototypen sowie Wissen zur Durchführung von Usability-Studien mitbringen. Es sind keine Vorkenntnisse in Adobe XD erforderlich.Modules
Einführung in Kurs 6
-
2
Videos
-
3
Readings
-
1
Quiz
2
Videos
- Einführung in Kurs 6: Responsives Webdesign in Adobe XD
- Dave – Mein Weg zum UX-Design
3
Readings
- Willkommen bei Kurs 6
- Einführung in das zweite Portfolioprojekt
- Zweites Portfolioprojekt auswählen
1
Quiz
- Aktivität: Auswahl für das Portfolioprojekt einreichen
Einführung in Adobe XD
-
5
Videos
-
2
Readings
-
2
Discussion
-
2
Quiz
2
Discussions
- Teilen Sie Ihre Begeisterung über das Erlernen von Adobe XD
- Adobe XD und Figma vergleichen und gegenüberstellen
5
Videos
- Willkommen bei Woche 1
- Responsive Websites verstehen
- Einführung in Adobe XD
- Ein Projekt in Adobe XD beginnen
- Jennifer – Digitale Designtools verwenden
2
Readings
- Erste Schritte mit Adobe XD
- Optional – Erste Schritte mit Figma
2
Quiz
- Testen Sie Ihr Wissen über responsives Webdesign
- Testen Sie Ihr Wissen über die Grundlagen von Adobe XD
Empathie mit Nutzenden aufbauen
-
2
Videos
-
6
Readings
-
2
Discussion
-
3
Quiz
2
Discussions
- Diskutieren, wie wichtig die Berücksichtigung der Bedürfnisse der Nutzenden ist
- Interviewfragen teilen
2
Videos
- Empathie mit Nutzenden aufbauen und ihre Probleme erkennen
- Personas erstellen
6
Readings
- Weitere Informationen über den Aufbau von Empathie mit Nutzenden
- Interviews durchführen, um Empathy Maps zu erstellen
- Empathy Maps erstellen
- Aktivitätsbeispiel: Eine Empathy Map erstellen
- Weitere Informationen über Personas
- Aktivitätsbeispiel: Personas erstellen
3
Quiz
- Testen Sie Ihr Wissen über Empathie mit den Nutzenden
- Aktivität: Eine Empathy Map erstellen
- Aktivität: Personas erstellen
Nutzungsanforderungen definieren
-
2
Videos
-
3
Readings
-
1
Discussion
-
1
Quiz
1
Discussions
- Eine User Story über sich selbst erstellen und teilen
2
Videos
- User Storys erstellen
- Eine User Journey Map erstellen
3
Readings
- Weitere Informationen über User Storys
- Weitere Informationen über User Journey Maps
- Aktivitätsbeispiel: Eine User Story und eine User Journey Map erstellen
1
Quiz
- Aktivität: Eine User Story und eine User Journey Map erstellen
Das Problem definieren
-
1
Videos
-
1
Readings
-
1
Quiz
1
Videos
- Eine Problembeschreibung entwickeln
1
Readings
- Weitere Informationen über Problembeschreibungen
1
Quiz
- Testen Sie Ihr Wissen über Problembeschreibungen
Rückblick auf Woche 1
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Wochen-Challenge 1: Eine Problembeschreibung erstellen
1
Videos
- Zusammenfassung: Den UX-Designprozess beginnen: Empathie aufbauen und Fokus definieren
1
Readings
- Glossar
Einen Wettbewerbsaudit durchführen
-
2
Videos
-
3
Readings
-
2
Quiz
2
Videos
- Willkommen bei Woche 2
- Einen Wettbewerbsaudit durchführen
3
Readings
- Erfahren Sie mehr über Wettbewerbsaudits
- Aktivitätsbeispiel: Einen Wettbewerbsaudit für Ihre Website durchführen
- Erfahren Sie mehr über die Durchführung von Wettbewerbsaudits zur Ideenentwicklung
2
Quiz
- Aktivität: Einen Wettbewerbsaudit für Ihre Website durchführen
- Selbstreflexion: Wettbewerbsorientierte Recherchen zur Verbesserung der Designs nutzen
Ideen für Designs entwickeln
-
2
Videos
-
2
Readings
-
1
Discussion
-
2
Quiz
1
Discussions
- Ihre bevorzugte Technik zur Ideenentwicklung besprechen
2
Videos
- Ideen mit „How Might We“ entwickeln
- Ideen mit „Crazy Eights“ entwickeln
2
Readings
- Erfahren Sie mehr über „How Might We“ und „Crazy Eights“
- Aktivitätsbeispiel: Ideen für Ihre Website entwickeln
2
Quiz
- Testen Sie Ihr Wissen über Techniken zur Ideenentwicklung
- Aktivität: Ideen für Ihre Website entwickeln
Informationsarchitektur planen
-
4
Videos
-
2
Readings
-
1
Discussion
-
1
Quiz
-
1
Plugin
1
Discussions
- Besprechen Sie die von Ihnen verwendeten Website-Strukturen
4
Videos
- Informationsarchitektur planen
- Gängige Website-Strukturen erkunden
- Sitemaps erkunden
- Eine Sitemap für Ihre Website erstellen
2
Readings
- Mehr über Informationsarchitektur erfahren
- Erfahren Sie mehr über das Erstellen einer Sitemap
1
Quiz
- Testen Sie Ihr Wissen zu Website-Strukturen
Rückblick auf Woche 2
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Wochen-Challenge 2: Eine Sitemap für eine Website erstellen
1
Videos
- Zusammenfassung: Den UX-Designprozess fortsetzen: Ideen entwickeln
1
Readings
- Glossar
Papier-Wireframes erstellen
-
3
Videos
-
3
Readings
-
1
Quiz
-
1
Plugin
3
Videos
- Willkommen zu Woche 3
- Gängige Layouts für Website-Startseiten entdecken
- Die Grundlagen von Wireframes
3
Readings
- Erfahren Sie mehr über gängige Website-Layouts
- Erfahren Sie mehr über Wireframes
- Aktivitätsbeispiel: Mit Papier-Wireframes für Ihre Website beginnen
1
Quiz
- Aktivität: Mit Papier-Wireframes für Ihre Website beginnen
Responsive Websites planen
-
2
Videos
-
3
Readings
-
1
Quiz
-
1
Plugin
2
Videos
- Ein responsives Layout grafisch darstellen
- Anpassen von Seitenlayouts basierend auf der Bildschirmgröße
3
Readings
- Erfahren Sie mehr über die grafische Darstellung responsiver Layouts
- Häufige Elemente beim responsiven Design
- Aktivitätsbeispiel: Variationen Ihrer Papier-Wireframes erstellen
1
Quiz
- Aktivität: Variationen Ihrer Papier-Wireframes erstellen
Digitale Wireframes in Adobe XD erstellen
-
4
Videos
-
5
Readings
-
2
Quiz
4
Videos
- Von Papier-Wireframes zu digitalen Wireframes übergehen
- Digitale Wireframes in Adobe XD erstellen
- Wireframes für zusätzliche Bildschirmgrößen in Adobe XD erstellen
- Jay -– Design mit Adobe XD
5
Readings
- Erfahren Sie mehr über das Erstellen digitaler Wireframes in Adobe XD
- Optional – Digitale Wireframes in Figma erstellen
- Aktivitätsbeispiel: Digitale Wireframes für eine Desktop-Bildschirmgröße erstellen
- Optional – Wireframes für zusätzliche Bildschirmgrößen in Figma erstellen
- Aktivitätsbeispiel: Digitale Wireframes für zusätzliche Bildschirmgrößen erstellen
2
Quiz
- Aktivität: Digitale Wireframes für eine Desktop-Bildschirmgröße erstellen
- Aktivität: Digitale Wireframes für zusätzliche Bildschirmgrößen erstellen
Wireframes optimieren
-
2
Videos
-
1
Readings
-
1
Discussion
1
Discussions
- Berücksichtigen Sie bei Ihren Wireframes Überschriften, Orientierungspunkte und zentrale Punkte
2
Videos
- Wireframes optimieren, um die Barrierefreiheit zu verbessern
- Wireframes bewerten mithilfe von Gestaltprinzipien
1
Readings
- Erfahren Sie mehr über die Verwendung von Gestaltprinzipien in Wireframes
Rückblick auf Woche 3
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Wochen-Challenge 3: Wireframes optimieren, um Standards zu erfüllen
1
Videos
- Zusammenfassung: Erstellen von Wireframes für eine responsive Website
1
Readings
- Glossar
Einen Low-Fidelity-Prototyp in Adobe XD erstellen
-
3
Videos
-
4
Readings
-
2
Quiz
3
Videos
- Willkommen bei Woche 4
- Low-Fidelity-Prototypen verstehen
- Einen Low-Fidelity-Prototyp in Adobe XD erstellen
4
Readings
- Mehr über das Erstellen eines Low-Fidelity-Prototyps in Adobe XD erfahren
- Optional – Erstellen Sie einen Low-Fidelity-Prototyp in Figma
- Aktivitätsbeispiel: Einen Low-Fidelity-Prototyp für Ihre responsive Website erstellen
- Low-Fidelity-Prototyp testen
2
Quiz
- Testen Sie Ihr Wissen über Wireframes versus Prototypen
- Aktivität: Einen Low-Fidelity-Prototyp für Ihre responsive Website erstellen
Eine Usability-Studie für einen Low-Fidelity-Prototyp planen und durchführen
-
4
Videos
-
6
Readings
-
1
Discussion
-
4
Quiz
1
Discussions
- Erkenntnisse aus Ihrer Usability-Studie teilen
4
Videos
- Eine UX-Forschungsstudie planen
- Eine Usability-Studie durchführen
- Voreingenommenheiten in einer Usability-Studie reduzieren
- Forschungsergebnisse analysieren und zusammenführen
6
Readings
- Mehr zur Planung einer UX-Forschungsstudie erfahren
- Aktivitätsbeispiel: Eine UX-Forschungsstudie planen
- Mehr zur Durchführung einer Usability-Studie erfahren
- Aktivitätsbeispiel: Usability-Studie für einen Low-Fidelity-Prototyp durchführen
- Mehr über die Analyse und das Zusammenführen von Forschungsergebnissen erfahren
- Aktivitätsbeispiel: Ergebnisse einer Usability-Studie analysieren und zusammenführen
4
Quiz
- Aktivität: Eine UX-Forschungsstudie planen
- Selbstreflexion: Ermitteln, wie Voreingenommenheiten in einer Studie reduziert werden können
- Aktivität: Usability-Studie für einen Low-Fidelity-Prototyp durchführen
- Aktivität: Ergebnisse einer Usability-Studie analysieren und zusammenführen
Designs basierend auf Forschungsergebnissen iterieren
-
1
Videos
-
1
Readings
-
1
Discussion
-
1
Quiz
1
Discussions
- Zeigen Sie, wie Sie Designs basierend auf Forschungserkenntnissen iteriert haben
1
Videos
- Low-Fidelity-Designs basierend auf Forschungsergebnissen iterieren
1
Readings
- Mehr über das Iterieren von Low-Fidelity-Designs erfahren
1
Quiz
- Testen Sie Ihr Wissen über das Modifizieren von Designs basierend auf Forschungsergebnissen
Rückblick auf Woche 4
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Wochen-Challenge 4: Low-Fidelity-Prototypen basierend auf den Erkenntnissen der Usability-Studie anpassen
1
Videos
- Zusammenfassung: Low-Fidelity-Prototypen erstellen und testen
1
Readings
- Glossar
Mit dem Designentwurf für Modelle beginnen
-
2
Videos
-
3
Readings
-
1
Quiz
2
Videos
- Willkommen bei Woche 5
- Mit dem Designentwurf für Modelle beginnen
3
Readings
- Rückblick auf grundlegende Elemente des visuellen Designs
- Rückblick auf das Anordnen von Elementen in Modellen
- Rückblick auf visuelle Designprinzipien
1
Quiz
- Testen Sie Ihr Wissen zu den Grundlagen von Modellen
Modelle für eine Desktop-Website erstellen
-
2
Videos
-
4
Readings
-
2
Quiz
2
Videos
- Mit dem Erstellen von Modellen für die Startseite einer Website in Adobe XD beginnen
- Weitere Modelle für die Startseite einer Website in Adobe XD erstellen
4
Readings
- Optional – mit dem Erstellen von Website-Modellen in Figma beginnen
- Bilder und Logos zu Modellen in Adobe XD hinzufügen
- Wiederholungsraster für den Designprozess in Adobe XD nutzen
- Aktivitätsbeispiel: Modelle für eine Website erstellen
2
Quiz
- Testen Sie Ihr Wissen zum Erstellen einer Homepage in Adobe XD
- Aktivität: Modelle für eine Website erstellen
Modelle für eine mobile Website erstellen
-
1
Videos
-
3
Readings
-
1
Quiz
1
Videos
- Modelle für eine mobile Website in Adobe XD erstellen
3
Readings
- Mehr über ausgeblendete Navigationsmenüs
- Optional – Modelle für eine mobile Website in Figma erstellen
- Aktivitätsbeispiel: Ein Modell für die Startseite einer mobilen Website erstellen
1
Quiz
- Aktivität: Ein Modell für die Startseite einer mobilen Website erstellen
Mit Designsystemen arbeiten
-
2
Videos
-
2
Readings
-
1
Discussion
-
3
Quiz
1
Discussions
- Ihre Lieblings-Designsysteme speichern
2
Videos
- Mit Designsystemen arbeiten
- Externe Designsysteme in Adobe XD verwenden
2
Readings
- Mehr über Designsysteme erfahren
- Optionales Aktivitätsbeispiel: Ein Sticker Sheet in Figma erstellen
3
Quiz
- Testen Sie Ihr Wissen über die Arbeit mit Designsystemen
- Aktivität: Ihre Designentscheidungen dokumentieren
- Optionale Aktivität: Ein Sticker Sheet in Figma erstellen
Einen High-Fidelity-Prototyp entwickeln
-
2
Videos
-
1
Readings
-
1
Discussion
-
1
Quiz
1
Discussions
- Eine Ressource über inklusives und barrierefreies Design teilen
2
Videos
- Einen High-Fidelity-Prototyp in Adobe XD entwickeln
- Anmerkungen zur Barrierefreiheit im Internet machen
1
Readings
- Mehr über Barrierefreiheit im Internet erfahren
1
Quiz
- Testen Sie Ihr Wissen über Barrierefreiheit im Internet
Rückblick auf Woche 5
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Wochen-Challenge 5: Einen High-Fidelity-Prototyp für eine Website erstellen
1
Videos
- Zusammenfassung: High-Fidelity-Designs erstellen und testen
1
Readings
- Glossar
Optional – Ihren High-Fidelity-Prototyp testen
-
1
Videos
-
1
Readings
-
1
Quiz
1
Videos
- Optional – Ihren High-Fidelity-Prototyp testen
1
Readings
- Optional – Rückblick auf das Planen und Durchführen einer Usability-Studie
1
Quiz
- Testen Sie Ihr Wissen zu Best Practices für Usability-Studien
Designs übergeben
-
3
Videos
-
1
Readings
-
1
Quiz
3
Videos
- Willkommen bei Woche 6
- Mit Engineering-Teams zusammenarbeiten
- Designspezifikationen in Adobe XD übergeben
1
Readings
- Online zusammenarbeiten mit Adobe XD
1
Quiz
- Testen Sie Ihr Wissen zur Übergabe von Designs
Ihrem Portfolio ein Projekt hinzufügen
-
1
Videos
-
1
Readings
-
1
Discussion
-
1
Quiz
-
1
PeerReview
1
Peer Review
- Dem Portfolio eine neue Fallstudie hinzufügen
1
Discussions
- Portfolio-Fallstudien mit Website-Designs teilen
1
Videos
- Ihrem Portfolio ein Projekt hinzufügen
1
Readings
- Mehr über Portfolio-Fallstudien erfahren
1
Quiz
- Testen Sie Ihr Wissen zu Portfolio-Fallstudien
Optional – Nach UX-Jobs suchen
-
5
Videos
-
4
Readings
-
3
Quiz
5
Videos
- Gängige Jobs für UX-Designschaffende verstehen
- Arten von Unternehmen kennenlernen, bei denen UX-Designschaffende arbeiten
- Kenny – Durchhaltevermögen
- Herausfinden, wo Sie sich für Jobs im Bereich UX-Design bewerben können
- Stellenbeschreibungen nach Schlüsselwörtern durchsuchen
4
Readings
- Mehr über Jobs im Bereich User Experience erfahren
- Beschäftigungsmöglichkeiten im Bereich UX-Design entdecken
- Aktivitätsbeispiel: Mit einem Tracker nach UX-Jobs suchen
- Aktivitätsbeispiel: Schlüsselwörter und Anforderungen in Stellenbeschreibungen hervorheben
3
Quiz
- Selbstreflexion: Ihre beruflichen Ziele und Interessen formulieren
- Aktivität: Mit einem Tracker nach UX-Jobs suchen
- Aktivität: Schlüsselwörter und Anforderungen in Stellenbeschreibungen hervorheben
Optional – Einen Lebenslauf für die UX-Design-Branche erstellen
-
4
Videos
-
2
Readings
-
2
Quiz
4
Videos
- Lebensläufe für die UX-Design-Branche verstehen
- Dane – Meine Tipps für Lebensläufe im Bereich UX-Design
- Tim – Tipps eines Personalvermittelnden für Lebensläufe im Bereich UX-Design
- Einen Lebenslauf ausgehend von Stellenbeschreibungen aktualisieren
2
Readings
- Elemente eines typischen Lebenslaufs für die UX-Design-Branche
- Aktivitätsbeispiel: Einen Lebenslauf für die UX-Design-Branche entwerfen
2
Quiz
- Selbstreflexion: Überlegen Sie, welche Informationen Sie in Ihren Lebenslauf aufnehmen sollten
- Aktivität: Einen Lebenslauf für die UX-Design-Branche entwerfen
Rückblick auf Woche 6
-
1
Videos
-
1
Readings
-
1
Quiz
1
Videos
- Zusammenfassung: Designarbeit dokumentieren und auf Jobsuche gehen
1
Readings
- Glossar
1
Quiz
- Wochen-Challenge 6: Designarbeit dokumentieren und auf Jobsuche gehen
Kursrückblick
-
1
Videos
-
1
Readings
-
1
Discussion
1
Discussions
- Teilen Sie Ihre Kurserfahrung
1
Videos
- Herzlichen Glückwunsch zum Abschluss von Kurs 6: Responsives Webdesign in Adobe XD
1
Readings
- Den nächsten Kurs starten
Auto Summary
Join "Responsive Web Design in Adobe XD" on Coursera, led by Google UX experts. This foundational course is ideal for aspiring UX designers, guiding you through the entire UX design process using Adobe XD, from empathy to prototype creation. Perfect for beginners with basic design knowledge, it helps you build a professional UX portfolio and prepare for entry-level UX roles. Access through Starter or Professional subscriptions.