Visual Designer:in mit Projektmanagement

Der Kurs erläutert die Erstellung von Webseiten mit HTML und CSS, die Umsetzung von User Interfaces und die Analyse der User Experience sowie die Programme Adobe Premiere und Adobe After Effects für eine benutzerfreundliche und visuell ansprechende Erstellung digitaler Produkte. Ergänzend werden die grundlegenden Begriffe des modernen Projektmanagements sowie der Einsatz Künstlicher Intelligenz (KI) im Beruf vermittelt.
  • Abschlussart: Zertifikat „Visual Designer:in”
    Basiszertifikat im Projektmanagement (GPM)® von PM-Zert
  • Zusatzqualifikationen: Zertifikat „Webdesign mit HTML, CSS und Visual Studio Code“
    Zertifikat „UI/UX-Design“
    Zertifikat „Videobearbeitung und Postproduktion mit Adobe Premiere Pro CC und After Effects CC“
  • Abschlussprüfung: Praxisbezogene Projektarbeiten mit Abschlusspräsentationen
    Zertifizierung durch die PM-ZERT, Zertifizierungsstelle der GPM Deutsche Gesellschaft für Projektmanagement e. V.
  • Unterrichtszeiten: Vollzeit
    Montag bis Freitag von 8:30 bis 15:35 Uhr (in Wochen mit Feiertagen von 8:30 bis 17:10 Uhr)
  • Dauer: 20 Wochen

Webdesign (HTML/CSS/Visual Studio Code)

HTML und CSS (ca. 6 Tage)

HTML-Einführung

Grundgerüst

Tags zur Texterstellung (h1-h6, p, br, span)

Text-Format-Befehle

Grafiken einbinden

Verlinkungen (Interne‐, Externe‐, Tel.‐, mailto‐ Link)

Favicons

Listen und Tabellen

Richtiger Syntax Aufbau

Überprüfung durch W3C Validierungstool

CSS-Einführung

Einbindungsmöglichkeiten von CSS-Angaben (intern, extern, inline-Style)

Basisbefehle (Textgestaltung, Schriftfarbe, Hintergrundfarbe)

HTML-Container

Nutzung und Styling von Containern

Integration von YouTube und Google-Maps

Video und Audioplayer

Object-fit


VS Code (ca. 1 Tag)

Einführung in VS Code

Zusätzliche Extensions für VS Code. (z.B. Live Server, Emmet Commands, Copilot (KI))

KI-Nutzung in Kombination mit VS Code


Layout-Techniken (ca. 4 Tage)

Klassen, ID’s, Selektoren

Einführung Box-Modell

padding, margin, border, border-radius und ihre Shorthands

Flex-Box Einführung

Layouts mit Flex-Box

Ausrichtung mit Flexbox

Einführung in Grid System

Layouts mit Grid

Ausrichtung mit Grid System

Bilder mit Text umfließen lassen mit float und clear

Allgemeine display Eigenschaften von Tags

Hintergrundbilder


Status und Wertigkeiten (ca. 1 Tag)

Einführung Pseudoklassen (hover, active, focus, nth-child, first-child, last-child)

Pseudoelemente (::before, ::after, content)

Spezifität (Wertigkeit von Codes)


Positionierung (ca. 2 Tage)

Einführung in Positions

Static, absolute, fixed, sticky, relative

Left, right, top, bottom, z-index

Dropdown Menü’s

:target

:target in kombination mit Navigationsmenüs und modalen


Formulare (ca. 2 Tage)

Einführung in Formulare

fieldset, legend

inputs, textareas, labels, values, name, selects

autocomplete

Formulargestaltung mit CSS

Integration von php-script in action mit KI


Effekte und Schriften mit CSS (ca. 1 Tag)

CSS-Übergangseffekte

transition, filter, transform

Farbverläufe, box-shadow, text-shadow

Schriftintegration mit @font-face


Responsives Webdesign (ca. 2 Tage)

Einführung in responsives Design

Media-Querys, breakpoints

landscape, portait Modus

Responsive Bilder mit picture und srcsets

Bildbearbeitung, Komprimierung von Bildern

Bilder mit KI generieren


Suchmaschinenoptimierung (ca. 1 Tag)

Einführung in die SEO

On-Page Optimierung und Nutzung von KI generierten Texten

Performance Optimierung zur Verbesserung der SEO und Vorstellung passender Tools


CSS-Techniken und Interaktion (ca. 2 Tage)

