Unsere Wall of Fame

Wie HeiReS digitale Publikationen inklusiv, effizient und zukunftssicher gestaltet

Die Herausforderung

Digitale Publikationen wie eBooks sind ein zentraler Bestandteil der Kommunikation und Wissensvermittlung bei HeiReS. Doch Barrierefreiheit in eBooks ist alles andere als trivial, sie hängt stark vom gewählten Format ab, erfordert technisches Wissen, saubere Strukturen und konsequente Qualitätskontrollen.

Hinzu kam: Die Anforderungen an barrierefreie Dokumente unterscheiden sich deutlich von klassischen Layoutprozessen. Fehlende semantische Struktur, unbeschriftete Grafiken oder falsch exportierte Inhalte führen schnell dazu, dass wichtige Informationen für Screenreader unzugänglich werden.

HeiReS stellte sich dieser Herausforderung mit dem Ziel, eigene eBooks professionell, normgerecht und mit reproduzierbarem Workflow barrierefrei zu gestalten, als Kompetenzbeweis und als praktischen Beitrag zu mehr digitaler Inklusion.

Die Lösung

Klare Formatstrategie

Problem: Barrierefreiheit hängt stark vom Dateiformat ab.
Lösung: HeiReS legte sich bewusst auf PDF und EPUB 3 als Hauptformate fest. Beide Formate sind international anerkannte Standards für barrierefreie digitale Publikationen. Damit war der Rahmen für ein zukunftssicheres und lesefreundliches Publishing gesetzt.

Wissen gezielt aufbauen

Problem: Es fehlte zunächst an praktischem Know-how, wie barrierefreie eBooks tatsächlich erstellt werden.
Lösung: Von Grundlagen der PDF/UA-Norm bis zur semantischen EPUB-Struktur, eignete sich das Team durch systematisches Lernen das nötige Wissen an. Interne Workshops, Fachliteratur und intensives Ausprobieren mit Tools wie InDesign, Acrobat und Calibre führten zu einem fundierten Verständnis.

Struktur von Anfang an mitdenken

Problem: Eine saubere Dokumentstruktur entsteht nicht automatisch.
Lösung: Bereits beim Erstellen der Inhalte in z. B. Microsoft Word wurde auf eine klare Überschriftenhierarchie, saubere Absatzformate, Listen, Tabellen und Alternativtexte geachtet. Diese Vorarbeit bildet heute das Fundament jedes barrierefreien Dokuments.

Alternativtexte für visuelle Inhalte

Problem: Bilder, Grafiken und Diagramme sind oft zentral, aber ohne Beschreibung nicht zugänglich.
Lösung: Für alle informativen visuellen Elemente wurden sinnvolle Alternativtexte formuliert, diese sind prägnant, beschreibend und inhaltlich relevant. Dabei wurde genau unterschieden zwischen informativen, dekorativen und funktionalen Bildern.

Prüfprozess professionalisieren

Problem: Barrierefreiheit lässt sich nicht allein automatisiert prüfen, Screenreader-Tests sind aber aufwendig.
Lösung: HeiReS entwickelte eigene Checklisten und kombinierte automatisierte Prüfverfahren (PAC 2024, Ace by DAISY) mit manuellen Screenreader-Tests (NVDA, VoiceOver). Dadurch entstand ein hybrider Testprozess mit hoher Zuverlässigkeit.

Frühzeitige Integration in den Workflow

Problem: Nachbesserungen am Ende des Prozesses sind teuer und ineffizient.
Lösung: Barrierefreiheit wurde von Beginn an in den Workflow integriert. Angefangen beim Schreiben über das Layouten und Strukturieren. So wurde sie Teil des kreativen Prozesses, nicht nur ein nachträgliches Korrekturziel.

Der Weg dorthin

Der Weg zur barrierefreien eBook-Produktion bei HeiReS war ein Lern- und Entwicklungsprozess, der Schritt für Schritt professionalisiert wurde.

Schritt 1: Vorbereitung der Inhalte

Bevor Layout oder Design beginnen, werden alle Inhalte in Programmen wie Microsoft Word so gut wie möglich vorbereitet, dass sie bereits semantisch strukturiert sind:

• konsistente Überschriftenhierarchie (H1–H3)
• Listen und Tabellen mit korrekter Formatierung
• sinnvolle Alternativtexte für Bilder
• Vermeidung leerer Absätze oder überflüssiger Formatierungen

Diese Vorbereitung erleichtert später nicht nur den Export nach InDesign, sondern sichert die logische Lesereihenfolge und maschinenlesbare Struktur von Anfang an.

Schritt 2: In der Layoutphase trifft Gestaltung auf Struktur

In Adobe InDesign wird das Layout professionell aufgebaut. Hier achtet HeiReS auf:

• konsequente Verwendung von Absatz- und Zeichenformaten
• keine rein visuellen Hervorhebungen ohne semantische Bedeutung
• klare, kontrastreiche Gestaltung und gute Lesbarkeit
• Verwendung des InDesign-Tagging-Features, um Barrierefreiheitsinformationen beim Export zu erhalten

Das Ziel: ein attraktives, aber technisch sauberes Layout.

Schritt 3: Die Grundlage für Barrierefreiheit liegt im Export

Schon beim Export aus InDesign wird die Barrierefreiheit aktiv mitgedacht:

• Tags aktivieren, um Strukturen in PDF oder EPUB zu übernehmen
• Lesereihenfolge prüfen
• Alternativtexte übernehmen
• Metadaten (Titel, Sprache) korrekt eintragen

So entstehen PDFs und EPUBs, die bereits zu großen Teilen barrierefrei sind.

Schritt 4: Nachbereitung in Acrobat Pro und Calibre

In der Nachbearbeitung werden Details überprüft und korrigiert:

• Kontrolle der Tags und Lesereihenfolge
• Überprüfung der Überschriftenhierarchie
• Korrektur oder Ergänzung fehlender Alternativtexte
• Navigationselemente (Inhaltsverzeichnis, Sprungmarken) anpassen
• Entfernen überflüssiger oder redundanter Tags

Durch Calibre wird das EPUB 3 zusätzlich technisch validiert und an Reader-Anforderungen angepasst.

Schritt 5: Automatisiertes Testen

Mit Tools wie PAC 2024 (für PDF/UA) und Ace by DAISY (für EPUB 3) prüft HeiReS automatisch:

• Struktur-Tags
• Alternativtexte
• Kontraste und Farbdefinitionen
• Metadaten und Sprachangaben
• Einhaltung der relevanten Normen

Diese Tools liefern reproduzierbare Prüfberichte als Grundlage für interne Qualitätssicherung.

Schritt 6: Manuelles Testen

Zum Abschluss folgt die manuelle Kontrolle mit Screenreadern wie NVDA (Windows) und VoiceOver (macOS). Dabei wird überprüft:

• Ist die Lesereihenfolge nachvollziehbar?
• Werden Überschriften korrekt angesagt?
• Funktionieren Links und Inhaltsverzeichnisse?
• Sind Bilder und Diagramme sinnvoll beschrieben?

Erst wenn die Dokumente auch in der realen Nutzung überzeugen, gelten sie als barrierefrei.

Der Nutzen für HeiReS

• Rechtssicherheit durch Einhaltung der PDF/UA- und EPUB-Standards
• Positive Außendarstellung als glaubwürdige Expertin für digitale Inklusion
• IAAP-Mitgliedschaft unterstreicht Fachkompetenz im Bereich Barrierefreiheit
• Mehr Schulungen und Projekte durch die wachsende Nachfrage nach Expertise
• Größere Reichweite dank barrierefreier Publikationen für alle Zielgruppen
• Höhere Effizienz und Qualität im internen Publishing-Prozess
• Wettbewerbsvorteil durch gelebte Inklusion und Nachhaltigkeit

HeiReS hat es geschafft, Barrierefreiheit im eBook-Bereich systematisch, praxisnah und mit messbarem Erfolg umzusetzen.
Durch kluge Workflows, fundiertes Wissen und den Mut zum Lernen entstand ein Prozess, der sowohl effizient als auch vorbildlich ist und der zeigt, wie digitale Inklusion auch im Publishing alltagstauglich funktioniert.

Jahr: 2021-25

Leistungen:

• Technisches Konzept
• Vorbereitung der Inhalte
• Gestaltung und Struktur
• Barrierefreie Erstellung
• Automatisiertes und manuelles Testen

Brache: Verlag

Verwendete Technologie:

• Microsoft Word
• Indesign
• Photoshop
• Acrobat Pro
• Ace by Daisy
• PAC 2024
• NVDA/VoiceOver

Die HeiReS WordPress-Webseite wurde hin zu Barrierefreiheit überarbeitet

Die Herausforderung

Die Webseite der HeiReS GmbH besteht seit über 13 Jahren und ist mit dem Unternehmen gewachsen, komplex in Struktur und Design, tief verwurzelt in WordPress. Ursprünglich stand Barrierefreiheit dabei nicht im Fokus. Mit wachsendem Bewusstsein war bald klar: Ein einfaches „nebenher barrierefrei“ reicht nicht aus.

Doch wie setzt ein kleines Unternehmen mit weniger als zehn Mitarbeitenden eine rundum barrierefreie Webseite um, ohne das Projekt finanziell oder personell zu überfrachten?

HeiReS stellte sich der Herausforderung mit begrenzten Ressourcen ein funktionierendes, modernes und barrierefreies digitales Schaufenster zu schaffen.

Die Lösung

Priorisierung statt Perfektion

Statt Barrierefreiheit als Zusatz zu behandeln, wurde sie zum Leitmotiv des Relaunchs. Der Fokus lag auf dem Machbaren also niederschwellige Maßnahmen, die große Wirkung zeigen. So konnten trotz geringer Honorarstunden wichtige Verbesserungen erzielt werden.

Konflikte mit CI & Design auflösen

Die bestehende Gestaltung kollidierte an vielen Stellen mit den Anforderungen an Kontrast, Lesbarkeit und Benutzerführung. Durch ein gezieltes Redesign, inkl. Anpassung des Farbsets, neuer barrierefreier Typografie und klareren visuellen Elementen entstand ein inklusives, modernes Design, das weiterhin zum Markenbild passte.

Technik pragmatisch neu gedacht

Technische Barrieren wie nicht tastaturbedienbare Slider oder ein unzugänglicher Cookie-Dialog wurden systematisch identifiziert und ausgetauscht. Viel Eigenrecherche, gezielte Eingriffe ins Theme und CSS sowie eine klare Trennung dekorativer und funktionaler Inhalte machten die Seite strukturell robust und zugänglich.

Bestehendes nutzen

Statt die gesamte Website neu zu bauen, wurden vorhandene Inhalte intelligent überarbeitet: Alt-Texte ergänzt, Überschriftenhierarchien korrigiert, dekorative Bilder ausgeblendet. Frühzeitige BITV-Audits (bereits 2021) lieferten eine belastbare Grundlage, die konsequent weiterentwickelt wurde.

Verantwortung anerkennen

Als Unternehmen mit Online-Shop erkannte HeiReS die rechtliche Verpflichtung zur Barrierefreiheit an und setzte auf Transparenz statt Ausreden. Die Barrierefreiheitserklärung wurde regelmäßig aktualisiert und kommuniziert.

Der Weg dorthin

Früher strategischer Schritt: Wechsel auf ein barrierefreies WordPress-Theme

Bereits ganz zu Beginn des Prozesses wurde entschieden, das bisherige, in die Jahre gekommene Theme gegen ein moderneres, barrierefreieres WordPress-Theme auszutauschen. Dieser Schritt schuf die notwendige technische Grundlage und war ein entscheidender Hebel für die spätere Barrierefreiheit, um viele spätere Anpassungen überhaupt sinnvoll umsetzen zu können.
Das neue Theme ermöglichte:

• bessere Kontrolle über Schriftgrößen und Kontraste
• strukturierteren HTML-Code
• verbesserten Umgang mit Tastatursteuerung und Screenreadern

BITV-Tests als Wegweiser

Die erste Überprüfung im August 2021 zeigte deutliche Defizite: 30 von 92 Prüfkriterien wurden nicht erfüllt. Zu den größten Problemen zählten fehlende Alt-Texte, zu niedrige Kontraste, eine fehlerhafte Überschriftenstruktur und nicht tastaturbedienbare Komponenten. Drei weitere Tests folgten, der Letzte am 28. Juni 2025 mit 98 Kriterien. Von diesen Kriterien sind 17 noch nicht ganz erfüllt, aber das meiste sind tatsächlich nur noch Kleinigkeiten, sodass man mit Fug und Recht behaupten kann, dass diese Website weitgehend vereinbar mit der BITV 2.0 ist.

Schlüsse: Technische Komponenten mussten überarbeitet, das Layout barrierefrei gestaltet und Inhalte strukturell optimiert werden.

Re-Design mit Inklusion im Blick

• Farbkontraste verbessert: Die Hauptfarbe Orange wurde von einem Kontrastverhältnis von 2.8:1 auf 3:1 optimiert.
• Typografie überarbeitet: Ein neues, gut lesbares Schriftsystem wurde entwickelt.
• Links werden konsequent unterstrichen.
• Bedienelemente wurden vergrößert und farblich klarer abgegrenzt.

Technische Anpassungen im Theme

• Schriftgrößen und Farbwerte wurden global barrierefrei angepasst.
• CSS wurde gezielt genutzt, um visuelle Probleme zu beheben, die das Theme verursachte.

Funktionale Verbesserungen

• Austausch des Cookie-Dialogs durch eine tastaturbedienbare Alternative.
• Der Slider und weitere Elemente wurden ersetzt oder barrierefrei gestaltet.
• Die Seitenstruktur wurde überarbeitet (z. B. sinnvolle Überschriftenhierarchie, Alt-Texte ergänzt).
• Dekorative Elemente wurden aus dem Accessibility Tree entfernt, um Screenreader nicht zu stören.

Erklärung zur Barrierefreiheit

Die Erklärung wurde sorgfältig erstellt und aktualisiert:

• Dokumentation der BITV-Tests (inkl. Datum, Ergebnis, Nicht-Erfüllungen)
• Auflistung nicht barrierefreier Inhalte
• Möglichkeit zur Barriere-Meldung über ein Formular
• Letzter Stand: 28.06.2025

Der Nutzen für HeiReS

• Rechtssicherheit durch klare Nachweise der Barrierefreiheit
• Verbesserte Sichtbarkeit durch bessere Suchmaschinenplatzierung
• Positive Außendarstellung als Vorreiterin digitaler Inklusion
• IAAP-Mitgliedschaft untermauert Kompetenz im Thema
• Neue Schulungen & Kundenprojekte durch Expertise-Zuwachs
• Mehr Zugriffe und bessere Nutzung der Website durch eine größere Zielgruppe

Zusammengefasst

Die barrierefreie WordPress-Webseite von HeiReS zeigt eindrucksvoll: Auch kleine Unternehmen mit begrenzten Mitteln können Barrierefreiheit ernst nehmen und damit rechtliche, technische und gesellschaftliche Vorteile verbinden. Entscheidend sind der Wille, klare Prioritäten und der Mut zur Veränderung.

Jahr: 2021-25

Leistungen:

• Technisches Konzept
• UI-ReDesign
• Umsetzung in WordPress
• BITV-Test
• Erklärung zur Barrierefreiheit

Brache: IT

Verwendete Technologie:

• WordPress
• Figma
• Illustrator

Am 28. Juni 2025 tritt das Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft – ein Meilenstein für digitale Teilhabe. In unserem offenen Online-Event von 11:00 bis 14:00 Uhr erfahren Sie, was das Gesetz für Sie bedeutet und wie Sie Barrierefreiheit gewinnbringend umsetzen. Unsere Expert:innen geben konkrete Einblicke, praktische Tipps und beantworten Ihre Fragen live. >>> Jetzt Anmelden!

Wer sollte teilnehmen?

• Unternehmen & Entscheidungsträger, die rechtlich zum BFSG verantwortlich sind
• Fachkräfte aus UX, Design & Entwicklung, die Barrierefreiheit praktisch umsetzen
• Beauftragte für Barrierefreiheit in Unternehmen, Organisationen und Behörden
• Menschen, die eine eigene Webseite betreiben und Produkte oder Leistungen verkaufen
• Personen, die sich beruflich weiterbilden möchten zu Barrierefreiheit
• Alle, die sich für das Thema interessieren, auch ohne beruflichen Hintergrund

Warum teilnehmen?

• Rechtliche Klarheit: Verstehen, was das BFSG konkret verlangt
• Wettbewerbsvorteile nutzen: Barrierefreiheit als Chance
• Von Best Practices lernen: Erfolgreiche Umsetzungsbeispiele
• Technisches Know-how stärken: Tools, Tipps & Strategien
• Direkt fragen: Live-Q&A mit Expert:innen
• Zeichen setzen: Für mehr digitale Inklusion

Die Agenda am 28. Juni 2025

11:00 – 11:30 Uhr Begrüßung und Dialog zu Ihren Herausforderungen 11:30 – 12:15 Uhr Das BFSG und schnelle Maßnahmen 12:30 – 13:15 Uhr Behinderungen verstehen und Barrieren abbauen 13:15 – 14:00 Uhr Unsere Webseite wird barrierefrei nach BFSG 

Mit dabei:

 Peggy Reuter-Heinrich Gesellschafter-Geschäftsführerin HeiReS® Gründerin und Geschäftsführerin im Ehrenamt IT hilft gGmbH Führende Expertin für digitale Barrierefreiheit Armin Reuter Projektleiter, Usability Engineer Experte für barrierefreie Web-Technologien Theresa Wenk UI-Designerin, HTML-Expertin Erfahrene BITV-Testerin und Umsetzerin

Veranstalter:

• Heinrich & Reuter Solutions GmbH (Mitglied im IAAP – International Association of Accessibility Professionals)
• gemeinnützige IT hilft gGmbH

Kostenlose Teilnahme:

Sie melden sich mit einem Formular an und bekommen das KI-Magazin als PDF per E-Mail. In der E-Mail ist auch der Zoom-Link für das Event.

Sponsor-Ticket(9,50 €):

Wenn Sie unser Event unterstützen wollen, nutzen Sie gerne auch das Sponsor-Ticket. Sie erhalten dann  zudem eine Aufzeichnung, sowie die PDFs der Präsentation und unseres Magazins „Barrierefreiheit und KI“.

VIP-Ticket (49,00 €):

Sie bekommen alle Fachmagazine als PDF, ein Fachbuch per Post, Unterstützung bei Ihren Fragen während des Events und eine 30-minütige 1:1-Beratung nach dem Event.  >>> Jetzt Anmelden!

Re-Design und WordPress-Umsetzung der Webseite eines Vereins

Die Herausforderung:
Gewünscht war die Umgestaltung und das Neuaufsetzen der bestehenden Webseite mit Verbesserung der Strukturen und Inhalte. Ziel ist dabei eine vereinfachte Bedienung und gute Zugänglichkeit. Hauptziel ist die Aktivierung von Bestandsmitgliedern und die Gewinnung von neuen.

Der Nutzen für den Kunden:
Die optimierte Navigation und klaren Strukturen ermöglichen es den Besuchern, sich leichter und schneller zurechtzufinden. Dies reduziert die Absprungrate und erhöht die Verweildauer auf Ihrer Webseite. Eine gut zugängliche Webseite stellt sicher, dass alle Besucher, unabhängig von ihren technischen Fähigkeiten oder eventuellen Einschränkungen, problemlos auf die Inhalte zugreifen können. Dies fördert ein inklusives Nutzererlebnis und erweitert die potenzielle Zielgruppe. Durch die ansprechende Gestaltung und die gezielte Ansprache werden bestehende Mitglieder motiviert, häufiger die Webseite zu besuchen und aktiv zu nutzen. Dies stärkt die Bindung und das Engagement innerhalb der Community. Eine moderne und professionelle Webseite hinterlässt einen positiven ersten Eindruck bei potenziell neuen Mitgliedern. Dies erhöht die Wahrscheinlichkeit, dass Interessenten zu Mitgliedern werden, und unterstützt Wachstumsziele.

Der Weg dorthin:
Angefangen haben wir bei der Sichtung der bestehenden Webseiten und deren verwendeter Technologie. Anschließend erstellten wir ein Konzept zur Verbesserung der technischen Umsetzung. Wir haben die Informationen der Webseite sortiert und neu strukturiert. Das Design kam direkt danach und ist über alle Seiten nachhaltig wiederverwendbar. Anschließend haben wir ein passendes WordPress-Theme überarbeitet, mit dem wir das Projekt umgesetzt haben. In eine intensiven Worpress-Schulung haben wir den Kunden geschult selbst Inhalte in die Seite einzupflegen und so die Seite aktuell halten zu können.

Jahr: 2024

Leistung:

• Technisches Konzept
• UI-Design
• Technisches in WordPress
• Umsetzung in WordPress
• Überführung der Inhalte
• WordPress-Schulung

Branche: Wirtschaft

Verwendete Technologie:

• WordPress
• Figma
• Midjourney
• Adobe Photoshop

Cover-Design und Buchsatz für das Buch „Narzisstische Eltern“ von Daniela Kreissig als gedruckte und digitale Version

Die Herausforderung:
Das Buch „Narzisstische Eltern“ von Daniela Kreissig geschrieben, soll verlegt und verkauft werden, mit allem was an Gestaltung, Drucklegung etc. dazu gehört.

Der Nutzen für den Kunden:
Das attraktives und hochwertig gestaltetes Cover zieht Blicke auf sich und hebt das Buch aus der Masse hervor. Es vermittelt Professionalität und Qualität, was das Vertrauen der Leser stärkt. Die Einzigartigkeit des Covers unterstützt die persönliche Marke des Autors und kann bei zukünftigen Publikationen einen Wiedererkennungswert schaffen. Der gut gestaltete Buchsatz sorgt dafür, dass das Buch nicht nur gut aussieht, sondern auch leicht zu lesen ist. Ein barrierefreies PDF stellt sicher, dass das Buch für alle Leser zugänglich ist, einschließlich Menschen mit Behinderungen. So wird das Buch einer breiten Öffentlichkeit zugänglich und bekannt gemacht.

Der Weg dorthin:
Für das Cover-Design haben wir 3 verschiedene Vorschläge gestaltet. Darauf hin haben wir uns mit dem Kunden auf einen Entwurf geeinigt, diesen dann überarbeitet und als fertiges Cover ausgestaltet. Der Buchinnenteil wurde in Word auf Barrierefreiheit vorbereitet. Anschließend nutzten wir diesen in InDesign, um das Layout zu setzen. Auch hier haben wir weiter an der Barrierefreiheit des fertigen Dokumentes gearbeitet. So setzten wir zum Beispiel Alternativtexte auf Bilder oder kennzeichneten reine Layout-Elemente als Artifakte damit der Screenreader sie anschließend nicht vorliest. Dann wurden Druckdatei und PDF erstellt. Anschließend wurde das PDF mit PAC3 und Adobe Acrobat Pro als barrierefrei verifiziert.

Hier können Sie noch mehr über Daniela und das Buch erfahren.

Jahr: 2024

Leistung:

• Cover-Design
• Buchsatz und Layout
• Drucklegung
• Barrierefreies PDF
• Unterstützung beim e-Book

Branche: Verlag

Verwendete Technologie:

• Word
• Adobe Indesign
• Adobe Illustrator
• Adobe Acrobat Pro
• PAC3
• Midjouney

