Pushpay

Header image of Pushpay case study

Pushpay

Pushpay erstellt Apps und bietet Lösungen, um Spenden für wohltätige Zwecke zu vereinfachen. Das im Jahr 2011 in Neuseeland gegründete Pushpay dient vor allem Kirchen, die ihren Mitgliedern ermöglichen möchten, direkt per Smartphone zu spenden.

Services:
wordpress
design

Pushpay hat zwei unterschiedliche Websites entwickelt: Pushpay.com als High-Tech-Website für das Pushpay Produkt; und eChurch.com als Marketing-Plattform mit Ausrichtung auf US-amerikanische Kirchen. Während der Bemühungen des digitalen Wandels im Frühling 2018 hat das Pushpay-Team die Entscheidung getroffen, die beiden Plattformen zu vereinen und die verschiedenen Marken miteinander zu verknüpfen. Im Juni 2018 kontaktierte das Unternehmen FFW. Das Pushpay-Team wollte die Arbeiten für ein Event im August 2018 abschließen und FFW nahm sich dieser Herausforderung gerne an. Die Kombination aus der Kooperation vor Ort sowie täglichen Checks ermöglichste es uns, in Echtzeit am Design und der Entwicklung der Website zu arbeiten und diese fristgerecht bereitzustellen.

Die Herausforderung

    • Die Vereinigung von zwei unterschiedlichen Markenidentitäten mit unterschiedlichen Nutzergruppen (High-Tech und Religion) in einem Design
    • Die Vermittlung der „Pushpay Story” mit Fokus auf Kundenerfahrungen aus dem wahren Leben, um aufzuzeigen, wie dank Pushpay Ziele erreicht werden konnten, die zuvor unmöglich erschienen
    • Der Bedarf an einer sicheren Lösung, um die persönlichen Informationen der Nutzer zu schützen und diese gleichzeitig mit dem Pushpay Produkt zu integrieren
    • Die Bereitstellung einer Website, welche die hochwertige Pushpay Lösung beschreibt und bewirbt, während gleichzeitig die Werte/Kostenvorteile des Premium-Preises dargestellt werden
    • Die Vereinigung verschiedener Plattformen führte zu einmaligen Herausforderungen in Sachen Website-Struktur und Website-Design

    Die Lösung

    • Eine hochwertige Pushpay-Nutzererfahrung reflektiert die Qualität und den Wert des Produkts, während gleichzeitig mehr relevante Leads generiert werden
    • Das komponentenbasierte Design ermöglicht ein optimiertes Branding, das Präsentieren der Marke sowie ideale Nutzerreisen
    • Eine statische Website auf dem Amazon Web Server stellt sicher, dass das WordPress CMS das Pushpay Produkt oder dessen Daten nicht berührt
    • Spezifische URL-Weiterleitungsmuster erlauben den Nutzern, nahtlos zwischen der Produkt- und der Marketingwebsite von Pushpay zu navigieren, ohne Sicherheitsrisiken einzugehen
    Unser Ziel bestand darin, die Marken Pushpay und eChurch miteinander zu verknüpfen. Mithilfe von FFW haben wir dies (und noch viel mehr) in die Reihe bekommen. Endlich konnten wir unsere Mission der Wohltätigkeit und Gemeinschaftsdienlickeit mit einer noch größeren Nutzergruppe teilen. Das wäre ohne diese neue Plattform undenkbar gewesen. Anthony Gomes - VP, Corporate Communications bei Pushpay
    Images of Pushpay home page

    Die Verknüpfung zweier verschiedener Marken mit einem Design

    Pushpay genoss in Neuseeland einen hohen Bekanntheitsgrad und wurde von dortigen Kirchen genutzt, um Spenden durch Kirchenmitglieder zu ermöglichen. Als das Unternehmen jedoch in die USA expandierte, stoß es auf Schwierigkeiten. Die Plattform trug nun den Namen eChurch, um den Zweck der Pushpay-Plattform auf dem digitalen Markt für Spenden hervorzuheben. Dank dieser Identität konnte Pushpay wachsen und expandieren. Dem Pushpay-Team wurde jedoch klar, dass es sowohl auf Kirchen als auch weltliche Organisationen angewiesen war, um dauerhaft effektiv Fundraising betreiben zu können. Nicht ohne Grund entschloss sich das Unternehmen dazu, die besten Komponenten von Pushpay und eChurch in einem Redesign miteinander zu verknüpfen.

    Um das Resdesign von Pushpay fristgerecht umzusetzen, arbeiteten Pushpay und FFW gemeinsam vor Ort an umfangreichen Designänderungen, wodurch die Arbeit von sonst mehreren Wochen an nur wenigen Tagen absolviert werden konnte. Das Team von FFW besuchte den Unternehmenssitz von Pushpay, ließ sich im Konferenzzimmer nieder und besprach vor Ort mit dem Unternehmen das neue Design. Dabei trafen sich beide Teams immer wieder nach einigen Stunden, um Feedback auszutauschen und das Design noch weiter zu optimieren. Die direkte Zusammenarbeit zwischen den beiden Unternehmen verkürzte den Designprozess und endete in einem perfekten Layout und Branding, welche die besten Elemente der Pushpay Marke mit der Wärme und dem Wohltätigkeitsgedanken von eChurch kombinieren.

    Design of different Pushpay pages

    Das Team von FFW erstellte für Pushpay ein Design-System bestehend aus visuellen Komponenten (samt Typographie, Ikonographie, Bildern, Farben, Layout, Textur und Gestaltung), das ein zusammenhängendes Bild ergab. Das Design-System ist nicht nur visuell, sondern auch technisch optimiert und verwendet prägnante Motive und ein klares Design, um auf den verschiedenen Geräten das Beste der Pushpay Marke hervorzuheben.

    Der persönliche Touch ist ein zentrales Element des neuen Pushpay-Designs. Pushpay bietet nun eine vollkommene Lösung für Spenden. Das Produkt ist so konzipiert, dass die Organisationen mit den Spendern und Gemeinschaften noch enger im Kontakt stehen und so mehr bewirken können. Pushpay bietet ein hochwertiges Produkt zu Premium-Preisen, die gegenüber den Nutzern gerechtfertigt werden mussten. Das Pushpay Produkt verfügt über zahlreiche glaubwürdige, nachvollziehbare und kontrollierbare Erfolgsgeschichten. Dies veranlasste das Team von FFW dazu, auf jeder Seite der Website bewegende Kundenbeispiele und Nutzererfahrungen zu präsentieren. Kundenmeinungen im Text- und Videoformat sind an strategisch günstigen Positionen platziert, um den Mehrwert des Pushpay Produkts vorzuweisen. Die Nutzer sind so in der Lage, sich anhand der Erfolgsgeschichten ein Bild davon zu machen, wie sie selbst von Pushpay profitieren könnten.

    Pushpay design guide displayed on a laptop screen


    Von zwei Websites zu einer einzelnen umfangreichen Plattform

    Vor dem Redesign war Pushpay über zwei digitale Plattformen verteilt: Pushpay.com als High-Tech-Website für das Pushpay Produkt; und eChurch.com als Marketing-Plattform mit Ausrichtung auf US-amerikanische Kirchen.

    Wegen des Brandings und der technischen Trennung beider Plattformen hatte das Team von Pushpay große Schwierigkeiten damit, Inhalte zwischen den beiden Marken zu teilen und den Nutzern konsequent zu helfen. Durch das Verknüpfen der beiden Marken stellte Pushpay sicher, dass sämtliche Inhalte, die gesamte Lead-Generation sowie Produktinformationen an einem Ort gebündelt und nachvollzogen werden konnten. Und dennoch erlebten alle Nutzer ein einheitliches Markenerlebnis.

    Um das Produkt einer größeren Zielgruppe anzubieten und das Branding und den Support zu optimieren, integrierte das Team sowohl Pushpay.com als auch eChurch.com auf einer Plattform. Das Ziel bestand darin, die beiden völlig unterschiedlichen Plattformen mit ihren völlig separaten Strukturen, Brandings und Marketingmaterialien zu analysieren und die besten Elemente beider Websites zu einer einzigen umfangreichen und ansprechenden Plattform zu kombinieren.

    Das Pushpay-Team verlangte eine Website mit vielseitigen Publishing- und Redaktionsfunktionen, weshalb sie sich bei ihrer neuen Plattform für WordPress entschieden haben. Im Anschluss wurde ein Atomic Design System entwickelt, das dem Pushpay-Team dabei helfen sollte, einheitliche visuelle sowie mitreißende Inhalte zu verwenden. Die Resultate der Nutzerforschung und der Entdeckungsphase wurden genutzt, um ein neues Website-Design und eine ansprechende Informationsarchitektur zu finden, mit denen die Nutzer Aufgaben leichter bewältigen und besser an wichtigen Kontaktpunkten mit der Website interagieren konnten (basierend auf Arrival Mindsets und dem Abschluss von High-Value Tasks).

    Das neue Atomic Design betont, dass Pushpay nicht ausschließlich Kirchen dient, sondern auch für weltliche Wohltätigkeitsorganisationen und NGOs in Frage kommt. Das neue Branding von Pushpay wurde sowohl von den Kirchen als auch weltlichen Organisationen gut aufgenommen. Die neue WordPress-Plattform und das Atomic Design halfen dem Pushpay-Team, hochwertigere, ansprechendere und relevantere Inhalte zu veröffentlichen.

    Die neue Pushpay-Plattform ist ein Paradebeispiel für den Erfolg ineinandergreifender Technologien:

    • WordPress vereinfacht das Content-Management
    • Ein Flynt-Framework in WordPress ermöglicht das komponentenbasierte Design für die Website
    • Pattern Lab handhabt das Theming jedes einzelnen Blocks und jeder einzelnen Seite
    • Ein Simply Static WordPress Plugin erlaubt die reibungslose Generierung statischer Website-Inhalte, die dann auf einen Amazon Web Services Server hochgeladen und dem Nutzer präsentiert werden.
    Images of Pushpay mobile design


    WordPress für eine sichere, leistungsstarke und statische Lösung

    Pushpay hat sich für eine statische Website-Lösung entschieden, um die Kreditkarteninformationen der Nutzer zu schützen und die Performance der Website zu optimieren. Eine statische Website ist eine Plattform, bei der sämtliche Inhalte exportiert und auf einen Amazon Web Services Server hochgeladen werden. Eine statische Lösung koppelt die Inhalte vom CMS ab, was zahlreiche Vorteile mit sich bringt:

    • Schnelle Ladezeiten. Da die Inhalte bereits generiert sind, kann der Server die Seiten schnell laden, ohne erst eine Content-Datenbank abrufen zu müssen.
    • Mehr Sicherheit. Die Darstellung aller Inhalte über statische Seiten hat den Vorteil, dass diese nicht mit Back-End-Systemen interagieren. Dies sorgt für eine sicherere Plattform und schützt die finanziellen Daten der Nutzer.

    Da die Inhalte der Website völlig statisch sind und keine WordPress Plugins verwendet werden, wird beim Aufrufen der Website die Cloud Front von Amazon Web Services zum Laden der Inhalte verwendet. Damit die Nutzer auf das Pushpay-Produkt zugreifen können, nutzt die AWS Cloud Front einige Regeln, um den Traffic zu steuern. URLs mit vorprogrammierten Pfaden führen zu Inhalten auf dem AWS Server, während URLs mit anderen Pfaden zum Pushpay-Produkt weiterleiten.

    Um die Sicherheit zu gewährleisten, können die Nutzer ausschließlich über das Pushpay-Produkt auf ihre finanziellen Informationen und Spenderdaten zugreifen. Die Inhalte der Website bleiben dabei von den jeweiligen Systemen getrennt. Wenn sich ein Nutzer auf der Website mit seinem Pushpay-Konto anmeldet, erfolgt das direkt über das Pushpay-Portal. In anderen Worten: Das Pushpay-Produkt bleibt von WordPress völlig unberührt.

     

    Lassen Sie sich von der Website inspirieren: pushpay.com