CSS-Variablen

Dark-Mode

Calculation mit CSS

Einführung in CSS-Animationen

duration, delay, direction, timing-function, iteration-count, fill-mode

Animierter Burger-Button


One-Pager und Multilingualität (ca. 2 Tage)

Einführung One-Pager

Smooth-scroll

Integration fontawesome Bibliothek

Umgang mit SVG-Grafiken

Layer Integration und CSS-Anpassung

Multilinguale Webseiten


Erweiterungen und Frameworks (ca. 1 Tag)

Einführung in Bootstrap

Nutzung von Bootstrap Komponenten

Responsive Design mit Bootstrap


JavaScript (ca. 3 Tage)

Einführung in JavaScript

JavaScript/jQuery Methoden

jQuery Lightbox erstellen

Variablen

If-else Anweisungen

scroll, window, resize

Arrays

for-Schleife

Math-Object


Gesetzliche Vorgaben und Projektmanagement (ca. 2 Tage)

Internetrecht

Urheberrechte in Bezug auf AI/KI

Barrierefreiheit

Projektmanagement


Projektarbeit (ca. 10 Tage)

Zur Vertiefung der gelernten Inhalte

Präsentation der Projektergebnisse

UI/UX-Design

Allgemeine Einführung (ca. 1 Tag)

UX, Usability, UI, Mental Model Guidline, Human factors Guideline 

Prinzipien der nutzerzentrierten Gestaltung

ISO 9241-210/HCD

Barrierefreiheit (Accessibility): Grundbegriffe, rechtliche Vorgaben (BITV, EU-Richtlinien), Bedeutung für UX-Design

Prozess zur Gestaltung gebrauchstauglicher interaktiver Systeme

Arten von KI-Tools im UI-/UX-Kontext (Text, Bild, Analyse)


HCD: Analyse – Nutzungskontext (ca. 2 Tage)

Personae und Empathy Map

Customer Journey

Überblick zu Web Analytics/Fragebogen


HCD: Spezifizieren der Nutzungsanforderung (ca. 1 Tag)

Szenarien, User Stories

Aufgabenmodell, Task Flows

Kontextinterviews und Beobachtung

Tagebuchstudien


HCD: Erzeugen von Gestaltungslösungen um Nutzungsanforderung zu erfüllen (ca. 1 Tag)

Richtlinien und Normen: 7 Dialogprinzipien der ISO 9241-110

10 Prinzipien des User Interface Designs nach Jakob Nielsen

Visuelle Wahrnehmung, Gesetzmäßigkeiten


HCD-Gestaltungslösungen: Taxonomie, Informationsarchitektur und Navigationskonzepte (ca. 3 Tage)

Flow Chart

User Flow

Informationsarchitektur

Micro Informationsarchitektur

Conversion-Strategie

Navigationskonzepte und Sitemap

Card Sorting: Planung, Vorbereitung, Durchführung und Auswertung

Mobile Navigation Patterns (Bootom Navigation, Hamburger Menus, Tabs)


Überblick agiles Projektmanagement (ca. 1 Tag)

Wasserfall-Modell vs. agile Methoden

Einblick in agiles Management nach der Scrum-Methode

Epic, User Story und Task

Design Sprint Methode


HCD-Gestaltungslösungen: User Interface Design (ca. 2 Tage)

Styleguide, UI KITs, Pattern Library und Design System

UI Komponenten/Elemente und Formulare

Farben, Schrift und Typografie im UI, Icons

Barrierfreiheit: Farbkontraste und gut lesbare Schrift, Bedienelemente (Größe, Abstände, Fokus)

Automatisierte Prüfung von Kontrasten, Lesbarkeit und Alternativtexten

Kurzer Überblick über die semantische Struktur (HTML/ARIA)

Atomic Design

Mobile First Design


HCD-Gestaltungslösungen: Entwurfstechniken mit Figma (ca. 3 Tage)

Struktur und Grundlagen: Pages und Frames, Layout Grids, Constraints

Komponenten und Varianten (Buttons, Bibliotheken, Design-Systeme)

Responsives Design (Frames, Auto Layout)

Scribbles, Wireframes, Mockups

Prototyping: Interaktionenm, Transitions, Overlays, Prototyp-Sharing

Nutzung von KI-Funktionen in Figma und ergänzenden Tools zur schnellen Erstellung und Variation von Entwürfen


Usability Testing und Evaluation (ca. 2 Tage)

Überblick über Usability-Testmethoden

