High_and Design
Friedemann - CSC Weimar
Peer - CSC Lübeck
[28.08.2023]
Intro
Wir wollen euch ein High_and Design
Workshop bieten, wo ihr einen Überblick
erhaschen könnt, was in dem Bereich
alles auf euch zukommt.
“Highend Design” ist heute in jeder
Agentur ein Schlagwort. Es ist die
Endstufe unter den Designs, das
Beste vom Besten.
Übersicht High_and Design I
Verträge & Rechte
Minimale Anforderungen
Kosten
Corporate Design / Identity
Farben
Formen
Schriftarten
Style Guide
Tools
Design Tools
Webtools
Logo
Beispiel
Hinweise zur Erstellung
Webplattformen
Webseite
Social Media
Webformate
Responsive
Übersicht High_and Design II
Social Media
X (ehem. Twitter)
You Tube
Instagram
Twitch & Tik Tok
Discord
Textbearbeitung
Posten
Tools
Toolsammlung
Design Tools
Styleguide
Webtools
Ver- und Bearbeitung
Lagerung
Versenden
Tools / Clouds
Datenverwaltung
Verträge & Rechte
● Minimale Anforderungen
● Datenschutz
● Kostenpunkte
Verträge & Rechte
Verträge ohne eine Rechtsgrundlage sind
zu vermeiden. Niemand weiß, ob man am
Ende eine Webseite für alle oder nur für
die Mitglieder haben darf.
Rechtlich ist alles so unsicher, dass
jeder Kredit oder auch die Einlage von
Mitgliedern gut überlegt sein sollte.
Ebenso ist der Datenschutz für alle
Mitglieder die oberste Priorität. Ohne
schriftliche Zustimmung keine
Datenweitergabe.
Wir sollten abwarten,
bevor wir Gelder
verschwenden.
Logo
● Beispiel
● Hinweise zur Erstellung
Logo
● Erstes Erscheinungsbild des Vereins
● Einfache & prägnante Formsprache
● Verläufe vermeiden
● Erste Farben festlegen
Vorgehen
1. Brainstorming
2. Entwurfsphase
3. Abstimmung
4. Umsetzung
Mit einem Logo fängt
alles an und baut sich
darauf auf.
Corporate Design /
Identity
● Farben
● Formen
● Schriftarten
● Style Guide
Corporate Design / Identity
Farben
● Eigenes Farbschema entwickeln:
○ Max. 2 Hauptfarben
○ Max. 3 Kontrastfarben
○ Verläufe vermeiden (!)
○ Transparenz-Stufen festlegen
Formen
● Klare, einfache Formen
● Eigene/prägnante Formelemente
● Stringente Nutzung
Schriftarten
● Max. 2 Schriftarten, für Logo am besten nur 1
● Auf gute Lesbarkeit achten
Einheitlicher Auftritt
erleichtert das
Wiedererkennen.
Corporate Design / Identity
Style Guide
● Erstellung nach Farbschema der CI
● Schnelle Übersicht / Reminder der
wichtigsten Regeln zur Erstellung von
Dokumenten/Medieninhalten
● Soll einen hohen Wiedererkennungswert
gewährleisten
● Absprache im Verein bei Erstellung
werden beschleunigt
Ein Handbuch zum
Nachschlagen für die
gängigen Formate.
Webplattformen
● Webseite
● Social Media
● Webformate
● Responsive
Webseite
Die Webseite ist die Info-Zentrale für
Mitglieder und alle Anderen. Kontakt-
optionen und Social Media Links sind
als Standard auf jeder Webseite.
Newsletter, Blog und Eventkalender sind
z.B. für eure Webseiten zu empfehlen.
Je nach Funktionsumfang und Vorstel-
lungen beim Design, kann man eine
einfache Vorlage aus HTML oder
Wordpress verwenden.
Budget? Wartung?
Fixkosten? Design?
Schnittstellen?
Social Media
X (ehem. Twitter) & Instagram : Starke
Zielgruppenvertretung in den Kanälen.
You Tube , Twitch & Tik Tok : Sehr
aufwändig den Algorithmus zu gefallen.
Discord : Praktisch als digitales
Vereinsheim und für den schnellen
Austausch.
Facebook : Geringere Reichweite zu
relevanten Zielgruppen. Mind. ein Profil
mit Link zur Webseite sollte man planen.
Mehr Reichweite
erreicht man mit
mehreren Kanälen.
Webformate / Responsiv
Responsiv heißt der Fachbegriff, wenn man
von digitalen Bildgrößen redet. Es muss auf
jedem Endgerät passen und wird
entsprechend davon verarbeitet.
Bildformate wie PNG und JPG sind geläufig,
Sie werden heute in diversen Ausgabe-
größen angezeigt. CMS Wordpress
regelt das bequem und schneidet sogar.
Komprimierung für das Web ist nach
der Bildbearbeitung notwendig.
3 Formate für Smart-
phone, Tablet und PC
sind zu empfehlen.
Tools
● Design Tools
● Webtools
Tools für Design
● Vektordatenbearbeitung -
https://inkscape.org/de/
● Logo Generator -
https://www.logomaker.com/de/
● Adobe Illustrator (auch schon ab CS
brauchbar)
● Collabartions-Software
https://docs.google.com/
Tools fürs Web
Eine Reihe an kostenfreien Tool mach
euch das digitale Surfen angenehmer.
● Content Management System:
Wordpress, Joomla, etc.
● Bildkomprimierung: Tinypng.com
● Textbearbeitung: Google Docs
● Bilderpool: Pixabay, Unsplash
● Bilder-KI, Logo-Generator und viele
praktische Werkzeuge kann man
einfach im Netz suchen.
Gutes Werkzeug bringt
gute Arbeit. Geiles
Werkzeug…
Social Media
● X (ehem. Twitter)
● You Tube
● Instagram
● Twitch
● Tik Tok
● Discord
Social Media
Bei Social Media geht es um regelmäßige
Präsenz, die man im Gleichgewicht
zwischen Aktualität und Spam
halten muss.
Der Infogehalt sollte prägnant und kurz
formuliert werden.
Jeder Kanal hat seine eigenen
Zielgruppen.
Wo, auf welchem
Kanal ist meine
Zielgruppe?
Textbearbeitung
● Wie im Verein angehen?
● Welche Tools nutzen?
Textbearbeitung
Texte braucht man für fast alle die
genannten Bereiche, ob Social Media oder
auch im Flyer.
Es sollten immer Textbearbeitungs-
programme eingesetzt werden und im
besten Fall kann man den Posten im
Verein fest besetzen.
Je nach Zielgruppe empfiehlt sich ein
anderer Schreibstil und Ansprache.
Option über die
Geschäftsordnung:
Texter:in einbauen
Datenverarbeitung
● Ver- & Bearbeitung
● Lagerung
● Versenden
● Tools & Clouds
Datenverarbeitung
Die Datenverarbeitung ist ein allgemeiner
Bereich, um das Projektmanagement in
Gruppen zu erleichtern.
Man sollte sich Konzepte bereit legen,
um Daten zu teilen und auch gemeinsam
zu bearbeiten.
Die Cloud hat jedoch auch Nachteile, z.B.
Datenschutz und Datenverlust sind große
Probleme, die man bedenken muss.
Cloud? Ok, aber ohne
persönliche Daten
deiner Mitglieder.
Toolsammlung
Logo / Style Guide
Vektordatenbearbeitung - https://inkscape.org/de/
Logo Generator - https://www.logomaker.com/de/
Adobe Illustrator (auch schon ab CS2 brauchbar) -
https://www.chip.de/downloads/Photoshop-CS2-kostenlos-Vollve
rsion_59762951.html
Collabartions-Software https://docs.google.com/
Web
Bildquelle - https://pixabay.com/de
Weitere Bildquelle - https://unsplash.com/de
Bildkomprimierung - https://tinypng.com
Textverarbeitung in der Gruppe online - https://docs.google.com
Open Office für offline Arbeiten - https://www.openoffice.org/de/
Wörterzähler - https://xn--zeichenzhler-ncb.de/de/
Cookieprüfung - https://www.ccm19.de/cookie-scanner/
Technische SEO-Prüfung - https://pagespeed.web.dev
Google Klicks sichten - https://search.google.com/search-console/
PDF komprimieren - https://tools.pdf24.org/de/pdf-komprimieren
Passwort Übergabe Tool - https://www.read2burn.com
Tool für Umfragen - https://docs.google.com/forms/
Software für Webseiten - https://de.wordpress.org/download/
Software für Webseiten - https://www.joomla.de
Discord als Kommunikationszentrale - https://discord.com
Canva als Baukastensystem - https://www.canva.com/de_de/
Marktplatz für Design und mehr - https://de.fiverr.com
Quellen
Beschreibung:
https://deutsches-ehrenamt.de/verein-gruenden/die-vereinsgruendung/
Leitfaden, Vorlagen und Muster:
https://www.bmj.de/SharedDocs/Publikationen/DE/Broschueren/Leitfaden_Vereinsrecht.html
Gemeinnützigkeit:
https://www.ehrenamt24.de/wissen-fuer-vereine/vereinswiki/gemeinnuetziger-verein/
Checkliste Gründung:
https://gruenderplattform.de/rechtsformen/verein-gruenden
Vereinsversicherungen:
https://deutsches-ehrenamt.de/vereins-schutzbrief/
Discord CAD Gründungscommunity:
https://discord.csc-gruenden.de
Vielen Dank!
Friedemann - CSC Weimar
Peer - CSC Lübeck
