E-Book, Deutsch, 978 Seiten
Reihe: Rheinwerk Design
Rohles / Burkhardt / Wolf Mediengestaltung
2. Auflage 2024
ISBN: 978-3-367-10037-8
Verlag: Rheinwerk
Format: EPUB
Kopierschutz: 0 - No protection
Der Ausbildungsbegleiter
E-Book, Deutsch, 978 Seiten
Reihe: Rheinwerk Design
ISBN: 978-3-367-10037-8
Verlag: Rheinwerk
Format: EPUB
Kopierschutz: 0 - No protection
Autoren/Hrsg.
Weitere Infos & Material
TEIL I Grundwissen Printprodukte ... 29 1. Gestaltungsgrundlagen ... 31 1.1 ... Gestaltgesetze der Wahrnehmung ... 32 1.2 ... Grundelemente der Gestaltung ... 35 1.3 ... Gestaltungsparameter ... 37 2. Typografie ... 43 2.1 ... Grundbegriffe der Typografie ... 43 2.2 ... Wort und Zeile ... 52 2.3 ... Satzarten ... 58 2.4 ... Ziffern und Zahlen ... 60 2.5 ... Geschichte der Schrift ... 62 2.6 ... Schriftklassifikation ... 66 2.7 ... Schriftwahl und Schriftwirkung ... 71 2.8 ... Orthotypografie ... 78 2.9 ... Fonts -- OpenType, TrueType, PostScript, Web ... 80 3. Das Layout ... 83 3.1 ... Seitenformate und Seitenverhältnis ... 83 3.2 ... Satzspiegel ... 87 3.3 ... Gestaltungsraster ... 91 3.4 ... Hilfsmittel für ein gutes Layout ... 94 4. Farbgestaltung ... 99 4.1 ... Grundlagen ... 99 4.2 ... Farbgestaltung ... 105 5. Bildgestaltung ... 113 5.1 ... Die Bildauswahl ... 113 5.2 ... Bildmotive ... 114 5.3 ... Aspekte der Gestaltung von Bildern ... 117 5.4 ... Bilderstellung mit künstlicher Intelligenz ... 125TEIL II Printprodukte konzipieren und gestalten ... 129 6. Technische Grundlagen für Printprodukte ... 131 6.1 ... Daten für den crossmedialen Einsatz vorbereiten ... 131 6.2 ... Eigenschaften von digitalen Bildern ... 132 6.3 ... Farbmodi ... 139 6.4 ... Farbtiefe bzw. Datentiefe ... 145 6.5 ... Dateiformate -- Ein Überblick ... 146 6.6 ... Welche Dateiformate und Farbräume wo einsetzen? ... 151 6.7 ... Bildgröße, Seitenverhältnis und Auflösung korrekt einstellen ... 157 6.8 ... Metadaten von Bildern ... 160 7. Bearbeiten von Bildern und Grafiken ... 165 7.1 ... Analoge Bilder scannen ... 165 7.2 ... Pixeldaten vektorisieren ... 168 7.3 ... Grundlegende Vorgehensweisen bei der Bildbearbeitung ... 169 7.4 ... Werkzeuge für Bildkorrekturen und Optimierungen ... 171 7.5 ... Künstliche Intelligenz bei der Bildverarbeitung ... 185 7.6 ... Bilderverwaltung und Stapelverarbeitung ... 185 8. Der Ablauf eines Designprojekts ... 187 8.1 ... Der Aufbau eines Designprojekts ... 187 8.2 ... Die Phasen eines Designprojekts ... 188 9. Corporate Identity und Corporate Design ... 201 9.1 ... Grundbegriffe ... 201 9.2 ... Corporate Design ... 203 9.3 ... Das Logo ... 205 9.4 ... Corporate Fonts ... 214 9.5 ... Corporate Colors ... 216 9.6 ... Bildsprache ... 218 9.7 ... Gestaltungsraster im Corporate Design ... 221 9.8 ... Corporate-Design-Manual ... 22210. Gestaltungsprojekte ... 225 10.1 ... Geschäftsdrucksachen ... 225 10.2 ... Plakate ... 231 10.3 ... Flyer ... 235 10.4 ... Broschüren ... 237 10.5 ... Buchgestaltung ... 244 10.6 ... Infografik ... 249TEIL III Printprodukte realisieren: Druckvorstufe und Druck ... 25711. Digitale Druckvorstufe ... 259 11.1 ... Das Colormanagement ... 260 11.2 ... Farbräume für Fortgeschrittene ... 264 11.3 ... Sonderfarben ... 271 11.4 ... Separation: bunt oder unbunt? ... 274 11.5 ... Reinzeichnung ... 277 11.6 ... Der Preflight ... 284 11.7 ... PDF ... 28812. In der Druckerei ... 295 12.1 ... Druckdaten proofen ... 295 12.2 ... Druckraster ... 298 12.3 ... Ausschießen ... 304 12.4 ... Druckformerstellung ... 308 12.5 ... Prüfen der Drucke in der Druckerei ... 31013. Der Druck ... 315 13.1 ... Entstehung und Entwicklung des Drucks ... 315 13.2 ... Die verschiedenen Druckverfahren ... 31714. Papier ... 333 14.1 ... Geschichte des Papiers ... 333 14.2 ... Papierherstellung ... 334 14.3 ... Papiereigenschaften ... 337 14.4 ... Papierberechnung ... 343 14.5 ... Papierveredelungen ... 347 14.6 ... Papierwahl ... 350 14.7 ... Andere Bedruckstoffe ... 35115. Druckweiterverarbeitung ... 353 15.1 ... Arten der Weiterverarbeitung ... 353 15.2 ... Schneiden ... 354 15.3 ... Falzen ... 356 15.4 ... Nuten und Rillen ... 359 15.5 ... Einstecken und Zusammentragen ... 360 15.6 ... Binden und Heften ... 362 15.7 ... Produktionsprozess eines Buches im Überblick ... 365 15.8 ... Druckveredelung ... 36716. Nachhaltigkeit im Druck ... 369 16.1 ... Eine nachhaltige Druckerei finden ... 369 16.2 ... Druckfarben und Umweltfreundlichkeit ... 371 16.3 ... Papier und Nachhaltigkeit ... 372 16.4 ... Nachhaltigkeit bei Veredelungen ... 376TEIL IV Grundwissen Digitale Medienprodukte ... 37717. EDV-Grundlagen ... 379 17.1 ... Daten ... 379 17.2 ... Datenbanken ... 385 17.3 ... Datenkompression ... 390 17.4 ... Verschlüsselung ... 39318. Informationstechnik ... 401 18.1 ... Computerhardware ... 401 18.2 ... Betriebssysteme ... 407 18.3 ... Schnittstellen ... 409 18.4 ... Ausgabeeinheiten ... 415 18.5 ... Speichermedien ... 42119. Netzwerke ... 431 19.1 ... Aufgaben von Netzen: ISO/OSI-Referenzmodell ... 431 19.2 ... Grundlegende Eigenschaften von Netzwerken ... 433 19.3 ... Netzwerkkomponenten ... 436 19.4 ... Netzwerktechnologien ... 437 19.5 ... Mobilfunknetze ... 44820. Internet ... 451 20.1 ... TCP/IP ... 451 20.2 ... IP-Routing ... 454 20.3 ... URLs ... 460 20.4 ... DNS ... 461 20.5 ... World Wide Web ... 464 20.6 ... E-Mail ... 466 20.7 ... File Transfer Protocol ... 470 20.8 ... Suchhilfen im Internet ... 47121. Sicherheit von Computern, Daten und Netzwerken ... 475 21.1 ... Malware ... 475 21.2 ... Passwörter ... 479 21.3 ... Spam ... 482 21.4 ... Entwenden von Datensätzen ... 48322. Grundlagen der Programmierung ... 485 22.1 ... Konzepte der Programmierung ... 485 22.2 ... Objektorientierte Programmierung ... 490 22.3 ... Reguläre Ausdrücke ... 49423. Webstandards ... 501 23.1 ... Kerntechnologien ... 501 23.2 ... HTML ... 503 23.3 ... CSS ... 512 23.4 ... JavaScript ... 524 23.5 ... Ajax ... 555 23.6 ... Die Fetch-API ... 55724. Servertechnologien ... 563 24.1 ... XAMPP oder MAMP installieren ... 563 24.2 ... PHP ... 565 24.3 ... Cookies ... 582 24.4 ... Sessions ... 586 24.5 ... Apache-Server-Konfiguration mit .htaccess ... 59325. Datenbanken und Datenpräsentationen ... 597 25.1 ... MySQL und MariaDB ... 597 25.2 ... Datenbank mit phpMyAdmin verwalten ... 599 25.3 ... Syntax von SQL ... 606 25.4 ... Mit PHP auf eine Datenbank zugreifen ... 613 25.5 ... Datenaustauschformate JSON und XML ... 616TEIL V Digitale Medienprodukte konzipieren, gestalten und realisieren ... 62726. Digitale Medienprodukte konzipieren ... 629 26.1 ... Konzeption und Ideengenerierung ... 629 26.2 ... Projektplanung ... 633 26.3 ... Der Designprozess ... 634 26.4 ... Modular gestalten: Designsysteme, Pattern Libraries und Styleguides ... 63727. User Experience von Websites ... 639 27.1 ... Usability und User Experience ... 639 27.2 ... Accessibility ... 645 27.3 ... Nachhaltigkeit ... 648 27.4 ... Informationsarchitektur ... 649 27.5 ... Navigations- und Interaktionsdesign ... 65128. Responsive Webdesign ... 663 28.1 ... Grundlagen ... 664 28.2 ... Meta-Viewport-Element ... 665 28.3 ... Media Queries und Breakpoints ... 665 28.4 ... Mobile First und Desktop First ... 66729. Web-Layout ... 669 29.1 ... CSS Box Model ... 669 29.2 ... Layouttechnologien auf Basis von CSS ... 674 29.3 ... Layout im responsiven Web ... 688 29.4 ... Raster ... 68930. Gestaltung im Web ... 693 30.1 ... Web-Typografie ... 693 30.2 ... Farben im Web ... 700 30.3 ... Bilder ... 705 30.4 ... Tabellen ... 723 30.5 ... Formulare ... 726 30.6 ... Video und Audio ... 732 30.7 ... Animationen ... 73431. Die Bereitstellung von Websites ... 739 31.1 ... Webhosting ... 739 31.2 ... Domain-Registrierung ... 743 31.3 ... Content-Management-Systeme ... 744 31.4 ... Security ... 75132. Entwicklung von Apps ... 755 32.1 ... Einführung in die smarte Welt ... 755 32.2 ... App-Nutzung und -Vermarktung ... 760 32.3 ... Entwicklung von Apps ... 766 32.4 ... User-Interface- und Interaktionsdesign für Apps ... 771 32.5 ... Informationsarchitektur, Navigation und Layout ... 778 32.6 ... User Interfaces auf iOS ... 784 32.7 ... User Interfaces auf Android ... 789 32.8 ... Touch-Bedienung ... 794 32.9 ... Icons für Apps ... 796 32.10 ... Gestaltung von Apps ... 799 32.11 ... Conversational User Interfaces ... 802 32.12 ... Virtual Reality und Augmented Reality ... 80433. E-Books ... 807 33.1 ... Grundlagen und Nutzungsrecht ... 807 33.2 ... E-Book-Formate ... 809 33.3 ... Erstellen von E-Books im ePUB-Format ... 811 33.4 ... Technologie ... 816 33.5 ... Distribution von E-Books ... 81834. Grundlagen der Foto- und Videotechnik ... 823 34.1 ... Fernsehtechnik ... 823 34.2 ... Hintergrundwissen: Videosignale ... 826 34.3 ... Video-Codecs und Videoformate ... 829 34.4 ... Streaming Media ... 833 34.5 ... Tonsysteme und Tonformate ... 835 34.6 ... Kameratechnik für Foto und Video ... 836 34.7 ... Grundlegende Einstellungen ... 844 34.8 ... Erstellen von Videos und Fotos ... 850 34.9 ... Videoschnitt ... 860TEIL VI Marketing, Social Media und Medienrecht ... 86335. Marketing ... 865 35.1 ... Marketing und Mediengestaltung als Dreamteam ... 865 35.2 ... Die vier Entwicklungsstufen des Marketings ... 866 35.3 ... Der Marketingprozess ... 867 35.4 ... Situationsanalyse ... 869 35.5 ... Marketingziele formulieren ... 871 35.6 ... Zielgruppenforschung ... 874 35.7 ... Marketingmaßnahmen ... 877 35.8 ... Marketinginstrumente -- der Marketingmix ... 881 35.9 ... Überwachung und Bewertung mit den Werbewirksamkeitsmodellen ... 88336. Einführung in Social Media ... 887 36.1 ... Bedeutung von Social Media ... 888 36.2 ... Hauptplattformen und ihre Zielgruppen ... 890 36.3 ... Die Content-Erstellung ... 892 36.4 ... Storytelling für Social Media ... 897 36.5 ... Monitoring und Analytics ... 90037. Medienrecht ... 905 37.1 ... Das Urheberrecht als Dreh- und Angelpunkt ... 906 37.2 ... Das Recht am eigenen Bild ... 916 37.3 ... Die zentralen Informationspflichten im World Wide Web ... 919A Anhang ... 927 A.1 ... DIN-Formate (DIN Norm 476) ... 929 A.2 ... Korrekturzeichen nach DIN 16511 ... 930 A.3 ... Tastaturkürzel ... 930 A.4 ... Papierformate und Papierbezeichnung ... 933 A.5 ... Orthotypografie ... 936 A.6 ... Umrechnungstabellen ... 938 A.7 ... Glossar ... 939 Index ... 949 Die Autoren ... 978
1.3 Gestaltungsparameter
In der Mediengestaltung liegen die Aufgaben beim Aufbau einer Gestaltung darin, alle Elemente der Gestaltung so in Beziehung zu setzen, dass sie nicht nur visuellen Ansprüchen genügen, sondern auch inhaltlich verständlich sind. Dabei helfen verschiedene Gestaltungsparameter weiter, die bei der Gewichtung von Aussagen eine große Bedeutung haben. 1.3.1 Spannung durch Anordnung im Format
Intuitiv übertragen wir das physikalische Gesetz der Schwerkraft auch visuell auf die Platzierung von Elementen im Format und haben somit generell ein untrügliches Gefühl dafür, wie Elemente auf einer Fläche wirken: + Wird ein Element im Gestaltungskontext oben angeordnet, wirkt es leicht und aktiv. + Wird es unten angeordnet, wirkt es schwer und passiv. Hierbei spielen Farbe und Form eine zusätzliche Rolle: Dunkle Elemente wirken dabei schwerer als helle Elemente, ein Kreis leichter als ein Quadrat. Für Linien trifft nahezu dasselbe zu wie für Flächen. Eine horizontale Linie wirkt auf uns zum Beispiel genauso statisch wie ein liegendes Rechteck. Abbildung 1.13 Stehen Elemente oben, scheinen sie zu schweben und suggerieren Leichtigkeit und Dynamik, unten platziert wirken sie statisch, schwer, passiv. Dieser Aspekt wird zusätzlich durch Form und Farbe verstärkt oder umgekehrt. Bei jedem Werk visueller Art müssen Sie den optischen Phänomenen Rechnung tragen. Elemente, die in der Mitte stehen sollen, müssen etwas oberhalb der rechnerischen Mitte, also in der optischen Mitte platziert werden, sonst erscheinen sie zu tief. Werden Elemente in die Mitte gesetzt, wirken diese darüber hinaus oft spannungslos. Bewusst außerhalb der Mitte erzeugen sie Spannung zu den Seitenrändern. 1.3.2 Kontrast und Rhythmus
Kontrast und Rhythmus begegnen uns in der Gestaltung immer wieder: sei es der Kontrast zwischen zwei Formen, zwei unterschiedlichen Schriften oder auch der Kontrast zweier Farben. Rhythmus hingegen entsteht durch Gleichheit, zum Beispiel, weil dieselben Gestaltungselemente immer gleich behandelt werden. Zu viel Rhythmus kann allerdings auch langweilig werden. Erst der Kontrast, die Variation der Elemente und das Unerwartete machen ein Layout interessant. Kontraste in Größe, Schriftart, Gewicht, Form, Farbe und Anordnung lassen ein Layout lebendig wirken. Abbildung 1.14 Kontrast in Form zweier unterschiedlicher Schriften, Farbtöne und Schriftschnitte Abbildung 1.15 Der Kontrast zwischen dem großen Bild als Aufhänger dieses Abschnitts und den kleinen Bildern lässt die Seite locker und dynamisch erscheinen. Verstärkt wird dies durch die unterschiedlichen Schriftgrößen. Agentur: deteringdesign, Kunde: Goldbeck In der Gestaltung könnte das wie folgt aussehen: Auf eine Seite mit vielen kleinen Abbildungen folgt eine Doppelseite mit großen Bildern, die als Blickfang auf den Leser wirken. Auf eine Seite mit zwei statischen Kolumnen, die an einer hängenden Linie ausgerichtet sind, folgt eine Seite mit verschobenen Textspalten usw. Dies sorgt nicht nur für einen rhythmischen Wechsel von bedruckter und unbedruckter Fläche, was ein Layout lebendig erscheinen lässt, sondern unterstützt gleichzeitig den Lesefluss. Schriftmischung und Kontrast Ein ausreichender Kontrast ist vor allem bei der Schriftmischung notwendig. Ansonsten würden spezielle Auszeichnungen im Fließtext einfach überlesen werden. 1.3.3 Symmetrie und Asymmetrie
Symmetrie und Asymmetrie sind zwei grundlegende Parameter, die eine Gestaltung oder ein Layout entweder eher statisch oder eher dynamisch wirken lassen. Abbildung 1.16 Beim Satz von Büchern oder Magazinen ist der symmetrische Spiegel die Regel. Symmetrie betont die Mitte und hat weder einen Hang nach links noch nach rechts. Sie vermittelt keinerlei Bewegung, weder zur einen noch zur anderen Seite. Die Wirkung ist zwar ruhig und harmonisch, zugleich aber auch statisch und mitunter langweilig. Die symmetrische Anordnung hat ihren Ursprung in der klassischen Buchtypografie, wo vor allem Buchtitel im Mittel- oder auch Blocksatz gesetzt wurden. Die asymmetrische Anordnung ist flexibler und vermittelt einen lebendigen und dynamischen Eindruck. Die einzelnen Elemente können spielerisch auf der Gestaltungsfläche platziert werden. Der visuelle Schwerpunkt kann dadurch unterschiedlich gesetzt werden. Die variable Anordnung erfordert allerdings eine deutliche Leseführung. Der Leser muss klar erkennen können, welche Elemente zu welchem Zeitpunkt gelesen werden müssen. Dabei können optische Achsen und Gruppierungen als Fixpunkte dienen. Abbildung 1.17 Der asymmetrische Satzspiegel wird vor allem bei experimentelleren Büchern oder Kunstkatalogen verwendet. Er ist hilfreich, wenn Abbildungen über den Falz hinausgehen. Beim asymmetrischen Satzspiegel zu beachten Beim asymmetrischen Satzspiegel ist auf Registerhaltigkeit zu achten beziehungsweise darauf, ein Papier zu wählen, das eine hohe Opazität besitzt. 1.3.4 Blickführung
Während die frühen Griechen (ca. 800 bis 600 v. Chr.) die Schreibrichtung zunächst noch variabel handhabten, ist es in der heutigen westlichen Welt üblich, dass wir primär von links nach rechts und sekundär von oben nach unten schreiben bzw. lesen. So beginnen Printprodukte mit einer rechten Seite, ergo dem Titel, und werden von rechts nach links aufgeblättert. Der Inhalt setzt sich jeweils links, rechts, links usw. fort. Da es bei Fachbüchern oder der reinen Inhaltsvermittlung wenig Sinn machen würde, einen Text auf einem Blatt Papier erst in der Mitte beginnen zu lassen, ist es dort Konvention, dass Inhalte oben links beginnen und unten rechts enden. Daraus folgt für unsere Gestaltung, dass ein Titel in der Regel oben steht und der Absender unten rechts. Das bedeutet nicht, dass jedes Printerzeugnis dieser Faustregel dogmatisch folgen muss. Gerade das Aufbrechen von Sehgewohnheiten lässt den Leser beim Lesen nicht ermüden. Merke: Texte werden zeilenweise von links nach rechts geschrieben bzw. gelesen. Entsprechend werden Inhalte von links oben nach rechts unten erschlossen. Neben dem Wissen über unsere Leserichtung von links nach rechts ist die Platzierung der Gestaltungselemente im Format von großer Bedeutung. Der Blick fällt beim Aufschlagen einer Broschüre zum Beispiel zuerst auf die rechte Seite, es sei denn, die linke Seite ist außergewöhnlich auffällig gestaltet, beispielsweise durch eine fette Überschrift oder ein ins Auge stechendes Bild. (Gesichter wirken zum Beispiel wie ein Aufmerksamkeitsmagnet auf uns, aber auch eine auffallend gesetzte Headline kann das Interesse wecken.) Interessante Personen aus Grafikdesign und Typografie – eine Auswahl Die Liste ist natürlich nicht vollständig! Peter Behrens Eric Gill El Lissitzky Walter Gropius Paul Renner Jan Tschichold Adrian Frutiger Josef Müller-Brockmann Hermann Zapf Otl Aicher Paul Rand Kurt Weidemann Hans Peter Willberg Erik Spiekermann Neville Brody David Carson Stefan Sagmeister Das, was zuerst gelesen werden soll, steht beispielsweise ganz oben, ist am größten abgebildet, durch eine Signalfarbe oder eine außergewöhnliche Positionierung/Ausrichtung gekennzeichnet. Kurz gesagt: Es hebt sich von seinem Umfeld ab; allerdings nur, wenn sich die Elemente bewusst in ihrer Form, Größe, Position etc. unterscheiden, wird diesen auch Beachtung geschenkt. Daher lautet die Devise: Eindeutig gestalten! Bildinhalte beachten Bilder kommunizieren ebenso wie Text eine bestimmte Botschaft, und so wie Text nicht spiegelverkehrt, auf den Kopf gestellt oder in der falschen Reihenfolge abgebildet werden sollte, so verlangen auch Abbildungen nach einer sinngemäßen Darstellung im Layout. Bilder, auf denen...