Thinking Aloud: Planung, Vorbereitung, Durchführung und Auswertung

Fragebögen  (UEQ, AttrakDiff, VisAWI)

A/B-Testing

Barrierefreiheit: Tests mit Tastatur und Screenreader

Einsatz von Hilfsmitteln und Tools


Projektarbeit (ca. 4 Tage)

Zur Vertiefung der gelernten Inhalte

Präsentation der Projektergebnisse

Videobearbeitung mit Adobe Premiere Pro CC

Adobe Premiere Pro (ca. 7 Tage)

Projektausrichtung und Formatdefinition

Programmoberfläche

Text- und Objektvorlagen

Projekt-, Schnitt- und Monitorfenster

Montage von Clips im Schnittfenster

Überblendungen und Effekte

Video-Retusche und -Filter

Erstellen von Titelsequenzen

Importieren von Bildern, Audiodateien und Verzeichnissen

Kombination mit anderen Adobe-Programmen

Sounderstellung und -bearbeitung

Arbeiten mit Blenden

Farbkorrektur

Motion-Tracking

Import- und Exportfunktionen

Praktische Tipps und Tricks


Künstliche Intelligenz (KI) im Arbeitsprozess

Vorstellung von konkreten KI‐Technologien

sowie Anwendungsmöglichkeiten im beruflichen Umfeld


Projektarbeit (ca. 3 Tage)

Zur Vertiefung der gelernten Inhalte

Präsentation der Projektergebnisse

Postproduktion mit Adobe After Effects CC

Adobe After Effects CC (ca. 7 Tage)

Begriffe und Standards

Formatdefinitionen

Projektplanung und -organisation

Importieren und Verwalten von Rohdaten

Bewegungssteuerung

Arbeiten mit verschiedenen Ebenen

Kompositionen und Zeitleiste

Transfermodi, Schnittfunktionen

Erstellen von einfachen 3D-Animationen

Erstellen von visuellen Effekten

Arbeiten mit Keyframes

Rendering und Render-Einstellungen

Arbeiten mit Masken und Textwerkzeugen

Audiofunktionen und -bearbeitung

Zeitverzerrung

Vektor-Zeichenwerkzeuge und Retusche

Animierte Videoclips

Licht und Kamera, Farbkorrektur

Keying, Motion-Tracking

Import- und Exportfunktionen

Praktische Tipps und Tricks


Projektarbeit (ca. 3 Tage)

Zur Vertiefung der gelernten Inhalte

Präsentation der Projektergebnisse

Projektmanagement

Künstliche Intelligenz (KI) im Projektmanagement (ca. 1 Tag)

Vorstellung von konkreten KI‐Technologien

Empfehlungen für den Umgang mit der KI

Prompting im beruflichen Kontext


Kontext-Kompetenzen (ca. 3 Tage)

Governance, Strukturen und Prozesse

Strategie

Macht und Interessen


Persönliche und soziale Kompetenzen (ca. 1 Tag)

Persönliche Kommunikation


Technische Kompetenzen (ca. 10 Tage)

Projektdesign

Agiles Projektmanagement

Organisation, Information und Dokumentation

Chancen und Risiken

Anforderungen und Ziele

Leistungsumfang und Lieferobjekte

Ablauf und Termine

Stakeholder

Ressourcen

Kosten und Finanzierung

Planung und Steuerung


Projektarbeit, Zertifizierungsvorbereitung und Zertifizierungsprüfung im Projektmanagement (ca. 5 Tage)

Durch die PM-ZERT, Zertifizierungsstelle der GPM Deutsche Gesellschaft für Projektmanagement e. V.



Änderungen möglich. Die Lehrgangsinhalte werden regelmäßig aktualisiert.

Du kennst den kompletten Workflow für ein modernes Webdesign und produzierst benutzerfreundliche und anspruchsvolle Webseiten. Weiter beherrschst du Grundlagenwissen zu den Themen User Interface und User Experience und kennst die entscheidenden Richtlinien und Normen für grafische Benutzeroberflächen, sodass du diese auf ihre Nutzerfreundlichkeit testen und an die Nutzer:innen anpassen kannst. Auch kannst du die professionelle Produktion von digitalem Videomaterial mit Adobe Premiere und Adobe After Effects umsetzen. So beherrschst du verschiedene Techniken, um Konzepte entsprechend grafisch umzusetzen.