Plattformübergreifenden App-Entwicklung eines digitalen Assistenten für individuelles Lernen

Die Herausforderung:
Die Aufgabenstellung ist die Erstellung einer App für Android und iOS mit einer gemeinsamen Codebasis in .NET MAUI.

Der Nutzen für den Kunden:

1. Effizienz: Mit einer gemeinsamen Codebasis sparen Entwickler Zeit und Ressourcen, indem sie Funktionen auf mehreren Plattformen bereitstellen können.
2. Skalierbarkeit: Egal, ob eine kleine App oder eine umfangreiche Anwendung benötigt wird .NET MAUI skaliert mit den Anforderungen.
3. Konsistenz: Durch die Verwendung von nativen Steuerelementen und APIs auf jeder Plattform wird gewährleistet das es konsistente Benutzererlebnisse auf verschiedenen Geräten gibt.
4. Zukunftssicherheit: Als Teil des .NET-Ökosystems wird .NET MAUI aktiv weiterentwickelt und unterstützt, um mit den sich ständig ändernden Anforderungen und Technologien Schritt zu halten.
5. Barrierefreiheit: .NET MAUI bietet robuste Funktionen zur Unterstützung von Barrierefreiheit. Damit können Entwickler Anwendungen erstellen, die für alle Benutzer zugänglich sind.

Der Weg dorthin:
Zuerst haben wir die .NET MAUI App-Entwicklung in C# gestartet. Dies ermöglichte uns, eine leistungsstarke und plattformübergreifende Anwendung zu erstellen, die sowohl auf iOS als auch auf Android läuft. Dabei haben wir besonderen Wert auf eine saubere und effiziente Code-Struktur gelegt. Während dessen haben wir auch das Design in XAML umgesetzt.

Ein wichtiger Schritt war die Umsetzung des Controlsets. Hier haben wir maßgeschneiderte Controls entwickelt, um spezifische Anforderungen der Anwendung zu erfüllen und gleichzeitig eine konsistente Benutzererfahrung sicherzustellen. Jedes Control wurde sorgfältig getestet und verfeinert, um höchste Qualität zu gewährleisten.

Für die visuelle Gestaltung haben wir eine Iconfont integriert. Dies ermöglichte uns, skalierbare und leicht anpassbare Icons zu verwenden, die das Design der App bereicherten und die Benutzerfreundlichkeit erhöhten.

Ein wesentlicher Bestandteil unseres Prozesses war der BITV-Test auf der Webseite und der App. Durch diesen Test haben wir die Barrierefreiheit der Anwendung gründlich geprüft, um sicherzustellen, dass sie den Anforderungen der Barrierefreien-Informationstechnik-Verordnung entspricht. Dabei wurden unter anderem Farbkontraste, Schriftgrößen und die Navigation auf Barrieren überprüft.

Schließlich haben wir in Beratungsgesprächen bewährte Methoden und Strategien diskutiert, um eine inklusive und zugängliche Benutzeroberfläche zu schaffen. Unser Fokus lag darauf, die Anwendung für alle Benutzergruppen, einschließlich Menschen mit Behinderungen, zugänglich zu machen. So wollen wir sichergestellt, dass die App nicht nur funktional, sondern auch für alle Nutzer gut bedienbar ist.

Jahr: 2023/24

Leistung:

• .NET MAUI App-Entwicklung in C#
• Designumsetzung in XAML
• Controlset Umsetzung
• Iconfont-Erstellung
• BITV Test auf Webseite und App
• Beratung zu barrierefreiem UI Design

Branche: Bildung

Verwendete Technologie:

• Visual Studio
• Figma
• Inkscape Vector Grafik Editor
• FontForge

Professionelles Re-Design und Weiter-Entwicklung einer Verwaltungs-Software der Logistik-Branche

Die Herausforderung:
Die Aufgabenstellung war das komplette Redesign, einer Verwaltungs-Sofware auf Basis einer schon vorhandenen auch von uns gestalteten Software. Die Software soll barriereärmer werden allerdings nur auf der visuellen Ebene.

Der Nutzen für den Kunden:
Durch die neu gestaltete moderne attraktive Nutzeroberfläche kann das Software-Produkt in Zukunft effektiver von den Nutzern bedient werden. Das hat Zeitersparnis und Fehlerreduzierung zur Folge. Der Anspruch war, ein möglichst barrierearmes Interface zu gestalten.

Der Weg dorthin:
Zuerst haben wir die aktuelle Barrierefreiheit evaluiert, in dem wir die Software gründlich überprüft haben. So haben wir potenzielle Barrieren für Benutzer mit unterschiedlichen Fähigkeiten, wie zum Beispiel Farbblindheit, eingeschränkte Sicht, motorische Einschränkungen oder kognitive Beeinträchtigungen aufgedeckt.
Dann haben wir uns klare Ziele für das visuelle Redesign im Hinblick auf Barrierefreiheit definiert. Eine Verbesserung des Farbkontrasts, ein Verzicht auf ein Farbleitsystem, generell größere Schriften und Schaltflächen, ein gut erkennbarer FocusVisual, klare Icons.

Wir haben mit Nutzern gesprochen und auch deren Feedback mit einbezogen und nachgebessert, um ihnen mit Ihren spezifischen Bedürfnisse und Herausforderungen zu helfen. Und daraus ein neues Design entwickelt ohne die ursprünglichen Interaktionsprozesse zu beeinflussen. Es wurden verschiedene Bildschirmgrößen in die Gestaltung mit einbezogen, um Responsivität zu gewährleisten. Anschließend wurde das neue Design von uns in XAML umgesetzt. Dabei haben wir sicher gestellt, dass das Design konsistent ist und eine klare Hierarchie aufweist.
Schließlich haben wir einen BITV-Test auf die gesamte Lösung gemacht und das Ergebnis in die Software integriert.

Jahr: 2023

Leistung:

• Entwicklung in XAML und C#
• Barrierefreies UI Design
• Controlset-Entwicklung
• Masken Anpassungen in XAML
• Icon Design
• Logo Design
• BITV Test

Branche: Personenverkehr

Verwendete Technologie:

• Visual Studio
• Adobe Illustrator
• Adobe XD

Begleitender BITV Test für die Webseite von Peggy Reuter-Heinrich

Die Herausforderung:
Die Evaluation einer Webseite orientiert sich an vier Grundprinzipien : Wahrnehmbarkeit, Bedienbarkeit, Verständlichkeit und Robustheit. Wichtig ist, dass Inhalte für alle Nutzer wahrnehmbar sind, die Bedienung intuitiv erfolgt, Informationen verständlich aufbereitet wurden und die Technologie robust gegenüber verschiedenen Plattformen und Technologien bleibt. Diese Prüfung gewährleistet eine barrierefreie, benutzerfreundliche und inklusive digitale Umgebung für alle, unabhängig von ihren Fähigkeiten oder Einschränkungen. Die Webseite beinhaltet verschiedene Medien, die natürlich mit verschiedenen Mitteln barrierefrei gestaltet werden müssen.

Der Nutzen für den Kunden:
Der BITV-Tests für diese Webseite gewährleistet, dass sie barrierefrei und benutzerfreundlich sind, was die Zufriedenheit der Nutzer erhöht. Durch die Einhaltung der vier Grundprinzipien erhöht sich die Zugänglichkeit für Menschen mit Behinderungen und ermöglicht eine breitere Zielgruppe. Zudem minimiert die Konformität rechtliche Risiken und verbessert das Image des Kunden in Bezug auf soziale Verantwortung. Ein erfolgreicher BITV-Test fördert die Inklusion, steigert die Kundenbindung und maximiert die Nutzung der digitalen Plattform.

Der Weg dorthin:
Die Durchführung von BITV-Tests erfordert mehrere Schritte. Zunächst erfolgt eine Analyse der Webseite auf die aktuell 98 Kriterien der BITV. Es wurden manuelle und automatisierte Tests sowie Screenreader- und Tastaturtests vorgenommen. Dabei werden mögliche Barrieren für Menschen mit Behinderungen identifiziert. Die Ergebnisse wurden dokumentiert und notwendige Anpassungen vorgeschlagen. Schließlich wurden die vorgeschlagenen Änderungen, soweit es WordPress zulässt,  umgesetzt um Barrierefreiheit zu gewährleisten. Abschließend wurde eine Erklärung zur Barrierefreiheit erstellt und auf der Webseite verlinkt.

Startseite | Peggy Reuter-Heinrich (peggy-reuter-heinrich.net)

Jahr: 2022

Leistung:

• BITV Analyse der Webseite
• Entwicklungsbegleitende Empfehlungen
• Anpassungen nach Empfehlungen
• Erklärung zur Barrierefreiheit für die Webseite

Branche:
IT

Verwendete Technologie:

• Word
• Excel
• Entwicklertools Firefox und Edge
• WordPress

Barrierefreie PDFs um Dokumente für alle Menschen zugänglich zu machen

Die Herausforderung:
Bei der Erstellung barrierefreier Dokumente besteht die Herausforderung darin, sicherzustellen, dass die Inhalte für alle Menschen, auch für Menschen mit Behinderungen, leicht zugänglich und nutzbar sind. Dazu müssen bestimmte Designstandards eingehalten werden, wie Kontrastwerte und Gliederungen bzw. Gruppierungen. Man nutzt unterstützende Elemente, wie Bilder und Grafiken um die Inhalte besser verständlicher zu machen. Aber auch technische Aspekte wie z. B. die Kompatibilität mit Bildschirmlesegeräten, Alt-Text für Bilder und die richtige Struktur von Überschriften, um einen gleichberechtigten Zugang und ein gleichberechtigtes Verständnis der dargestellten Informationen zu ermöglichen.

Der Nutzen für den Kunden:
Barrierefreie Dokumente bieten den Vorteil von integrativen und benutzerfreundlichen Inhalten. Durch die Einhaltung von Zugänglichkeitsstandards wie Kompatibilität mit Bildschirmlesegeräten, klarer Alt-Text und korrekte Formatierung demonstrieren Unternehmen ihr Engagement für Vielfalt und verbessern das Nutzererlebnis für alle Menschen, was ein positives Markenimage fördert und die Reichweite der Zielgruppe erhöht.

Der Weg dorthin:
Die Erstellung der barrierefreien Dokumente beginnt bei uns mit der Konzeption, wobei die Grundsätze des integrativen Designs zu berücksichtigen sind. Wir verwenden z.B. während des Entwurfsprozesses klare Überschriften, beschreibende Alt-Texte für Bilder und lesbare Schriftarten etc. Wenn Inhalt und Design stehen, optimieren wir das Dokument anschließend in Adobe Pro, um die Zugänglichkeit zu gewährleisten. Es werden Elementen Tags hinzugefügt, die richtige Lesereihenfolge wird sichergestellt und das Kontrastverhältnis überprüft. Das endgültige Dokument prüfen wir mit PAC3 auf seine Konformität.

Jahr: 2023

Leistung:

• Konzeption
• Inhalt
• Barrierefreies Desgin
• Satz
• Barrierefreie Erstellung

Branche: IT

Verwendete Technologie:

• Word
• Indesign
• Illustrator
• Photoshop
• Adobe Pro
• PAC3

Klickprototyp für ein digitales Orientierungs- und Informationssystem als Barrierefreier Prototyp in mehreren Sprachen

Die Herausforderung:
Das System, das Ästhetik und Funktionalität in Einklang bringt, soll es allen Besuchern ermöglichen, mühelos auf wichtige Informationen und Dienstleistungen im Rathaus zuzugreifen. Die Entwicklung eines solchen inklusiven Orientierungssystems für ein Rathaus stellt eine besondere Herausforderung dar. Die Kombination von barrierefreier Zugänglichkeit und benutzerfreundlicher Touch-Display-Technologie erfordert eine nahtlose Integration von intuitiver Navigation, visueller Klarheit und einbindung von diversen Tools um Barrierefreiheit sicher zu stellen.

