Fragen und Antworten zum Landing Page Design mit Senior Visual Designer Freddierick Mesias

Veröffentlicht: 2017-07-05

Bei Instapage stellen wir uns den höchsten Erwartungen: Ihren. Wir hören von vielen Vermarktern, dass unsere Plattform intuitiv ist und ihren Kampagnen hilft, höhere Konversionsraten zu erzielen. Wir wissen, dass insbesondere Designer unseren Builder aufgrund einiger spezifischer Funktionen verwenden, die wir in den letzten Jahren veröffentlicht haben.

Unser Team erhält ständig Feedback von Designern zu Usability-Tests, moderierten Interviews und NPS-Scores. Wir nehmen dieses Feedback sehr ernst, um weiterhin eine Plattform aufzubauen, die nicht nur die aktuellen Bedürfnisse der Designer, sondern auch zukünftige Wünsche erfüllt.

Ich habe mich mit unserem Senior Visual Designer Freddierick Mesias zusammengesetzt, um seine Erfahrungen mit Post-Click-Landingpages und der Instapage-Plattform zu sammeln.

BW: Was ist dein Design-Hintergrund und was ist deine Rolle bei Instapage?

FM: Meine Designerfahrung reicht von Webdesign, Branding und User Interface Design. Die wichtigsten Designtools, die ich verwende, sind Sketch (um High-Fidelity-Modelle zu erstellen), Adobe Photoshop und Illustrator (um visuelle Elemente für Post-Click-Landingpages wie Symbole, Fotobearbeitung, Illustrationen usw. zu erstellen).

Hier bei Instapage wird unser Designteam durch vielfältige Fähigkeiten ergänzt: Webdesign, Illustration und Markenkommunikation. Unser Hauptziel ist die effektive Kommunikation mit unserem Publikum durch Visuals. Meine Aufgabe besteht insbesondere darin, schöne Post-Click-Landingpages mit hoher Konversion für unser Marketingteam zu entwerfen.

BW: Wie war Ihre erste Erfahrung, als Sie mit Instapage eine Post-Click-Landingpage entworfen haben?

FM: Für mich gab es keine große Lernkurve, da das Produkt zu dem Zeitpunkt, als ich im November 2016 eintrat, bereits ziemlich fortgeschritten war. Als ich das erste Mal mit Instapage begann, war ich beeindruckt davon, wie die Plattform mit Blick auf Designer entwickelt wurde . Der Builder war nicht mit einer Reihe von Menüoptionen überladen, in denen Sie sich verlaufen könnten.

Natürlich gab es im Builder die grünen Hilfslinien, die beim Ausrichten von Elementen halfen, aber die Mobil-, Gruppierungs- und Ausrichtungsfunktion überraschte mich, als ich meine erste Post-Click-Landingpage entwarf. Anstatt jedes Element für Mobilgeräte ausrichten und verteilen zu müssen, konnte ich jetzt Elemente gruppieren und alle gleichzeitig verschieben, während das Seitenverhältnis für Mobilgeräte intakt bleibt.

Letzteres ist besonders besonders, denn da das Internet immer häufiger mobil verwendet wird, ist es wichtig, dass die Post-Click-Landingpages der Marketer für Mobilgeräte optimiert werden. Mit dieser Funktion war ich in der Lage, meine fertige Desktop-Version mit einem Klick auf eine Schaltfläche automatisch in eine mobile Version umzuwandeln. Dadurch habe ich eine Menge Zeit gespart und konnte Seiten für unser Team schneller veröffentlichen.

Wenn ich zwei Eigenschaften für Instapage definieren würde, würde ich sagen, dass es anpassbar und schmerzlos ist.

BW: Wie lange haben Sie gebraucht, um sich mit Instapage vertraut zu machen?

FM: Gar nicht lange. Das Besondere an Instapage ist, dass es Designer-freundlich ist. Wenn Sie mit anderen Designwerkzeugen wie Sketch, Illustrator oder Photoshop vertraut sind, werden Sie sich problemlos mit der Plattform vertraut machen.

Nehmen Sie die von mir erstellte Post-Click-Landingpage für die HubSpot-Integration. Die gesamte Seite wurde in Instapage erstellt, aber ich habe die dreischichtige Seitengrafik in Photoshop erstellt und in unsere Plattform eingefügt, die eine schöne visuelle Komponente hinzugefügt hat (hier geht es zur vollständigen Post-Click-Landingpage):

Q&A Post-Click-Landingpage entwerfen

BW: Was sind typische Frustrationen, mit denen Designer konfrontiert sind, wenn sie Post-Click-Landingpages erstellen?

FM: Designer sind von Natur aus Perfektionisten; unsere Jobs hängen von diesem Attribut ab. Auch wenn etwas zum Beispiel für das ungeübte Auge perfekt aussehen mag – es aber nicht ist – weiß der Designer tief im Inneren, dass es besser sein könnte.

Aus diesem Grund ist unsere Funktion Inline Style Editor besonders hilfreich, da Sie damit benutzerdefinierte Stiländerungen auf Elementebene vornehmen können. Alles von Änderungen des Textabstands, Randradius, Zeilenhöhe und mehr. Sie müssen nichts mehr im Auge behalten. Mit unserem Builder können Sie bis zum letzten Pixel anpassen, damit Sie genau das erstellen können, was Sie möchten.