Du beherrschst außerdem grundlegende Projektmanagementtechniken und kannst diese anwenden. Das vermittelte, theoretische Wissen in Verbindung mit vielen praktischen Übungen ermöglicht dir, künftige Projekte professionell durchzuführen.

Webdesigner:innen, Webprogrammierer:innen, Grafiker:innen, Mediengestalter:innen, Fachkräfte aus künstlerischen Berufen oder Personen, die bei der Konzipierung, Gestaltung und praktischen Umsetzung von Internet-Auftritten verantwortlich mitwirken und die dafür notwendigen Kenntnisse und Fähigkeiten erwerben wollen.

Die Zusatzqualifikation Projektmanagement eignet sich für Personen aus dem technischen, gestalterischen und/oder dem kaufmännischen bzw. Bürobereich, die mit Planung, Durchführung und Auswertungen von Vorhaben vertraut sind oder eine solche Tätigkeit anstreben.

Nahezu alle Unternehmen setzen heutzutage auf einen attraktiven Internetauftritt, der sie als Unternehmen repräsentiert. Als zukünftige Arbeitgeber:innen kommen vor allem Grafik-, Werbe-, Web-, Multimedia- oder Fullservice-Agenturen, aber auch Software- und Datenbankanbieter in Frage. Kenntnisse im Bereich Webdesign werden in nahezu allen Branchen gefordert. Mit entsprechendem Knowhow ist auch die berufliche Selbstständigkeit eine interessante Perspektive.

Zusätzlich absolvierst du die Prüfung für das international anerkannte Basiszertifikat im Projektmanagement (GPM) ®. Die Zertifizierungsprüfung wird durch die PM-ZERT (Zertifizierungsstelle der GPM Deutsche Gesellschaft für Projektmanagement e. V.) durchgeführt.

Didaktisches Konzept

Deine Dozierenden sind sowohl fachlich als auch didaktisch hoch qualifiziert und werden dich vom ersten bis zum letzten Tag unterrichten (kein Selbstlernsystem).

Du lernst in effektiven Kleingruppen. Die Kurse bestehen in der Regel aus 6 bis 25 Teilnehmenden. Der allgemeine Unterricht wird in allen Kursmodulen durch zahlreiche praxisbezogene Übungen ergänzt. Die Übungsphase ist ein wichtiger Bestandteil des Unterrichts, denn in dieser Zeit verarbeitest du das neu Erlernte und erlangst Sicherheit und Routine in der Anwendung. Im letzten Abschnitt des Lehrgangs findet eine Projektarbeit, eine Fallstudie oder eine Abschlussprüfung statt.

 

Virtueller Klassenraum alfaview®

Der Unterricht findet über die moderne Videotechnik alfaview® statt  - entweder bequem von zu Hause oder bei uns im Bildungszentrum. Über alfaview® kann sich der gesamte Kurs face-to-face sehen, in lippensynchroner Sprachqualität miteinander kommunizieren und an gemeinsamen Projekten arbeiten. Du kannst selbstverständlich auch deine zugeschalteten Trainer:innen jederzeit live sehen, mit diesen sprechen und du wirst während der gesamten Kursdauer von deinen Dozierenden in Echtzeit unterrichtet. Der Unterricht ist kein E-Learning, sondern echter Live-Präsenzunterricht über Videotechnik.

 

Die Lehrgänge bei alfatraining werden von der Agentur für Arbeit gefördert und sind nach der Zulassungsverordnung AZAV zertifiziert. Bei der Einreichung eines Bildungsgutscheines oder eines  Aktivierungs- und Vermittlungsgutscheines werden in der Regel die gesamten Lehrgangskosten von deiner Förderstelle übernommen.
Eine Förderung ist auch über den Europäischen Sozialfonds (ESF), die Deutsche Rentenversicherung (DRV) oder über regionale Förderprogramme möglich. Als Zeitsoldat:in besteht die Möglichkeit, Weiterbildungen über den Berufsförderungsdienst (BFD) zu besuchen. Auch Firmen können ihre Mitarbeiter:innen über eine Förderung der Agentur für Arbeit (Qualifizierungschancengesetz) qualifizieren lassen.

Gerne beraten wir dich kostenfrei.

0800 3456-500 Mo. - Fr. von 8 bis 17 Uhr
kostenfrei aus allen deutschen Netzen.

Kontakt

Gerne beraten wir dich kostenfrei. 0800 3456-500 Mo. - Fr. von 8 bis 17 Uhr kostenfrei aus allen deutschen Netzen.