Der Nutzen für den Kunden:
Die Stadt profitiert von dem entworfenen Orientierungssystem in vielerlei Hinsicht. Es stärkt den Ruf des Rathauses als integrative und barrierefreie Einrichtung und fördert die positive öffentliche Wahrnehmung. Darüber hinaus vereinfacht die Effizienz des Touch-Displays die Interaktion mit den Besuchern, reduziert die Arbeitsbelastung des Personals und optimiert den Gesamtbetrieb für eine effizientere und zufriedenstellende Benutzererfahrung.

Der Weg dorthin:
Um einen fertigen Prototyp zu erstellen, beginnt der Prozess mit der Konzeption der Ziele und Funktionen des integrativen Orientierungssystems. UX/UI-Designer arbeiten eng zusammen, um intuitive Schnittstellen zu entwerfen. Unsere umfassende Beratung hat die Einhaltung der Zugänglichkeitsstandards gewährleistet. Mockups wurden auf der Grundlage von Rückmeldungen iterativ immerweiter verfeinert. Schließlich erweckt ein interaktiver HTML-Prototyp die Vision zum Leben und zeigt das funktionale und benutzerfreundliche Design.

Jahr: 2023

Leistung:

• Konzeption
• UX/UI-Design
• IconDesign
• Beratung
• Mocks
• HTML-Prototyp

Branche: Öffentliche Hand

Verwendete Technologie:

• Word
• Excel
• Balsamiq
• Adobe Illustrator
• Adobe XD
• HTML/SCSS
• Javascript

Verlag für das Buch „Digitale Barrierefreiheit für alle!“ als gedruckte und digitale Version

Die Herausforderung:
Das Buch „Digitale Barrierefreiheit für alle!“ von Peggy Reuter-Heinrich geschrieben, soll verlegt und verkauft werden, mit allem was an Gestaltung, Marketing, Drucklegung etc. dazu gehört.

Der Nutzen für den Kunden:
Das Buch wird einer breiten Öffentlichkeit zugänglich und bekannt gemacht. Der Verkauf wird gefördert und so werden Menschen auf die Sache an sich (digitale Barrierefreiheit) sensibilisiert. Außerdem wird auf unsere Firma HeiReS aufmerksam gemacht, welche ein großes Angebot an Dienstleistungen rund um das Thema digitale Inklusion anbietet.

Der Weg dorthin:
Das Buch wurde in Word schon auf Barrierefreiheit vorbereitet. Anschließend nutzen wir InDesign, um das Layout zu setzen. Auch hier haben wir weiter an der Barrierefreiheit des fertigen Dokumentes gearbeitet. So setzten wir zum Beispiel Alternativtexte auf Bilder oder kennzeichneten reine Layout-Elemente als Artifakte damit der Screenreader sie anschließend nicht vorliest. Dann wurden Druckdatei und barrierefreies PDF erstellt. Wir erstellten Social-Media Beiträge, einen Buch-Teaser und Verkaufswebseiten. Mit dem Buch waren wir 2022 sogar auf der Frankfurter Buchmesse. Mittlerweile ist das Buch sogar über Amazon erhältlich. Eine Neuauflage und ein barrierefreies eBook sind in Planung.

Hier können Sie noch mehr über das Buch erfahren.

Jahr: 2022

Leistung:

• Konzept
• UI-Design
• Social-Media Anzeigen
• Teaser zum Buch
• WordPress-Webseite

Branche: Verlag

Verwendete Technologie:

• Word
• Adobe Indesign
• Adobe Illustrator
• Adobe Acrobat Pro
• PAC3
• Adobe Premiere Pro

UX/UI Re-Design einer Anwaltskanzlei-Webseite

Die Herausforderung:
Notwendig war ein Rund-um-Konzept für eine WordPresslösung, welches über mehrere Teilbereichsseiten (alle auf unterschiedlichen Domains) einer Anwaltskanzlei funktioniert.

Der Nutzen für den Kunden:
Durch eine einheitliche und professionelle Optik wirkt auch die Kanzlei gleich professioneller, was sich auf die Anzahl der Mandanten auswirke wird und evtl. sogar auf das Honorar. Außerdem sind die Seiten um einiges schneller geworden, was in der heutigen Zeit von den Nutzern erwartet wird und potenzielle Neukunden so länge auf der Seite halten wird.

Der Weg dorthin:
Angefangen haben wir bei der Sichtung der bestehenden Webseiten und deren verwendeter Technologie. Anschließend erstellten wir ein Konzept zur Verbesserung der technischen Umsetzung. Wir haben die Informationen der Webseiten sortiert und einen Klickprototyp gebaut, welcher die Webseiten untereinander logisch verbindet. Das Design kam direkt danach und ist über alle Seiten nachhaltig wiederverwendbar. Dann ging es noch an die Umsetzung zum Schluss wurde noch ein BITV Test zur Feststellung des Standes der Barrierefreiheit auf der Haupt-Webseite durchgeführt. Das Ergebnis haben wir mit einer Erklärung zur Barrierefreiheit der Seite hinzugefügt.

Jahr: 2022

Leistung:

• Konzept
• Klick-Prototype
• UI-Design
• Umsetzung
• BITV Test und Erklärung zur Barrierefreiheit

Branche: Justiz

Verwendete Technologie:

• Balsamiq
• Adobe Illustrator
• Adobe XD
• WordPress

UX/UI Re-Design einer Software zur Verwaltung von gastronomischen Prozessen

Die Herausforderung:
Ein sehr komplexes Planungs- und Buchungssystem für gastronomische Einrichtungen mit vielen Features soll ein Re-Design in UX und UI bekommen. Es soll während der Arbeit z. B. in Großküchen auf einem mobilen Gerät verwendet werden, aber auch im Büro an einem Desktop PC. Ein Dark-Mode wurde explizit gewünscht.

Der Nutzen für den Kunden:
Die Auflösung und Vereinfachung der Nutzer-Prozesse und das ansprechende, frische Design wird das Produkt besser verkaufbar machen.

Der Weg dorthin:
Gestartet haben wir mit einer Analyse des vorhandenen Projektes also alles, was mit dem Programm möglich ist und welche Prozesse der Nutzer durchläuft, um seine Ziele zu erreichen. Nebenbei haben wir eine heuristische Evaluation durchgeführt, um die Gebrauchstauglichkeit zu überprüfen. Die Lösungen für gefundene Probleme haben wurden in dem anschließend entstandenen Klickprototypen von uns eingearbeitet. Auf Grundlage des Kunden CIs wurde von uns ein modernes und frisches Design entwickelt und ein dazu passender Dark Mode.

Jahr: 2022

Leistung:

• heuristische Evaluation
• UX Konzept
• Klick-Prototype
• UI-Design

Branche: Gastronomie

Verwendete Technologie:

• Balsamiq
• Adobe Illustrator
• Adobe XD

Konzeption, UI Design und Entwicklung einer WordPress-Seite für eine öffentliche Einrichtung in Dresden.

Die Herausforderung:
Es soll eine Webseite entstehen, mit welcher Umfragen im wissenschaftlichen Kontext gemacht werden können. Diese Webseite soll möglichst barrierearm sein. Um das möglichst Zeit und Geld sparsam zu realisieren, wurde sich für eine Customized WordPress-Lösung entschieden.

Der Nutzen für den Kunden:
Durch das Verwenden von vorhandenen Ressourcen wurde Zeit und Geld gespart. Die Barrierefreiheit war eine gesetzliche Vorgabe für die Finanzierung des Projektes. Was uns von HeiReS sehr freut, denn wir setzen uns schon seit Jahren für mehr Barrierefreiheit in der IT-Welt ein.

Der Weg dorthin:
Wir haben mit dem Kunden zusammen Nutzerszenarien erstellt und dazu Mockups angefertigt, um den Nutzerprozess darzustellen. Anschließend wurden von unseren Entwicklern geeignete Plug-ins gesucht, aufgebohrt und umgeschrieben, um die gewünschten Funktionen zu erfüllen. Während dessen hat unsere Design-Unit sich um ein barrierefreies, aber auch modern und optisch ansprechendes Design gekümmert. Dieses wurde dann barrierearm umgesetzt. Im Anschluss haben wir die Webseite auf die 98 BITV Kriterien getestet und eine Erklärung zur Barrierefreiheit verfasst.

Jahr: 2021

Leistung:

• UX Konzept
• UI-Design
• UI-Entwicklung für WordPress
• BITV-Test und Erklärung zur Barrierefreiheit

Branche Medizin

Verwendete Technologie:

• Balsamiq
• Adobe Illustrator
• WordPress
• Plugins

Professionelles Re-Design für eine Software zur Zeiterfassung

Die Herausforderung:
Die Aufgabenstellung war das komplette Redesign, also die Konzeption und Gestaltung eines modernen, attraktiven Userinterface Designs mit hoher Gebrauchstauglichkeit für eine Zeiterfassungs-Sofware.

Der Nutzen für den Kunden:
Durch die neu organisierte und gestaltete moderne attraktive Nutzeroberfläche kann das Software-Produkt in Zukunft effektiver von den Nutzern bedient werden. Das hat Zeitersparnis und Fehlerreduzierung zur Folge. Der Anspruch war, ein möglichst barrierearmes Interface zu gestalten.

Der Weg dorthin:
Zur Auflösung der kritischen Nutzungsszenarien wurden konkrete Verbesserungsvorschläge mittels Klick-Prototyp unterbreitet. In diesem Schritt haben wir schon verstärkt auf eine barrierearme Lösung hingearbeitet. Auf Basis des ersten Entwurfes und im Hinterkopf die BITV Kriterien, wurde ein attraktives modernes UI-Design entworfen und in zwei Geschmacksrichtungen ausgestaltet. Das Design orientierte sich dabei an dem CI des Kunden. Daraus formierte sich dann das schlussendliche optimale UI-Design.
Gerade moderne Software-Applikationen bedienen sich bildsprachlichen Ausdrucksformen in Form von Icons. Dafür haben wir ein eigenes Icon-Sets durchgestaltet.
Es wurden verschiedene Bildschirmgrößen in die Gestaltung mit einbezogen, um Responsivität zu gewährleisten.
Anschließend ging es an die Umsetzung. Dazu wurde ein komplettes Controlset ausgestaltet und in XAML umgesetzt. Wir haben die nötigen Masken gebaut und anschließend auf Barrierefreiheit getestet, um letzte Schwachstellen ausbessern zu können.

Jahr: 2020

Leistung:

• Klick-Prototyp
• Barrierefreies UI Design
• Controlset
• versch. Masken in untersch. Ausrichtungen
• Icon Design
• Logo Design
• Entwicklung in XAML und C#
• BITV Test

Branche:
Personenverkehr

Verwendete Technologie:

• Balsamiq Wireframes
• Adobe Illustrator
• Adobe XD
• Visual Studio

UI-Design für eine Weblösung zur digitalen Beratung von Kunden

Die Herausforderung:
Es soll eine leistungsstarke Beratungsweblösung gestaltet werden, welche technisches Fachwissen für die Entwicklung maßgeschneiderter Lösungen beinhaltet. Dabei soll es eine klare und gut verständliche Nutzerführung geben. Außerdem sind weitere Webangebote auf diesem Prinzip geplant, welche nach dem Vorbild dieses ersten Prototyps gestaltet werden können.

Der Nutzen für den Kunden:
Der Nutzer findet auf schnellem und unkomplizierten Weg eine Lösung für seine Herausforderungen. Durch die angenehme, professionelle Optik und den einfachen Bedienprozess wird der Nutzer auf der Webseite gehalten. Das führt potenziell zu einem erhöhten Verkauf der Produkte durch den Anbieter.