(Hier ist ein Beispiel, wie Sie ein Element isolieren und einer Schaltfläche mit benutzerdefiniertem Styling einen Schlagschatten hinzufügen können:)

BW: Mit wem arbeiten Sie bei der Gestaltung einer Seite am meisten zusammen?

FM: Je nach Kampagne haben wir mindestens 3 bis 5 Stakeholder: 1 Texter, 1-2 Designer und 1-2 Marketingleiter. Der Texter erstellt eine überzeugende Sprache, um das Wertversprechen und die wichtigsten Vorteile des Angebots zu demonstrieren, übergibt mir die Kopie zur endgültigen Gestaltung und Marketingleiter beaufsichtigen das Projekt und geben unterwegs Genehmigungen. Abhängig von den Designanforderungen der Post-Click-Landingpage kommuniziere ich manchmal auch mit unserem Grafikdesigner, um Gifs oder andere visuelle Elemente zu erstellen, um die Botschaft zu kommunizieren.

Sie werden feststellen, dass ich keinen Entwickler hinzugefügt habe. In sehr seltenen Fällen holen wir einen Entwickler für die komplexe Designimplementierung hinzu. Die Zusammenarbeit und die gegenseitige Rückmeldung wurde beim Erstellen einer Post-Click-Landingpage mit unserer Kollaborationslösung doppelt so effizient. Anstatt Screenshots zu verwenden, die über Slack oder Tools von Drittanbietern gesendet werden, können wir einen Hotspot auf einem Post-Click-Landingpage-Element platzieren und den Designer (Texter oder ein anderer Interessenvertreter) benachrichtigen, um die erforderlichen Aktualisierungen vorzunehmen.

(Um einen besseren Einblick in die Zusammenarbeit zu erhalten, sehen Sie sich diese unten an – Kommunikation über Hotspots und Teilen der Seite mit Ihrem Marketingteam. Oder Sie können hierher gehen.)

BW: Was ist deine Lieblingsfunktion von Instapage und warum?

FM: Für mich als Designer ist das schwer zu beantworten, aber ich muss sagen, meine Lieblingsfunktion von Instapage sind die drei neuen Designfunktionen, die wir im Juni 2017 angekündigt haben:

  • Kantenmessungen
  • Achsensperre
  • Tastatürkürzel

Die meisten Designer, die ich kenne, sind immer hungrig nach dem richtigen Werkzeug, um ihren Designprozess effizienter zu gestalten. Aber es muss auch pixelgenaue Designarbeit schaffen. Das heißt, ich glaube, dass Instapage genau das tut.

Ähnlich wie bei der Sketch-App haben wir Kantenmessung und Tastenkombinationen. Die Kantenmessung ist besonders cool, weil Sie Elemente Pixel für Pixel oder Pixelbereich verschieben und ausrichten können – so kommen Sie genau dorthin, wo Sie möchten. Mit der Achsensperre können Sie Elemente nahtlos entlang der X- oder Y-Achse verschieben, ohne sich mit unordentlichen Guides herumschlagen zu müssen.

Diese kombinierten Funktionen ermöglichen es mir, eine schöne, pixelgenaue Post-Click-Landingpage innerhalb der Plattform selbst zu erstellen. Jetzt können Sie ohne Grenzen gestalten! (Weitere Informationen zu Kantenmessung und Achsensperre finden Sie hier:)

Die Optimierung und Iteration unseres ursprünglichen Designs nach dem Start unserer Post-Click-Landingpage in freier Wildbahn ist einer der wichtigsten Schritte. Hier kommen die A/B-Testfunktionen von Instapage zum Einsatz.

BW: Gibt es eine bestimmte Post-Click-Landingpage, auf die Sie besonders stolz sind?

FM: Natürlich! Vor einigen Monaten hatte ich ein Projekt zur Gestaltung und Erstellung einer Post-Click-Landingpage für die Einführung unserer Collaboration Solution. Ich war relativ neu im Team, daher spielte das Erlernen und Befolgen unserer Markenrichtlinien und unseres Styleguides eine große Rolle. Ich konnte die Post-Click-Landingpage ziemlich einfach erstellen und bin stolz darauf, dass sie derzeit eine Conversion-Rate von 24 % hat (hier geht es zur vollständigen Seite).

Entwerfen Sie Fragen und Antworten nach dem Klick auf die Landingpage-Zusammenarbeit

Haben Sie ein Designmerkmal, das wir hinzufügen möchten?

Wir suchen ständig nach Feedback von unseren Kunden und möchten Ihnen dabei helfen, bessere Post-Click-Landingpages mit hoher Conversion-Rate in großem Maßstab zu erstellen. Wenn es ein Design-Feature gibt, das wir unserem Builder hinzufügen möchten, senden Sie uns bitte Ihr Feedback. Und wir heißen Sie herzlich willkommen, Instapage auf Capterra, Trustpilot oder G2 Crowd zu bewerten.

Beginnen Sie dann mit der Erstellung Ihrer zu 100 % anpassbaren Post-Click-Landingpage mit Instapage. Mit unserer designfreundlichen Plattform und den erweiterten A/B-Testfunktionen können Sie einfach nichts falsch machen. Ihre Conversion-Rate wird es Ihnen danken. Melden Sie sich noch heute für eine Instapage Enterprise-Demo an.