Evalink

Storyline und Website für eine Alarmmanagement-Software

<b>12</b> qualitative Befragungen

mit Kunden und Branchenexperten

<b>3</b> strategische Workshops,

um Tonalitäten und Zielgruppen zu definieren

<b>37</b> individuelle Illustrationen

um Funktionen klar verständlich zu machen

Evalink

Visit website

BRANCHE

Security / Alarm Management

Zeitraum

2022 (6 Monate)

TEAM

Design Consultant
UX / UI Designers
Copy Writer

Über das Projekt

Sitasys bietet eine der fortschrittlichsten Softwareplattformen für Alarmmanagement in der gesamten Sicherheitsbranche. Sie baten uns, ihnen dabei zu helfen, den richtigen Ton für ihre Zielgruppe zu finden und die gesamte Handlung für ihr gesamtes Web-Erlebnis neu zu gestalten.

Gemeinsam mit dem Kunden definierten wir in mehreren Strategieworkshops seine Zielgruppen und entwickelten neue Tonalitätsrichtlinien und eine übergreifende Storyline für seine Vertriebsansprache. Der neue Fokus wurde in die neue Designsprache und Website-Struktur übersetzt.

<section class="padding-largest no-padding-bottom module-portolio-detail-headline"> <div class="wrapper"> <h2 class="l-text center"> <span class="color">Differenzierte Zielgruppen </span> <br class="not-on-s">durch individuelle und spezifische Ansprache </h2> <p class="sn-text section-paragraph center">Die Website sollte mehrere Zielgruppen effektiv ansprechen und sie auf professionelle und überzeugende Weise dazu bewegen, mit dem evalink-Team Kontakt aufzunehmen.</p> </div> </section> <section class="section modular-portfolio-detail-list"> <div class="headline-large-image"> <div class="item-wrapper"> <div class="item"> <div class="image img-mobile"> <picture> <source media="(max-width: 767px)" srcset="" /> <source srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/02._headline-large-image/evalink-tile-image-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/02._headline-large-image/evalink-tile-image-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/02._headline-large-image/evalink-tile-image-1x.jpg}"> </picture> </div> </div> </div> </div> </section> <section class="section modular-portfolio-detail-list bg-grey-05"> <div class="wrapper portfolio-detail-list"> <div class="item flex-container reverse-order"> <div class="flex-item-left img-mobile"> <picture> <source media="(max-width: 767px)" srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/03._tile-image-1/Evalink-ProductPages-browserbar-white-1x.jpg" /> <source srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/03._tile-image-1/Evalink-ProductPages-browserbar-white-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/03._tile-image-1/Evalink-ProductPages-browserbar-white-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/03._tile-image-1/Evalink-ProductPages-browserbar-white-1x.jpg"> </picture> </div> <div class="flex-item-right"> <div class="vertical-middler"> <h3>Informieren und Vertrauen schaffen<br> mit erklärenden Illustrations-Text-Modulen</h3> <p>Bei der Überarbeitung der evalink-Website lag unser Fokus auf visuell ansprechenden Inhalten und Bildern, ohne übermäßige technische Details. Wir verwendeten Bild-Text-Module, die einen klaren Einblick in das Tool vermitteln und sich im Responsive Design konsistent verhalten.</p> </div> </div> </div> </div> </section> <section class="section modular-portfolio-detail-list no-padding-sides no-padding-bottom bg-grey-05"> <div class="headline-large-image"> <div class="item-wrapper"> <div class="item"> <div class="image img-mobile"> <picture> <source media="(max-width: 767px)" srcset="" /> <source srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/04._full-width-image-2/evalink----full-width-landingpage-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/04._full-width-image-2/evalink----full-width-landingpage-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/04._full-width-image-2/evalink----full-width-landingpage-1x.jpg}"> </picture> </div> </div> </div> </div> </section> <section class="section modular-portfolio-detail-list bg-grey-05"> <div class="wrapper portfolio-detail-list"> <div class="item flex-container reverse-order"> <div class="flex-item-left img-mobile"> <picture> <source media="(max-width: 767px)" srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/05._tile-image-2/Evalink-PriceCalc-browserbar-1x.jpg" /> <source srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/05._tile-image-2/Evalink-PriceCalc-browserbar-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/05._tile-image-2/Evalink-PriceCalc-browserbar-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/05._tile-image-2/Evalink-PriceCalc-browserbar-1x.jpg"> </picture> </div> <div class="flex-item-right"> <div class="vertical-middler"> <h3>Preisrechner –<br> Finden Sie das beste Angebot</h3> <p>Der Preiskalkulator sollte alle wichtigsten Angebote umfassen und gleichzeitig eine benutzerfreundlich und einfach bleiben. Die Schieberegler ermöglichen es den Nutzern, Ausrüstungs- und Standortmengen festzulegen und dabei flexibel zwischen Modulen und Paketen zu wechseln. Der Rechner unterstützt außerdem drei Währungsoptionen und bietet monatliche Kostenschätzungen und funktioniert nahtlos auf verschiedenen Geräten.</p> </div> </div> </div> </div> </section> <section class="section modular-portfolio-detail-list bg-grey-05"> <div class="wrapper portfolio-detail-list"> <div class="item flex-container"> <div class="flex-item-left"> <div class="vertical-middler"> <h3>Evalink Marketplace –<br> alle Ihre Integrationen an einem Ort</h3> <p>Der Marktplatz bietet Nutzern detaillierte Informationen, wie z. B. Anleitungen zu Software-Integrationen, die mit evalink-Produkten funktionieren. Um ihn benutzerfreundlich zu gestalten, haben wir eine Seitenleiste mit Kategorien und Filtern sowie eine Suchleiste hinzugefügt und das Design der Benutzeroberfläche überarbeitet, um den Marktplatz zu einer zentralen Anlaufstelle für Benutzer zu machen, um neue Software-Integrationen zu finden und zu erfahren, die ihre Erfahrung mit evalink-Produkten verbessern können.</p> </div> </div> <div class="flex-item-right img-mobile"> <picture> <source media="(max-width: 767px)" srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/05._tile-image-2/Evalink-Marketplace-browserbar-1x.jpg" /> <source srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/05._tile-image-2/Evalink-Marketplace-browserbar-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/05._tile-image-2/Evalink-Marketplace-browserbar-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/05._tile-image-2/Evalink-Marketplace-browserbar-1x.jpg"> </picture> </div> </div> </div> </section> <section class="section modular-portfolio-detail-list no-padding-sides no-padding-bottom bg-grey-05"> <div class="headline-large-image"> <div class="item-wrapper"> <div class="item"> <div class="image img-mobile"> <picture> <source media="(max-width: 767px)" srcset="" /> <source srcset="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/06._full-width-image-3/Evalink-LongPage-bar-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/06._full-width-image-3/Evalink-LongPage-bar-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/evalink-ux-ui-design/06._full-width-image-3/Evalink-LongPage-bar-1x.jpg}"> </picture> </div> </div> </div> </div> </section> <section id="cta-your-project" class="section padding-largest modular-call-contact "> <div class="wrapper"> <div class="flex-container"> <div class="flex-item-left"> <picture> <source media="(max-width: 767px)" srcset="/user/themes/boanastories/img/sales/s-profile-j2-mobile.jpg" /> <source srcset="/user/themes/boanastories/img/sales/s-profile-j2-1x.jpg 1x, /user/themes/boanastories/img/sales/s-profile-j2-2x.jpg 2x" /> <img src="/user/themes/boanastories/img/sales/s-profile-j2-1x.jpg" alt="Johannes Holl" /> </picture> <a href="https://boanastudio.com/de/team/johannes-holl" class="xs-text text-grey-60 image-caption"><b class="bold text-grey-40">Johannes Holl</b> <span class="not-on-s">• </span>Geschäftsführer</a> </div> <div class="flex-item-right"> <div class="text"> <div class="headline l-text"> <span class="color">Sprechen wir über</span><br>Ihr Projekt. </div> <div class="teaser n-text text-grey-60"> Teilen Sie Ihre Ideen mit uns, wir helfen gerne! </div> <div class="actions"> <a href="https://boanastudio.com/de/contact" class="button primary">Kostenlose Beratung</a> </div> </div> </div> </div> </div> </section>