Der Weg dorthin:
Wie in vielen Projekten dieser Art wurden von uns Mockups in Balsamiq erstellt, um die Nutzerszenarien abzubilden und zu durchdenken. Dadurch konnten wir den Beratungsprozess optimieren und für die individuellen Bedürfnisse der Nutzer zurechtschneiden. Anschließend wurde ein UI-Design auf Grundlage des CIs der Firma gestaltet. Dabei haben wir die unterschiedlichen Screengrößen mit einbezogen. Außerdem haben wir für diese spezielle Webanwendung Icons und ein kleines Controlset entwickelt. Dabei können Struktur, Prozesse und Design auf die kommenden Lösungen übertragen werden.
Um dem Nutzer alle möglichen Hilfestellungen zu bieten, wurde von uns noch ein Erklär-Video zu diesem Produkt auf Englisch erstellt.

Jahr: 2021/22

Leistung:

• UX Konzept
• IA Prototyp
• Mobile first
• UI Design
• Controlset
• Icon-Set
• Styleguide
• Erklärvideo

Branche: Industrie

Verwendete Technologie:

• Adobe XD
• Adobe Illustrator
• Balsamiq
• Microsoft Word
• Simpleshow

Texten, konzipieren, gestalten und einsprechen von Erklärvideos

Die Herausforderung:
Unser Alltag wird immer komplexer und die steigende Informationsflut überfordert viele. Eine Botschaft soll einfach, bildhaft und barrierefrei übermittelt werden, um so möglichst viele Menschen erreichen zu können.

Der Nutzen für den Kunden:
Durch die anschauliche Ton-Bild-Text-Kombination ist das Verstehen der Inhalte viel leichter. Der einfache, kontrastreiche Zeichenstil und die simple Wortwahl machen es noch gefälliger und verständlicher. Dadurch erreicht der Kunde eine größere Zielgruppe, denn die Botschaft wird verstanden.

Der Weg dorthin:
Wir setzten uns mit dem Kunden zusammen, um die Zielsetzung auszuarbeiten. Dann wurde ein Text erstellt, natürlich mit Korrekturoptionen. Mit hochwertigen Grafiken erstellten wir Animationen, die zu der Story der zu vermittelten Botschaft passt. Nachdem der Kunde uns sein „Okay“ gegeben hatte, wurde der Text professionell aufgenommen. Anschließend wurde noch die Untertitelspur erstellt. Das Endprodukt ist ein Erklärvideo, welches vielen Menschen eine bessere Teilhabe an wichtigen Themen ermöglicht.

Jahr: 2020

Leistung:

• Konzeption
• Gestaltung
• Texten
• Sprachaufnahmen

Branche: Gemeinnützig

Verwendete Technologie:

• Adobe Illustrator
• Premiere Pro
• Audacity
• Simpleshow Videomaker

Mini-CI, Geschäftsausststattung und WebDesign mit WordPress für ein Startup Unternehmen 

Die Herausforderung:
Ein Startup-Unternehmen ist optisch noch ein komplett unbeschriebenes Blatt, also müssen Standards festgelegt werden, in Form von Farben, Schriften, Formsprache und natürlich ein Logo. Anschließend wurde noch ein Webauftritt gewünscht.

Der Nutzen für den Kunden:
Eine Firma benötigt einen entsprechenden Auftritt in analoger und digitaler Form. Analog sind Geschäftspapiere wie Visitenkarte um neu geknüpfte Kontakte zu festigen und Briefpapier der Standard. Online ist eine Website eine Art digitale Visitenkarte und deshalb ist es gerade jetzt, im Zeitalter der Digitalisierung, besonders wichtig eine zu haben. Natürlich zählt auch die Optik und so generiert eine professionelle Webseite, mehr Aufträge und somit auch mehr Umsatz.

Der Weg dorthin:
Wir haben die Kundenwünsche entgegengenommen, mehrere Designvorschläge ausgearbeitet und uns so mit dem Kunden Stück für Stück seinen Vorstellungen angenähert. Es entstanden im Design Logo, Visitenkarte, Briefpapier und Webseite. Danach suchten wir ein geeignetes Theme heraus, welches den Ansprüchen für eine Webseite und das ausgestaltete Design genügt. Wir legten mehrere Themenseiten an, strukturierten und pflegten Inhalte ein, schließlich wurde noch Hand an die Optik gelegt und fertig. Super simpel und super effektiv.

Jahr: 2020

Leistung:

• Design WordPress Webseite
• Hosting
• Mini-CI
• Logo
• Icon-Design
• Geschäftsausstattung
• Themen IconDesign

Branche: Notar

Verwendete Technologie:

• Adobe XD
• Adobe Illustrator
• WordPress

Design und Entwicklung einer Shop-Lösung für Gaming und PC Hardware

Die Herausforderung:
Gesucht wurde eine einfach Shop-Lösung – initial nur für Merchandising gedacht. Die Lösung musste das Potential haben, skalierbar und passend zu Bedarf und Wachstum des Projektes stetig anpassbar zu sein. Wichtig wurde im Laufe des Projektes die Entwicklung einer Konfigurator-Lösung, teilautomatisierte Tasks wie Lager-Importe sowie eine komfortable Filterlösung für den wachsenden Produktkatalog.

Der Nutzen für den Kunden:
E-Commerce Lösungen sollten für Kunden leicht zu verwenden sein. Das Shopping-Erlebnis sollte problemlos und verständlich ablaufen, die Zahlung reibungslos und vertrauenswürdig sein. Gleichzeitig sollte auch den Mitarbeitern der Umgang mit dem Shop, die Pflege von Produkte, das Handling von Bestellungen etc. technisch möglichst leicht gestaltet werden.

Der Weg dorthin: Nach Abwägung der initialen Anforderungen und Entscheid über die Shop-Lösung hat HeiReS das Shop-System in Shopify aufgesetzt und ein passenden Theme inkl. Anpassungen an’s CI etabliert. Laufend zum Skalieren des Projektes, des Produktportfolios und der Produktvielfalt wurde das System laufend technisch mittels PlugIns und individueller Anpassungen erweitert.

Jahr: 2020/21

Leistung:

• Shopify-Setup
• UI-Design
• Theme-Anpassungen
• Indiv. CSS Gestaltung
• Anpassung Liquid-Programmierung
• Setup/Anpassung Erweiterungen
• Content-Pflege
• Backup-Lösung

Branche: Unterhaltung, Online-Community

Verwendete Technologien:

• Shopify
• WordPress
• Adobe Photoshop
• PHP/HTML/CSS
• LIQUID

Design und Entwicklung einer Webseite für Sim-/Real-Rennsport Community

Die Herausforderung:
Aus einer ursprünglich statischen Landing-Page sollte eine dynamische und CMS-basierte Webseite werden. Dem Team sollte dies einfache und komfortable Content-Pflege ermöglichen. Zudem musste das CMS flexible Möglichkeiten in Gestaltung, multimedialen Inhalten und ggf. Anbindung an externe Systeme wie Discord und einen Shop ermöglichen.

Der Nutzen für den Kunden:
CMS basierte Webseiten bieten einmalige Möglichkeiten hinsichtlich Contentpflege, Erweiterbarkeit und optischer Anpassung. Sie haben zudem den Vorteil einer komfortablen Nutzerverwaltung um Inhaltsbearbeitung auch durch Mitarbeiter ohne technische Vorkenntnisse zu ermöglichen.

Der Weg dorthin:
Nach Prüfung und Evaluierung der techn. Gegenheiten entwickelte HeiReS eine Webseite entlang dem CI des Projektes. Dank Verwendung eines Themes und individuell gestalteter Vorlagen wurde einfach Inhaltspflege sichergestellt. Anschließend erfolgte Anbindung der Webseite an ein CRM System sowie die Einbindung von dynamischem Inhalt aus unterschiedlichen, externen Quellen.

Jahr:
2020/21

Leistung:

• Webserver-Setup
• WordPress-Setup
• UI-Design
• Theme-Anpassungen
• Indiv. CSS Gestaltung
• Content-Pflege
• Backup-Lösung

Branche:
Unterhaltung, Online-Community

Verwendete Technologien:

• WordPress
• Adobe Photoshop
• Adobe Premiere Pro
• PHP/HTML/CSS

Discord als Plattform für Simracing Community

Die Herausforderung:
Plattformen, die von Consumern oder in diesem Fall Gamern verwendet werden unterscheiden sich oft sehr von dem, was kommerzielle Unternehmen anbieten oder „verkaufen“ wollen. Daher kann es nötig werden, sich in neue Technologien einzuarbeiten und Plattformen zu nutzen, die von der Zielgruppe bereits verwendet werden und dort etabliert sind.

Der Nutzen für den Kunden:
Lösungen anzubieten, die nicht zur Zielgruppe passen, bedeutet immer einen Verlust an potentieller Verbreitung. Die Adaption vorhandener und etablierter Plattformen bedeutet im Gegenzug, die Zielgruppe dort zu erreichen, wo so ohnehin „anzutreffen“ ist.

Der Weg dorthin:
Nach Einarbeitung in Discord an sich wurde ein entsprecheder Server für die Community etabliert. Dieser wurde entsprechend dem Wachstum der Community (Mitglieder, techn. Anforderungen an Discord, Integration und Automation) stetig erweitert. Focus lag hier auf Etablierung einer Mitgliederverwaltung (3000+ Mitglieder), strukturierten Kommunikationskanälen, Integration externer Plattformen und Quellen sowie Aufgaben-Automation.

Jahr: 2020/21

Leistung:

• Discord Server Setup
• Etablierung Mitglieder-Verwaltung
• Setup unterschiedlicher Discord-Bots
• Integration Discord in Webseite
• Integration Social Media in Discord
• Support Team-Mitglieder
• Recherche und Setup Discord-Erweiterungen

Branche: Unterhaltung, Online-Community

Verwendete Technologien:

• Discord
• Adobe Photoshop
• PHP/HTML/CSS

Design und Entwicklungsunterstützung für eine Multiple Sklerose Plattform

Die Herausforderung:
Es soll eine Plattform für Multiple Sklerose Patienten entstehen. Hier kann man sich informieren, über neueste Studien aber auch den Krankheitsverlauf dokumentieren und ärztliche Dokumente ablegen. Die besondere Herausforderung durch die Förderung des Projektes muss die Plattform barrierefrei sein, was ganzheitlich alles betrifft, vom Design über die Interaktion bis hin zur Programmierung. Wir kümmern uns in diesem Projekt hauptsächlich um UI und Interaktion Design. Helfen aber auch bei der technischen Umsetzung.

Der Nutzen für den Kunden:
Durch das Gesetz (z. B. Bundesteilhabe Gesetz) sind wir nicht mehr nur moralisch zur Umsetzung von Barrierefreiheit verpflichtet. Es gibt bestimmte Vorgaben, die eingehalten werden müssen im Rahmen einer Förderung aus EU Mitteln, um Inklusion zu gewährleisten. Daher war es für diesen Kunden wichtig, dass alles inklusiv gestaltet wurde.

Der Weg dorthin:
Wir haben uns intensiv mit den verschiedenen Nutzergruppen auseinandergesetzt und anschließend angefangen, verschiedene Seite strukturell aufzubauen. Dabei entstanden im Interaktionsdesign 8 Hauptseiten. Daraus entstand ein Protoype. Anschließend entwickelten wir 2 verschiedene Design-„Geschmacksrichtungen“. Nach einer Entscheidung, in welcher Richtung wir weiter arbeiten sollten, entwickelten wir ein Controlset um dann die einzelnen Screens auszugestalten. Dazu entstand auch ein IconSet mit über 70 Icons.
Es gab einen kleinen Styleguide, um die Entwickler bei der Umsetzung zu unterstützen. Des Weiteren ein Logo für ihre Plattform und bei der technischen Umsetzung haben wir dann auch noch ein bisschen geholfen.

