Projektbild Mobile Design Hep Startseite
scroll down

Handwerk

  • Konzept & Design
  • Development

hep Verlag Webshop

Der hep Verlag engagiert sich in Qualität und Innovation im Bildungsbereich. Seit der Gründung im 2000 werden Lehrmittel in verschiedenen Formaten für alle Unterrichtsstufen entwickelt; hep bietet hochwertige Lehrmittel zugunsten eines nachhaltigen Bildungserfolgs von Lernenden und Studierenden an. Ein wichtiges Anliegen ist, dass erweiterte Inhalte der Lehrmittel beworben und visuell spannend vermittelt werden können.

30

Komponenten (Websitebausteine)

4'000 +

Produkte im Shop

85'300

Eingelöste Coupons seit 01. Juli 2021

Auftrag

Die neue, nutzerfreundliche Webseite soll das breite Angebot zeitgemäss und ansprechend im Web präsentieren. Dabei stehen mehrere Gedanken im Vordergrund: Der Online Shop soll die Vielfalt an Produkten simpel und zugänglich anzeigen. Zudem soll sie als zentrale Informationsplattform für die verschiedenen Produkte und ihre Formate fungieren. Für den hep Verlag soll sie auch als wichtiges Marketingtool dienen.

Zielsetzung

  • Vielfältiger Produktkatalog mit über 4000 Produkten darstellen

  • Detaillierte Informationen zu Produkten und Angeboten vermitteln

  • Einfache Bedienung und Flexibilität der Webseite für die hep-Mitarbeitenden

  • Modulare Elemente für eine flexible Anzeige der Inhalte

  • Aktuelle Themen & Aktionen in verschiedenen Formen präsentieren

  • Gute Accessibility trotz erhöhter Komplexität

Komponentenbasierte Produktseiten Hep

Herausforderungen

Die grösste Herausforderung bietet der Produktkatalog mit über 4000 Produkten. Diese werden im PONDUS, dem ERP des hep Verlags verwaltet und abgebildet. Damit der Inhalt nicht doppelt gepflegt werden muss, haben wir das ERP mittels Schnittstelle in den neuen Online Shop integriert. So können Produkte und deren Attribute flexibel auf der Webseite dargestellt werden. Zusätzliche Komplexität entsteht durch diverse verschiedene Produktarten (Buch, E-Lehrmittel, PDF, ebook), Verknüpfungen zu Partnern (beook und myskillbox) und zahlreichen Features wie dem Nutzen von Coupons & Gutscheinen, komponentenbasierte Landingpages und Produktseiten.

Lösungsprozess

In mehreren Workshops wurde das Konzept mit Hilfe von Wireframes, die neue Seitenstruktur und die Anforderungen an die Webseite definiert. Basierend auf dem Corporate Design des hep Verlags wurde ein ansprechendes und benutzerfreundliches User Interface Design kreiert.

Während mehreren Monaten wurde die neue umfangreiche Webseite mit dem CMS Statamic umgesetzt. Die Webshop-Anbindung wurde mit dem Laravel Framework realisiert.

Komponentenbasierte Landingpages von Hep

Flexible Komponenten für optimale Bedienbarkeit

Mit fast 30 einzigartigen Komponenten (Website-Bausteine) und 9 Header Styles kann das Team des hep Verlags verschiedene Landingpages selbstständig aufbauen. Die Flexibilität des CMS bietet dabei eine individuelle Gestaltung verschiedener Angebote, Informationen und Produkte. Der modulare Aufbau des CMS ermöglicht eine intuitive Erfassung von verschiedensten Inhalten. Die Komponenten sind responsive. Das heisst, dass die Inhalte auf verschiedenen Screen-Grössen (Smartphone, Tablet, Desktop usw.) ideal aussehen, ohne dass das hep Team etwas anpassen muss. So finden ihre einzelnen Zielgruppen inhaltlich hochwertige Lehrmittel mit einer breiten Palette an nützlichen Informationen an einem Ort.

Anbindung Pondus

Die technisch komplexe Schnittstelle zu Pondus stellt einen hohen Mehrwert für den hep Verlag dar. Die Daten der Produkte werden direkt aus dem ERP in den Webshop importiert und automatisch zu einer schönen Produktseite zusammengestellt. Das Produkt kann danach in Statamic (CMS) von hep mit Daten bzw. Komponenten, welche nicht im ERP vorhanden sind, angereichert werden. Somit werden Produktseiten ohne grossen Aufwand automatisch erstellt.

