Relaunch mit neuem Design-System

Redesign News-Portal der suedostschweiz.ch

Für ein Newsportal ist es besonders wichtig, dass sich Leser*innen über diverse Bildschirmgrössen informieren können. Klares reduziertes Design, gute Lesbarkeit, sowie eine gute Benutzerführung über diverse Endgeräte hinweg, stehen dabei im Fokus. Wir durften das regionale News-Portal des Medienhaus Somedia in Chur bereits zum zweiten Mal beim Relaunch begleiten.

Neues Kleid mit guter Lesbarkeit

Seit 2016 dürfen wir das Medienhaus mit unserer Fachkompetenz UX Design unterstützen. Im 2017 ging zum ersten Mal die Plattform mit einem komplett neuen Konzept und visuellen Kleid online. Dabei war vor allem der Aufbau der Startseite und die Zugänglichkeit auf diversen Bildschirmgrössen (Responsive Design) der Fokus. Knapp 4 Jahre später erhält suedostschweiz.ch einen frischen, modernen neuen Look. Durch die optimierte Darstellung ist das Portal noch lesefreundlicher geworden und bietet Leser und Leserinnen mehr Raum und Fokus für eine noch bessere Orientierung.

suedostschweiz.ch auf Tablet und Mobile

Ein Design-System für alle mitwirkenden

Für den Relaunch haben wir nicht nur ein neues User Experience Design gestaltet, sondern ein komplettes Design-System entwickelt. Mit dem modularen Design-System ist das komplette Konzept organisiert und Zukunftssicher aufgebaut. Alle Elemente sind dokumentiert und können von jedem Mitwirkenden als Referenz verwendet werden.

Was ist ein Design System?

Statt Corporate-Design-Manuals kommen heute Design-Systeme zum Einsatz, da sie viel flexibler sind. Ein Design-System ist eine Sammlung von wiederverwendbaren Komponenten mit klaren Regeln, Prinzipien und Einschränkungen für die Designentwicklung eines Unternehmens. Neben allgemeingültigen Prinzipien gehören dazu auch Code- und UI-Komponenten. Die Folge sind feste Vorgaben für das Design und die Möglichkeit zur Wiederverwendung diverser Design-Elemente.

Warum ein Design System?

  1. Es steigert die Qualität und Konsistenz der Marke
  2. Reibungslose Übergabe an Designerinnen und Entwicklerinnen
  3. Spart Zeit und Ressourcen bei der UmsetzungScreenshot Styleguide

Neue User Journey für Abo-User*innen

Paid-Artikel

Ein weiteres Thema, was wir zusammen mit Südostschweiz Medien behandeln durften, war die Benutzerführung für Artikel hinter der Paywall (Kostenpflichtige Artikel). Leser*innen sollten einen Abo-Artikel direkt und mit wenigen Schritten über ihr Login kaufen können. Dies sollte ausserhalb des Abo-Shop-Prozesses passieren, damit die Schritte von kostenpflichtigen Artikel nicht den Lesefluss allzufest unterbrechen. Mit zwei Klicks können Leser*innen heute die Artikel bezahlen und weiterlesen.

Screenshot Paid Artikel

Bessere Conversion im Aboshop

Ein weiteres grosses Redesign war die Neukonzeption des Aboshop von Somedia im 2019, wo wir den gesamten Kauf-Prozess eines Abonnements der verschiednen Formate; Digital, E-Paper sowie der Printausgabe neu konzipiert und gestaltet haben. Der Fokus bei diesem Prozess war, die Leser*innen effizient durch den Aboshop zu führen, damit weniger Support-Anfragen anfallen und somit die Verkaufsabschlüsse erhöht werden. Heute kann ein Website Besucher*in die verschiedenen Angebote und Inhalte nebeneinander vergleichen und das entsprechende effizient bestellen.

Aboshop als Tablet und Mobile Ansicht

 

 

Art
Konzept & UX Design für das Online News Portal

Kunde
SOMEDIA Press AG

Leistungen
Design

Website
https://www.suedostschweiz.ch

Startseite suedostschweiz.ch
Screenshot Paid Article
Tablet ansicht von südostschweiz News Portal
Mobile Ansicht Südostschweiz News Portal

Ringier Advertising Website & Web-App

73 Brands, über 100 Werbeformate, Millionen von Nutzer:innen. Ringier Advertising vermarktet die Medientitel und Marktplätze von nationaler Strahlkraft von Ringier, Ringier Axel Springer und Swisscom (bluenews, local.ch, search.ch) sowie weiteren Partnern. Ringier Advertising ist die Ansprechpartnerin für die Werbekund:innen der Ringier AG.Sie unterstützen Werbeagenturen, Grosskunden und auch NGOs bei der Suche nach passenden Marken und …

how.fm UX, Design & Development