Jahr: 2020

Leistung:

• UX Konzept
• Prototyp
• UI Design
• IconSet
• Logo
• Styleguide
• Entwicklungsunterstützung

Branche: Gesundheit

Verwendete Technologie:

• Adobe XD
• Adobe Illustrator
• Balsamiq
• Visual Studio Code
• GitHub
• Angular

WebDesign mit WordPress für eine Werbeagentur

Die Herausforderung:
Die Webseite wurde von Grund auf neu erstellt. Das gibt Gelegenheit ein Re-Design der Seite zu machen und so einen neuen frischen Internetauftritt für den Kunden zu schaffen.

Der Nutzen für den Kunden:
Eine Website ist eine Art digitale Visitenkarte, deshalb ist es gerade jetzt im Zeitalter der Digitalisierung besonders wichtig eine zu haben. Natürlich zählt auch die Optik und so generiert eine professionelle Webseite, mehr Aufträge und somit auch mehr Umsatz.

Der Weg dorthin: Wir haben die Kundenwünsche entgegengenommen. Daraufhin suchten wir eine geeignetes Theme heraus, welches den Ansprüchen genügt. Wir legten einen Onepager an, strukturierten und pflegten Inhalte ein, schließlich wurde noch Hand an die Optik gelegt und fertig. Super simpel und super effektiv.

Jahr: 2020

Leistung:

• Design WordPress Webseite
• Hosting

Branche: Werbung

Verwendete Technologie:

• Adobe XD
• Adobe Illustrator
• WordPress

UI-Design für eine Verwaltungssoftware im Sozialen Bereich

Die Herausforderung:
Es soll eine IT Lösung entstehen, die 4 Bereiche in der Pflege miteinander verbindet. Haushaltsnahedienstleistungen, Erstehilfe, Inklusion und Jugendhilfe. Es soll eine Art Verwaltungstool werden, in dem z. B. Dienstpläne gemacht werden, aber auch Inventuren. Auch die Möglichkeit zur Kommunikation zwischen z.B. Jugendlichen und Betreuungspersonen soll gegeben sein, was eine App für Kinder mit einschließt.

Der Nutzen für den Kunden:
Eine unglaublich vielschichtige Lösung, die so vorher noch nicht existiert hat, gibt dem Kunden ein Alleinstellungsmerkmal und somit auch einen Vorteil auf dem Markt. Unsere Hilfe in Bereich des UX und UI Design wird das Produkt besser verkaufen, weil es optisch sehr ansprechend und einfach zu bedienen ist.

Der Weg dorthin:
Nach einem umfassenden Briefing, was die Lösung alles bieten soll, ging es an die Konzeption. Nutzergruppen wurden evaluiert, Seitenstrukturen aufgebaut, UX designt. Anschließend wurde Ein sehr cleanes Design ohne viele Schnörkel entworfen. Dazugehörten auch ein Controlset, gut 50 Icons und 16 Screens.

Jahr: 2020

Leistung:

• UX Konzept
• IA Prototyp
• UI Design
• Icon-Set
• Styleguide

Branche: Medizin

Verwendete Technologie:

• Adobe XD
• Adobe Illustrator
• Balsamiq
• Microsoft Word

WebDesign für einen Großanbieter von IT-Hardware

Die Herausforderung:
Die bestehende Webseite generiert trotz eines neuen Designs zu wenig Umsätze. Deshalb Erarbeitung eines neuen UX Konzeptes und Überarbeitung des UI-Designs.

Der Nutzen für den Kunden:
Strategie und UX Konzept für einen leichteren und kundenfreundlicheren Einstieg in die Webseite, um die Kunden zum Kaufen zu bewegen und nicht abzuschrecken.

Der Weg dorthin:
Die Webseite wurde neu strukturiert und durchdacht, immer in Hinblick auf leichtes Verstehen für den Kunden. Anschließend wurde das Design angepasst, um ein bisschen auffälliger und somit auch attraktiver für die Käufer zu werden.

Jahr: 2020

Leistung:

• UX Konzept
• Prototyp
• UI Design
• IconSet
• Styleguide

Branche: Einzelhandel

Verwendete Technologie:

• Adobe XD
• Adobe Illustrator
• Balsamiq

Kurzberatung mit professionellem UI Design für eine Software zur 3D-Reinigungssimulation

Die Herausforderung:
Die Aufgabenstellung im Rahmen einer siebentägigen Kurzberatung war die Konzeption eines modernen attraktiven User Interface Designs mit hoher Gebrauchstauglichkeit für eine 3D-Reinigungssimulations-Sofware.

Der Nutzen für den Kunden:
Durch die neu gestaltete moderne attraktive Nutzeroberfläche – also das UI-Design – kann das Software-Produkt in Zukunft einen echten Marktvorsprung erlangen. Denn nach einer Studie ist belegt, dass sich durch gutes Design Produkte nachweislich besser verkaufen.

Der Weg dorthin:
Zur Auflösung der kritischen Nutzungsszenarien wurden im Rahmen der Beratung konkrete Verbesserungsvorschläge unterbreitet.
In einem ersten Schritt wurden im neuen UI-Design alle kritischen Nutzungssituation durch die Umsetzung der Verbesserungsvorschläge ausgemerzt. So wurde für das künftige Produkt die Gebrauchstauglichkeit nach ISO 9241 sichergestellt. Auf Basis des ersten Entwurfes wurde ein attraktives modernes UI-Design entworfen und in zwei Geschmacksrichtungen ausgestaltet. Daraus formierte sich dann das schlussendliche optimale UI-Design – auch unter Einbeziehung von Kundenwünschen.
Gerade moderne Software-Applikationen bedienen sich bildsprachlichen Ausdrucksformen in Form von Icons. Dafür haben wir ein eigenes Icon-Sets durchgestaltet.

Jahr: 2020

Leistung:

• Kurzberatung
• UI Design
• Icon Design
• Logo Design
• Entwicklungsunterstützung in XAML

Branche: Industrielle Reinigung

Verwendete Technologie:

• Adobe Illustrator
• Adobe XD
• Visual Studion

Neue Webseite mit WordPress für ein Maschinenbau-Unternehmen

Die Herausforderung:
Es gab keine Zugänge mehr für die alte Webseite des Unternehmens. Somit muss die Webseite von Grund auf neu erstellt werden. Das gibt Gelegenheit ein Re-Design der Seite zu machen und so einen professionellen Internetauftritt für den Kunden zu schaffen.

Der Nutzen für den Kunden:
Eine Website ist eine Art digitale Visitenkarte, deshalb ist es gerade jetzt im Zeitalter der Digitalisierung besonders wichtig eine zu haben. Natürlich zählt auch die Optik und so generiert eine professionelle Webseite, mehr Aufträge und somit auch mehr Umsatz.

Der Weg dorthin:
Wir haben die alte Webseite analysiert und die Kundenwünsche entgegengenommen. Daraufhin suchten wir eine geeignetes Theme heraus, welches den Ansprüchen genügt. Wir legten die Seite neu an, strukturierten und pflegten Inhalte ein, schließlich wurde noch Hand an die Optik gelegt und fertig. Super simpel, super effektiv und das in mehreren Sprachen.

Jahr: 2020

Leistung:

• Design WordPress Webseite
• Hosting

Branche: Maschinenbau

Verwendete Technologie:

• Adobe Illustrator
• WordPress

Erstellung eines modernen Designs für ein Admin-Tool

Die Herausforderung:
Ein Administratoren-Tool welches bis dato noch kein Design hatte, soll eine ansprechende Optik bekommen. Flach und Modern.

Der Nutzen für den Kunden:
Durch das von uns geschaffene Design, überzeugt das Produkt jetzt auch auf der visuellen Ebene und wirkt dafür um so professioneller. Die Software kann deshalb jetzt auch wesentlich besser verkauft werden.

Der Weg dorthin:
Es wurde ein Design Vorschlag gestaltet, der auf viel Gegenliebe gestoßen ist und es somit gleich an die Umsetzung ging. Ein Controlset wurde ausgearbeitet, erst im Design anschließend im XAML. Schließlich unterstützten wir bei der Integration des ausgearbeiteten Controlsets und Designs und beim Entwickeln zusätzlicher Features.

Jahr: 2020

Leistung:

• UIDesign
• Controlset
• XAML Unterstützung
• Entwicklungsunterstützung

Branche: Verwaltung

Verwendete Technologie:

• Adobe Illustrator
• Adobe XD
• Visual Studio 2019

Kurzberatung mit professionellem UI Design für eine kostenfreie Software zur Steigerung der Produktverkäufe

Die Herausforderung:
Die Aufgabenstellung im Rahmen einer siebentägigen Kurzberatung war die Konzeption eines modernen attraktiven User Interface Designs mit hoher Gebrauchstauglichkeit.

Der Nutzen für den Kunden:
Durch die neu gestaltete moderne attraktive Nutzeroberfläche kann die Firma in Zukunft mehr Produkte verkaufen und so einen echten Marktvorsprung erlangen. Denn nach einer Studie ist belegt, dass sich durch gutes Design Produkte nachweislich besser verkaufen.
Weiterhin wurde das Personal geschult um künftig eigenständig besseres UI Design zu entwickeln.

Der Weg dorthin:
Ein Workshop zum Thema UX, Usability und UI-Design wurde von uns in der Firma durchgeführt. Daraus ergab sich der Folgeauftrag einer Kurzberatung für das UI Design zu diesem Softwareprodukt.
Die Anforderungen für das Design wurde mit dem Kunden abgestimmt. Die in dem Workshop entstandenen Ergebnisse wurden mit einbezogen. Eine klare Form- und Farbsprache passend zum CI der Firma um komplexe Inhalte einfach darzustellen. Auf dieser Grundlage wurden verschiedene Screens für die Software ausgearbeitet.

Jahr: 2020

Leistung:

• Kurzberatung
• UI Design
• Icon Design

Branche: Bauindustrie

Verwendete Technologie:

• Adobe Illustrator
• Adobe XD

Erstellung eines Logos, einer kleinen Geschäftsausstattung sowie einer Powerpoint-Präsentation für ein Startup im internationalen Bausektor

Die Herausforderung:
Die Erstellung eines Logos das möglichst langfristig die Firma repräsentiert – und funktional sein soll. Ein Meeting mit der Kundin ergab das ihr Logo vor allem edel wirken und Vertrauen erwecken soll. Sie wünschte sich wertige Visitenkarten und eine Briefpapiervorlage, welche sie auch für den E-Mail-Versand nutzen kann.

Der Nutzen für den Kunden:
Das Logo ist durch Visitenkarte und Briefpapier etc. präsent und prägt somit den optischen Auftritt in der Öffentlichkeit. Ein Logo ist maßgeblich für den Erfolg einer Idee. Somit kann nun der Kunde die Identität seiner Marke, durch das von uns geschaffene Logo, etablieren.

Der Weg dorthin:
Wir entwickelten mehrere Ideen, entschieden uns schließlich für eine typografische Lösung. Die Visitenkarten ließen wir mit der Zusatzfarbe Silber veredeln. Das Briefpapier gestalteten wir in InDesign, um es schließlich in eine Word-Vorlage einzubauen welche die Kundin bequem nutzen kann. Zur Versendung CI-gerechten Informaterials stellten wir zudem eine Powerpoint Vorlage her.

Jahr: 2019

Leistung:

• Logo Design
• Visitenkarte
• Briefbogen
• Powerpoint-Vorlage

Branche: Bau

Verwendete Technologie:

• Hand-Skizzen
• Adobe Illustrator
• Adobe Indesign
• Word
• Powerpoint

Konzeption und UI-Design einer mobile App für Service-Mitarbeiter von Unternehmen der Energie-Versorger-Branche, um deren Arbeit in digitalisierte Prozesse zu überführen