Coupons & Schnittstellen

Im Fall von hep stellen Coupons digitale Codes dar, welche Zugriff auf ein Produkt erlauben. Diese sind einzigartig; sie können nur einmalig eingelöst werden. Nach dem Einlösen werden sie mit den Logindaten von Usern verknüpft & dienen verschiedenen Zwecken:

Produkte können online für andere Personen erworben werden. Lehrpersonen können so z.B. für eine ganze Klasse die online Version eines Fachbuches erwerben und den Schüler:innen weitergeben. Das vereinfacht die Organisation.

Coupons, welche auf anderen Plattformen gekauft werden oder in einem Buch enthalten sind, können über die Webseite eingelöst werden. Das erlaubt eine flexible Nutzung für verschiedene Bedürfnisse der Lernenden.

Dafür wurde je eine Schnittstelle zu beook & myskillbox eingerichtet. Mit einem Coupon wird das Produkt bei den Partnerorganisationen gutgeschrieben und kann so verwendet werden. Das Login bleibt jeweils dasselbe, und die eingelösten Coupons werden so erkannt.

Im CMS lassen sich die eingelösten Coupons einfach verwalten und es ist ersichtlich, was zu welchem Zeitpunkt eingelöst und bezogen wurde.

Schritte für Schritt wie man einen Coupon einlöst

mySkillbox

mySkillbox ist ein Angebot des hep Verlags in Zusammenarbeit mit der Eidgenössischen Hochschule für Berufsbildung (EHB). mySkillbox ist eine online Lernplattform für «ABU»-Lektionen (allgemeinbildender Unterricht). Die Schnittstelle bietet die Möglichkeit, sich mit einem hep-Login auf der Plattformen anzumelden. Die Lizenzen für mySkillbox können direkt über die hep Webseite bezogen werden — von Lehrpersonen & Lernenden.

beook

beook ist eine online Lernumgebung und Partnerorganisation vom hep Verlag. hep bietet Nutzer:innen verschiedene Produkte, welche mit einem Coupon Codes bei beook eingelöst werden können. Der Code ist entweder in einem Buchumschlag aufgedruckt oder kann separat als eLehrmittel erworben werden. Nutzer:innen können sich entweder mit den Logindaten des hep Benutzerkontos bei beook anmelden oder den Coupon in der beook-App direkt einlösen. Mit einer API-Schnittstelle greift beook auf die Webseite des hep Verlag zu und erkennt, welche Coupons eingelöst wurden. So haben Nutzer:innen auf der beook Lernumgebung Zugriff auf die eingelösten Produkte (E-Lehrmittel) und können direkt mit diesen arbeiten.

Weitere Funktionen

Die Webseite stellt neben den Produkten auch den hep Verlag selbst vor und gibt eine Übersicht über angebotene Dienstleistungen. So dient zum Beispiel eine sympathische Darstellung der Mitarbeitenden der Präsentation des hep Verlags als Arbeitgeber.

Die Zusammenarbeit hat eine längerfristige Partnerschaft hervorgebracht. Der hep Verlag setzt seit der Umsetzung der Webseite auf novu als digitale Partneragentur. So werden laufend Weiterentwicklungen, Ergänzungen und Anpassungen vorgenommen.

Rahel Wenger Portrait
Rahel Wenger
Leitungsteam und Marketing

novu vereint technisches und grafisches Know-how auf höchstem Niveau. Das Team von novu hat schnell verstanden, was für uns und unsere Kunden wichtig ist und wir haben jetzt eine Webseite, die genau unseren Wünschen entspricht. Sie ist flexibel gestaltbar und technisch vorausschauend aufgebaut, sodass wir neue Projekte und Erweiterungen einfach angehen können. Wir haben uns beim anspruchsvollen Relaunch unserer Webseite gegenseitig zu Höchstleistungen angespornt und trotz stressigem Endspurt hatte es auch immer Platz für den einen oder anderen Joke.

Referenzen

Arbeite mit der Berner Webagentur

Du willst mit uns zusammenarbeiten?

Ja, ich will.