how.fm bietet digitale Dienstleistungen im Bereich von Trainingssoftware in der Logistik-Branche an. Unser Team in Deutschland betreut how.fm mit Design und Entwicklungsarbeiten rund um deren Websites, Kampagnen und Landingpages.Die Software von how.fm dokumentiert Prozesse digital und führt zu einer automatisierten Einarbeitung von Mitarbeiter*innen. Das SAAS (Software-as-a-Service) Produkt beinhaltet videobasierte Schulungen in vielen Sprachen die interaktiv …

Kanton Zürich, Bildungsdirektion Web Applikation

Zusammen mit der Bildungsdirektion Kanton Zürich, haben wir ein Portal zum Thema Berufswahl konzipiert und umgesetzt, welches neu auch ausserhalb der Schule für ein breiteres Publikum wie Jugendliche, Eltern, Lehrpersonen sowie Berufsberater:innen zugänglich ist. Das Portal läuft technisch über ein sogenanntes „Headless“-CMS, das sich Daten aus unterschiedlichen Quellen über verschiedene Schnittstellen einholt, sodass die Inhalte …

Content Hub Migros Bank

Migros Bank Online Magazin & Content Hub

Das Corporate Design der Migros Bank hat ein Rebrand erhalten und wir haben den aktuellen Blog sowie den Content Hub entsprechend adaptiert. Wo vorher vor allem grün und weiss vorhanden war, ist nun eine Diversität an fröhlichen Farben zu finden.Seit 2015 begleiten wir das Content Marketing Team der Migros Bank. In dieser Zeit haben wir …

Nahrin AG Konzept, UX & UI Design

Für das Schweizer Familienunternehmen Nahrin haben wir den Onlineshop neu gestaltet, mit Fokus auf ein einfaches und intuitives Shoppingerlebnis.Die Website von Nahrin ist ein wichtiges Standbein für den Verkauf ihrer natürlich hergestellten Bouillons, Gewürze und Nahrungsergänzung. Die Anforderungen für das Redesign waren, dass es für Benutzer:innen einfacher wird, die passenden Nahrin Produkte zu finden und …

Screenshot of Boris Baldinger Homepage

Boris Baldinger Website

Boris Baldinger ist ein Spezialist für Personal Branding und Business-Fotografie. Menschen werden bei ihm zu Persönlichkeiten, Charakterköpfe zu Brands. In seinen Fotos reflektiert er, wofür jemand steht und arbeitet. Seine ursprüngliche Website aus dem 2010 widerspiegele jedoch nicht mehr seinen offenen Charakter und seine hoch qualifizierte Arbeit. Wir durften mit einem Website-Relaunch seine Persönlichkeit zum …

Pro Helvetia Online Art Magazin

Um die Zielgruppe der Kulturschaffenden abzuholen, brauchte es eine Website mit Besonderheiten und Überraschungselementen. Ein einzigartiges Online Magazin mit zahlreichen Animationen und aufwändigen Styles. Das brandneue Pro Helvetia Magazin – V/A – Various Artists – ist ein wahres Erlebnis.

Pro Helvetia Website

Im engen Austausch mit der Designagentur Velvet und unserem langjährigen Kunden Pro Helvetia setzten wir die digitale Bücherplattform um. Es entstand eine neue, individuelle WordPress Seite, welche sich innerhalb der allgemeinen Pro Helvetia Multisite befindet.

Mica Insurance Website

Wir durften Mica Insurance – den neuen Anbieter von Versicherungen und Sensorik – beim Umsetzen ihrer Online-Strategie unterstützen und haben für die Website die Design-Sprache entwickelt und anschliessend das Design und die Website umgesetzt.Mica gestaltet Versicherungen so, dass sie zeitgemäss sind. Digital. Einfach. Smart. Das Ziel ist es, Sicherheit und «Peace of Mind» zu bieten. …

hostettler autotechnik ag Website & Online-Buchung

Für autofit – eine Garagengruppe knapp 300 Garagen in der ganzen Schweiz verteilt – haben wir 2019 die neue Website umgesetzt und begleiten den Kunden auch weiterhin.

Humanis AG Website

Seit über 30 Jahren bringt die Humanis AG Menschen und Firmen passend, gekonnt und nachhaltig zusammen.Wir haben dem Unternehmen ein neues Website-Design auf Basis des existierenden Corporate Designs erstellt und die Website mit WordPress und Custom Blocks für den Block-Editor (Gutenberg) umgesetzt.

schilling partners ag Website

schilling partners ist eines der etabliertesten Schweizer Executive-Search-Unternehmen mit mehr als 30 Jahren Erfahrung.Wir haben dem Unternehmen ein neues Website-Design auf Basis des existierenden Corporate Designs erstellt und die Website mit WordPress und Custom Blocks für den Block-Editor (Gutenberg) umgesetzt.