Die Herausforderung:
Für die Arbeitnehmer eines Energieversorgers sollen deren Arbeitsprozesse sicherer gemacht werden. Weg von handschriftlich hin zu digital. Diese Lösung soll die Arbeitsschritte visualisieren und die Mitarbeiter hindurch leiten und bei den Arbeitsprozessen unterstützen. Zusätzlich sollen die Arbeitsschritte zuverlässig dokumentiert werden.

Der Nutzen für den Kunden:
Durch die digitale Lösung kann der Kunde nun 100 %  korrekt alle Vorfälle digital erfassen. Der Bedienprozess ist so einfach, dass die Fehlerquote gegen null reduziert wurde. Damit ist ein wichtiger Sicherheitsaspekt gewährleistet worden.

Der Weg dorthin:
Wir konzipierten eine App für iOS die Unterwegs genutzt werden kann, notfalls auch offline. Schritt für Schritt wird der Nutzer durch den Arbeitsprozess geleitet, somit lässt die App keinen Spielraum für Fehler. Dafür haben wir eigens einen Usability-Workshop mit Vertretern der Nutzergruppen abgehalten, um die App 100% bedarfsgerecht und nah am Nutzer zu konzipieren und zu gestalten.

Jahr: 2019

Leistung:

• Workshop
• UX Konzept
• Prototyp
• App-Design für iOS Tablet und Phone

Branche: Versorger

Verwendete Technologie:

• Adobe XD
• Balsamiq
• Adobe Illustrator

Gestaltung eines Logos und Icons für eine PDF-Viewer Software für Juristen

Die Herausforderung:
Der Kunde trat mit dem Wunsch an uns heran, dass eine Clementine im Logo integriert sein soll – aufgrund des Namens. Die Besonderheit des Software-Produktes ist, dass Markierungen in dem PDF gemacht werden können, welche Klebezetteln ähneln.

Der Nutzen für den Kunden:
Ein Logo ist maßgeblich für den Erfolg einer Idee. Somit kann nun der Kunde die Identität seiner Marke, durch das von uns geschaffene Logo, etablieren.

Der Weg dorthin:
Wir entwarfen verschiedene Ansätze von Flat Design bis zu sehr plastischen Varianten. Dabei entstand zusätzlich auch das Icon für die Anwendung. Der Kunde war so begeistert, dass er uns sogar Blumen mitgebracht hat.

Jahr: 2019

Leistung:

• Logo Design
• Illustration
• Icon Design

Branche: Verwalter

Verwendete Technologie:

• Hand-Skizzen
• Adobe Illustrator

Gestaltung und Entwicklung für die neue Informationsplattform Familie-und-Beruf.online.

Die Herausforderung:
Heutzutage nimmt insbesondere für Arbeitnehmer aber auch Arbeitgeber die Vereinbarkeit von Familie und Beruf einen hohen Stellenwert ein. Unser Ziel war eine Lösung die für verschiedenste Menschen sämtliche relevanten Themenfelder abdeckt. Sowohl für Unternehmen als auch Menschen im Spannungsfeld Arbeit und familiäre Verpflichtungen. Ohne langes Suchen soll Zugang zu hilfreichen Links und Adressen, Dokumenten und spezifischen Informationen bereit gestellt werden.

Der Nutzen für den Kunden:
Durch die Lösung werden nutzerfreundlich, barrierefrei und schnell sämtliche nützliche Informationen den verschiedenen Nutzergruppen auf allen möglichen Plattformen zur Verfügung gestellt.

Der Weg dorthin:
Wir konzeptionierten eine Lösung die durch unser firmeneigenes Content Management System (ConDiSys) umgesetzt wurde. Dafür recherchierten wir kompakt gebündelte Inhalte für 14 Hauptthemen. In Form von Texten, Checklisten, Adressen, Fragen und Antworten, Notwendige Dokumente und Weiterführende Links zum Thema. Weitere Features sind eine Interaktive Karte, große Sprachvielfalt (10 Sprachen), Stichwort-Suche und Chatbot für einen Frage-Antwort-Dialog.

Weitere Informationen finden Sie auf unserer Projektseite Familie-und-Beruf.online

Jahr: 2019

Leistung:

• Design
• Entwicklung

Branche: Gemeinnützig

Verwendete Technologie:

• Adobe Indesign
• Adobe Photoshop
• Adobe Illustrator
• VisualStudio

Gestaltung und Konzeption des Online Marketings für die neue Informationsplattform Familie-und-Beruf.online.

Die Herausforderung:
Online Marketing basiert als Werbung allein auf dem Medium Internet. Wir wollten ziel-gruppenspezifisch die Menschen in Dresden und später auch in ganz Sachsen ansprechen und zur Nutzung unserer Plattform bewegen.

Der Nutzen für den Kunden:
Durch die Nutzung von Online-Marketing werden unterschiedliche Zielgruppen einfach und unkompliziert erreicht. Die Nutzerzahlen sind seitdem steil nach oben gegangen.

Der Weg dorthin:
Wir konzeptionierten und gestalteten Suchmaschinenmarketing, Bannerwerbung, E-Mail Marketing, Affiliate Marketing, eine Projektwebseite und Social Media Marketing.

Jahr: 2019

Leistung:

• Design
• Konzeption

Branche: Gemeinnützig

Verwendete Technologie:

• Adobe Indesign
• Adobe Photoshop
• Adobe Illustrator
• Adobe WordPress

Konzeption, UI Design und Entwicklung einer Android App für Tablets im modernen Flat Look und mit zukunftssicherer Entwicklung in der Tiermedizin.

Die Herausforderung:
Entwicklung und Gestaltung einer Android App. Es geht hier um eine Tierarzt-Software die das besuchen und behandeln von Patienten auch mobil möglich machen soll, so dass z.B. auch Nutztiere behandelt werden können.

Der Nutzen für den Kunden:
Durch die digitale Lösung können die Nutzer nun auch Patienten mobil digital erfassen. Dadurch wurde ein wichtiges Bedürfnis der Nutzer erfüllt und der Kunde kann sein Produkt besser verkaufen.

Der Weg dorthin:
Konzeptionierung und Gestaltung der Lösung für Android. Die Android Apps wurden mit Hilfe von Xamarin entwickelt.

Jahr: 2019

Leistung:

• UX Konzept
• UI-Design App (Android)
• Icon Design
• Controlset-Ausgestaltung
• UI-Entwicklung für Android
• Entwicklung der App in C# und Xamarin

Branche: Veterinärmedizin

Verwendete Technologie:

• Balsamiq
• Adobe Illustrator
• Visual Studio
• Android Studio Projects

Gestaltung und Konzeption einer Printkampagne für die neue Informationsplattform Familie-und-Beruf.online.

Die Herausforderung:
Die Verbreitung und Vermarktung einer Informationsplattform für sehr verschiedene Zielgruppen. Wir wollten sowohl den Endverbraucher erreichen als auch Unternehmen und Städte als Kunden für unsere Plattform gewinnen.

Der Nutzen für den Kunden:
Durch die Print-Werbung kann auch eine ältere Zielgruppe erreicht werden, die im Internet unterwegs sind aber vielleicht weniger auf sozialen Plattformen. Auch z.B. Ämter und Behörden sind besser auf dem Papier-weg oder direkten Kontakt zu erreichen als über Online-Marketing. Ein weiterer Vorteil ist, das man sie sehr genau platzieren kann um die Menschen dort abzuholen, wo sie sich genau mit dem Problem beschäftigen für das wir eine Lösung bieten. Hier zum Beispiel bei Ärzten oder Behörden.

Der Weg dorthin:
Plakate, Flyer und Faltblätter die unterschiedliche Zielgruppen ansprechen als Unterstützung zum Online-Marketing. Wir entwickelten ein Konzept das die unterschiedlichen Zielgruppen der Endverbraucher (User) durch emotionale Bilder anspricht. Aber auch Informations-Faltblätter welche über das gesamte Projekt informieren und die Optionen auch für Städte und Unternehmen aufzeigen.

Jahr: 2019

Leistung:

• Design
• Konzeption

Branche: Versorger

Verwendete Technologie:

• Adobe Indesign
• Adobe Photoshop
• Adobe Illustrator

Gestaltung einer Social Media-Werbeaktion für einen groß Vertrieb von gastronomierelevanten Waren

Die Herausforderung:
Die Umsetzung von 8 verschiedene Szenarien als Storyboards für Social Media Kampagne in verschiedenen Stilen.

Der Nutzen für den Kunden:
Durch die entstehende Social Media Kampagne wird eine Markenstärkung erreicht, was zu einer höheren Popularität und dadurch mehr Umsatz für den Kunden führt.

Der Weg dorthin:
Wir entwickelten Ideen zu verschiedenen hilfreichen gastrorelevanten Themen, um die Zielgruppe direkt anzusprechen. Zum Beispiel Themen wie Upselling durch Verwendung von bekannten Marken oder anbieten von verschiedenen Zahlungsmöglichkeiten sowie Foodtrends in die Speisekarte zu integrieren so mit der Zeit zugehen und durch ganz einfache Mittel die Umsätze zu steigern.
Diese Ideen waren Grundlage für 8 Szenarien, die als kleine Filmsequenzen die Gastrotipps der Zielgruppe näher bringen sollen. Anschließend setzten wir die Ideen mit Illustrator und Photoshop als Storyboards in verschiede Stile um.

Jahr: 2019

Leistung:

• Design 8 Storyboards
• Konzeption Werbemaßnahme

Branche: Handel

Verwendete Technologie:

• Adobe Illustrator
• Adobe Photoshop

Im Zuge einer Modernisierung von Maschinen wird glücklicher Weise auch die Software modernisiert. Das Redesign stammt aus unserer Feder.

Die Herausforderung:
Ein vorhandenes Programm zum Einrichten von Spritzguss-Aufträgen soll ein Redesign bekommen. Wichtig! dabei die Größen der einzelnen Controls und deren Anordnung nicht zu verändern. Es gibt 3 unterschiedliche Varianten des Interfaces abhängig von dem genutzten Device. Es wurden 2 Themes (Light und Dark) gewünscht. Des weiteren soll aufgrund langer Ladezeiten die Performance erhöht werden.

Der Nutzen für den Kunden:
Durch die neue Gestaltung hat die Software einen moderneren Look bekommen und weiterhin durch die 2 Color-Themes an Nutzerfreundlichkeit gewonnen.

Der Weg dorthin:
Wir gestalteten das Interface modern, weg vom Gloss and Glow hin zu Flächen. Das Ganze in 2 farblichen Ausprägungen für die gewünschten Themes. Anschließend setzten wir das Design in der Lösung des Kunden um.

Jahr: 2018

Leistung:

• UI Design für Touchscreens
• Controlset-Gestaltung
• Theme-Umsetzung in XAML
• Entwicklungsunterstützung in C#

Design und Konzeption eines Information-Tools für Mitarbeiter in der Finanz-Branche

Die Herausforderung:
Es soll ein Programm entstehen, welches die Mitarbeiter standortbezogen über diverse Marketingaktionen des Unternehmens informiert. Diese Marketingaktionen können angelegt, verteilt und eingesehen werden.

Der Nutzen für den Kunden:
Durch die digitale Lösung kann der Kunde nun viel besser seinen Mitarbeitern verschiedene firmeninterne Aktionen kommunizieren. Dadurch können die Mitarbeiter besser auf Kundenwünsche eingehen was eine Verbesserung des Marketing und eine Steigerung des Umsatzes bedeutet.

Der Weg dorthin:
Wir konzipierten und gestalteten eine Lösung für Desktop und mobile App mit unterschiedlichen Szenarien für verschiedene Nutzergruppen.

Jahr: 2018

Leistung:

• UX Konzept
• Klick-Prototyp
• UI Design Desktop und Mobile

Konzeption, UI Re-Design und Entwicklung in einer Software für Windows-PCs im modernen Flat Look und mit zukunftssicherer Entwicklung in der Tiermedizin.

Die Herausforderung:
Vollständiges Re-Design eines komplexen Windows-UI und Neustrukturierung für die Nutzerfreundlichkeit. Es geht hier um eine Tierarzt-Software die alle alltäglichen Abläufe in einer Praxis erleichtern soll. Von der Patientenaufnahme über die Behandlungserfassung hin zur Inventur und stationären Aufnahme.

Der Nutzen für den Kunden:
Durch die digitale Lösung hat der Kunde alle seine alltäglichen Abläufe im Überblick. Die wichtigsten Schritte und Termine werden übersichtlich gleich zu Beginn dargestellt, so das nichts übersehen wird. Durch die vereinfachte Anzeige der komplexen Abläufe wird der Arbeitstag erleichtert. Das gestaltet die Arbeit effizienter. Deshalb kann das Personal besser auf die Patienten eingehen.

Der Weg dorthin:
Das besondere der Software ist, dass die Optik sich an herkömmlichen Patienten-Karteikarten orientiert, somit kann man mehrere Patientenakten gleichzeitig auf haben ohne den Überblick zu verlieren. Dabei entstanden über 250 hilfreiche Icons.

Jahr: 2017

Leistung:

• UX Konzept
• Prototype
• UI-Design für Software
• Icon Design
• Controlset
• XAML Unterstützung
• Entwicklung in C# WPF

Branche: Veterinärmedizin

Verwendete Technologie:

• Balsamic
• Adobe Illustrator
• Blend for Visual Studio
• Visual Studio

UI Redesign und Entwicklungsunterstützung in einer Software für Windows-PCs in der Halbleiterindustrie.

Die Herausforderung:
Vollständiges Re-Design eines komplexen Windows-UI. Es wurde ein Metallic Look gewünscht der mehr Tiefe bzw. Gloss und Glow hat.

Der Nutzen für den Kunden:
Durch unsere optischen Verbesserungen inklusive Animationen hat die Anwendung deutlich an User Experience gewonnen. Des weiteren haben die neu eingebauten Features den Nutzen der Software gesteigert, sodass das Produkt des Kunden attraktiver für den Endverbraucher ist.

Der Weg dorthin:
Wir haben dieses Projekt mit vielen Verläufen und Schatten überarbeitet um den gewünschten Look zu kreieren. Zusätzlich wurde ein Pixelshader programmiert um die Buttons in der gewünschten Optik zu erhalten.

Jahr: 2018

Leistung:

• UI-Design für Software
• Controlset
• XAML Unterstützung
• Entwicklung in C#

Branche: Halbleiterindustrie

Verwendete Technologie:

• Adobe Illustrator
• Blend for Visual Studio
• Visual Studio

UI – Re-Design und UX-Analyse einer vorhandenen Software

Die Herausforderung:
Das Design einer bestehenden Software soll auf BITV und UX-Kriterien überprüft und anschließend entsprechend angepasst werden.

Der Nutzen für den Kunden:
Durch das moderne Re-Design der Software wurde die Benutzerfreundlichkeit verbessert. Nun kann der Nutzer leichter damit umgehen und die Abläufe konnten effizienter gestaltet werden.

Der Weg dorthin:
Analyse der Software und anschließende Neuordnung der Inhalte und Re-Design der Anwendung.

Jahr: 2019

Leistung:

• UI-Design
• Beratung in BITV
• Icon-Design

Branche: Ausbildung

Verwendete Technologie:

• Adobe Illustrator
• Balsamiq

UI-Design und UX-Design einer Software für Windows PCs zur Messung und Prüfung von Carbonfaser-Werkstoffen

Die Herausforderung:
Die Prüfsoftware für Carbonfaser-Werkstoffe soll ein Re-Design inklusive neuer UX-Konzipierung bekommen. Eine Anforderung war, der Wunsch nach verschiedenen Farb-Themes. Des weiteren haben wir beim Icon-Design unterstützt.

Der Nutzen für den Kunden:
Durch das neu entstandene UX-Konzept kann der Nutzer nun besser mit der digitalen Lösung umgehen. Die einfache Struktur und das moderne Design machen die Software leichter bedienbar.

Der Weg dorthin:
Entstanden ist eine moderne und flache Lösung passend zum Firmenauftritt mit Linien Icons. Das Design gibt es in 2 verschiedenen Farbausprägungen in Hell und Dunkel.

Jahr: 2018

Leistung:

• UX Konzept
• UI Design
• Icon Design
• Controlset
• XAML Unterstützung

Branche: Industrie

Verwendete Technologie:

• Adobe Illustrator
• Visual Studio
• Blend for Visual Studio

Verbesserung der Shopping-Experience einer Shop-Webseite für technische Bauteile durch UX-Konzeption, IA-Prototyp und UI-Design.

Die Herausforderung:
Im vorhandenen Shop fanden sich die Nutzer wenig zurecht und wichtige Informationen wurden nicht gefunden. Anstelle von gewünschten Käufen war die Ausstiegsquote recht hoch. Zudem sah das gesamte Produkt altmodisch aus.

Der Nutzen für den Kunden:
Mithilfe eines komplett neu durchdachten Konzeptes und eines modernen Designs, wird dem Nutzer eine einfache Software geboten. Dadurch findet der Nutzer sich im Shop schnell zurecht und bedient das Produkt gern.

Der Weg dorthin:
Die gesamte Shopping-Experience wurde neu durchdacht über einen korrekten Usability-Prozess vom Startpunkt des Nutzer und dessen Kontext aus. An Personas lang wurde ein Prototyp ausgestaltet, der sowohl technisch als auch in der Ausgestaltung alle Prinzipien guter Usability entspricht. Dieser bildete die Grundlage für ein deutlich verbessertes UI-Design, was responsitiv auf Smartphones und Desktop-PCs ausgestaltet wurde.

Jahr: 2018

Leistung:

• UX Konzept
• responsives Web-Design
• Icon Design von über 100 Icons
• Controlset-Ausgestaltung
• Styleguide für die HTML-Entwickler

Branche: Vertieb

Verwendete Technologie:

• Word / Powerpoint
• Balsamiq
• Adobe Illustrator

Redesign einer vorhandenen Bestandsoftware im Segment des Energie-Tradings sowie aktive Unterstützung in der UI-Entwicklung in XAML.

Die Herausforderung:
Ein vorhandenes Programm soll von Grund auf optisch nach Prinzipien der ISO 9241 neu strukturiert werden, um die Bedienbarkeit und nachhaltige Nutzung zu verbessern. Das Programm kann in mehreren Fenstern gleichzeitig laufen und hat unterschiedliche Nutzergruppen mit unterschiedlichen Tätigkeiten daran.

Der Nutzen für den Kunden:
Durch das neue UX-Konzept und das dazugehörige Re-Design ist eine Softwarelösung entstanden deren Bedienbarkeit nachhaltig verbessert ist. Der Nutzer findet schneller in seine Arbeitsabläufe und versteht intuitiv wie er das Programm bedienen muss.

Der Weg dorthin:
Wir konzipierten eine Lösung für Windows Desktop PCs mit einem Hauptfenster, welches zusätzlich offene Fenster verwaltet. Unter anderem mit Hilfe von großer Typografie und klaren Icons, sowie strukturierten Inhalten, um diese besser und schneller zu verstehen. Verschiedene Farbigkeit grenzen die Nutzergruppen voneinander ab.

Jahr: 2017

Leistung:

• UX Konzept
• UI Design Desktop
• Prototype
• Icon Design
• Entwicklungsunterstützung in XAML

Konzeption und UI-Design einer mobile App für Mitarbeiter von Unternehmen der Medizin-Logistik-Branche, um deren Arbeit in digitalisierte Prozesse zu überführen

Die Herausforderung:
Eine Software für Probenentnahmen soll ein Design inklusive UX-Konzipierung bekommen. Sie soll den ganzen Aufgabenprozess darstellen und die Aufnahme der Werte erleichtern.

Der Nutzen für den Kunden:
Durch die neu Konzipierung der Aufgabenprozesse wird der Nutzer durch die Arbeitsschritte begleitet. Er kann nun 100 %  korrekt alle Proben digital erfassen. Der Bedienprozess ist einfach gestaltet und reduziert die Fehlerquote gegen null.

Der Weg dorthin:
Begonnen bei der Erfassung des Nutzungskontextes der App, Nutzeranalyse und Konzeptionierung des Prototypen, über Erstellung der Designs, Nutzertests bis hin zur Icon-Erstellung.

Jahr: 2017

Leistung:

• UX Konzept
• Prototype
• UI-Design für Software
• Icon Design
• Controlset

Branche: Medizintechnik

Verwendete Technologie:

• Adobe Illustrator
• Balsamiq
• Visual Studio

Konzeption, UI Design und Entwicklung einer Software-Lösung für PCs im modernen Look und mit zukunftssicherer Entwicklung im Segment des Personennahverkehrs.

Die Herausforderung:
Ein vorhandenes Programm soll von Grund auf optisch nach festen Prinzipien der ISO neu strukturiert werden. Re-Design, Konzeption und Entwicklung einer Software die die Verwaltung von komplexen Abläufen im Personennahverkehr einfacher und übersichtlicher macht. Alles freundlich und modern verpackt in gutem Design. Einfach, verständlich und effektiv um Prozesse schneller und benutzerfreundlicher zu gestalten.

Der Nutzen für den Kunden:
Durch die Software ist eine einfache Verwaltung von komplexen Inhalten und Prozessen möglich geworden. Die Bedienbarkeit und nachhaltige Nutzung wurde verbessert, wodurch Prozesse schneller ablaufen können und die Arbeit effektiver wird.

Der Weg dorthin:
Konzeptionierung und Gestaltung der Lösung für PCs und Tablets. Begonnen vom Usability-Test über Logo-Gestaltung, UI-Design bis hin zur Integration und Entwicklung der Software.

Jahr: 2019

Leistung:

• Usability-Test
• UX Konzept
• UI Design
• Logodesign
• Controlset
• XAML Unterstützung
• Entwicklung in C#

Branche: Personenverkehr

Verwendete Technologie:

• Adobe Illustrator
• Balsamiq
• Blend for Visual Studio
• Visual Studio

kurze Zusammenfassung

Die Herausforderung:
Text

Der Nutzen für den Kunden:
Durch die digitale Lösung kann der Kunde nun 100 %  korrekt alle Vorfälle digital erfassen. Der Bedienprozess ist so einfach, dass die Fehlerquote gegen null reduziert wurde. Damit ist ein wichtiger Sicherheitsaspekt gewährleitet worden.

Der Weg dorthin:
Text

Jahr: 2017

Leistung:

• Leistung
• Leistung
• Leistung

Branche: Personenverkehr

Verwendete Technologie:

• Adobe Illustrator
• Balsamiq
• Visual Studio

kurze Zusammenfassung

Die Herausforderung:
Text

Der Nutzen für den Kunden:
Durch die digitale Lösung kann der Kunde nun 100 %  korrekt alle Vorfälle digital erfassen. Der Bedienprozess ist so einfach, dass die Fehlerquote gegen null reduziert wurde. Damit ist ein wichtiger Sicherheitsaspekt gewährleitet worden.

Der Weg dorthin:
Text

Jahr: 2016

Leistung:

• Leistung
• Leistung
• Leistung

Branche:
Verlagswesen

Verwendete Technologie:

• Adobe Illustrator
• Balsamiq

Gestaltung von UI Design Variationen im Zahntechnischen Bereich

Die Herausforderung:
Text

Der Nutzen für den Kunden:
Text

Der Weg dorthin:
Text

Jahr: 2016

Leistung:

• Design
• Entwicklung

Branche: Gemeinnützig

Verwendete Technologie:

• Adobe Indesign
• Adobe Photoshop
• Adobe Illustrator