Joomla 5 Challenge, die Antworten und die Gewinner

Erinnern Sie sich an die Herausforderung vom letzten Monat, ein Design für unsere „eigene“ Joomla-Website vorzuschlagen ? Die Idee der Herausforderung entstand aus dem Wunsch des Marketingteams, den Websites von Joomla ein harmonischeres Erscheinungsbild zu verleihen. Und uns als Kern in dieses Jahrzehnt zu versetzen Alle Websites wurden in den 2010er Jahren erstellt, um die unterschiedlichen Looks und Feels der Marke zu übernehmen und zu koordinieren.

Lassen Sie uns eintauchen und sehen, wer etwas zu sagen hatte und welchen Beitrag er leistete. 

Um es klar auszudrücken: An dieser Stelle sprechen wir nicht über die Vorlage, die mit dem Joomla-Produkt geliefert wird, das Content Management System (CMS), sondern über alle Joomla-Websites, aus denen die Joomla-Community-Sites bestehen, also die, auf die in diesem Artikel Bezug genommen wird das hat alles ins Rollen gebracht:

Joomla 5 kommt; es ist Zeit für ein neues Erscheinungsbild für alle unsere Websites? Nehmen Sie an der Herausforderung teil und sagen Sie mit.

https://magazine.joomla.org/all-issues/may-2023/joomla-5-is-coming-join-the-challenge

In diesem Artikel habe ich einen Blick zurück auf die verschiedenen Stile von Joomla geworfen und darauf, wie sich die verschiedenen Landingpages für die verschiedenen Bereiche entwickelt haben.

Moden ändern sich, ebenso wie die Technologie. Was im letzten Jahrzehnt Sinn machte, ist heute möglicherweise nicht mehr so ​​relevant.

Wir haben die Herausforderung in dem Artikel dargelegt und mehreren Zuhörern bei Joomla User Groups (JUGs) und beim Joomla Day Netherlands vorgestellt, wo ich einen Vortrag gehalten habe.

In keiner bestimmten Reihenfolge außer der Reihenfolge befinden sie sich auf dem speziellen Mattermost-Forum der Challenge: Joomla 5 Challenge . Wenn Sie Teil der Joomla-Community auf Mattermost sind, sollten Sie es sehen können.

(Möchten Sie der Joomla-Community auf Mattermost beitreten? Befolgen Sie die Anweisungen in diesem Beitrag:

https://magazine.joomla.org/all-issues/november-2022/getting-the-most-out-of-mattermost )

Auf geht's:

Brian Teemans

Brian erinnerte sich noch einmal an den Vortrag, den ich gehalten hatte, und meinte, dass die meisten Menschen sowohl auf Mobilgeräten als auch auf einer breiten Palette von Geräten suchen würden Gedanken für alle Ansichten beim Entwerfen der Joomla-Landschaft.

Elisa Foltyn

Was kann ich sagen?

Es ist nicht das erste Mal, dass Elisa Designs für Joomla liefert, und ich hoffe wirklich, dass es mit diesem frischen und lebendigen Design nicht das letzte Mal sein wird. Elisa hat es in eine Website integriert, um es zu präsentieren, damit Sie einen Blick darauf werfen können: http:// joomlaorg .designedwithlove.de/ 

Sie hat auch eine nette Einleitung darüber geschrieben, was sie getan hat:

„Ich möchte einen Vorentwurf der Joomla.org-Website mit Ihnen teilen. 

Bitte beachten Sie, dass dies nur ein erster Entwurf ist und der Inhalt, einschließlich Text und Bilder, noch nicht endgültig zu sehen ist. Der Schwerpunkt des Entwurfs liegt auf der Einführung von Joomla als leistungsstarkem, flexiblem und preisgekröntem Content-Management-System. 

Ich möchte die wichtigsten Funktionen von Joomla hervorheben, wie etwa Barrierefreiheit, mehrsprachige Unterstützung, Webdienste, Workflow-System, intelligente Suche, Benutzerverwaltung, benutzerdefinierte Felder und SEO-Optionen. Jede Funktion verfügt über einen Link „Mehr erfahren“, der zu detaillierteren Informationen führen sollte. Außerdem gibt es eine Schaltfläche, die auf eine Unterseite mit allen Funktionen verlinken soll. Vielleicht können wir alle Funktionen nach Tags filtern. 

Der Abschnitt „Warum Joomla wählen?“ sollte die Alleinstellungsmerkmale von Joomla aufzeigen, wie z. B. seine preisgekrönte Plattform, Kosteneffizienz, Datensouveränität, Sicherheit, Flexibilität und eine unterstützende globale Community. Für eine einfachere Entscheidung zeigt der Abschnitt „Testimonial“. zwei Arten von Zielgruppen: Websitebesitzer und Webentwickler, die die Leistung, Benutzerfreundlichkeit und Flexibilität von Joomla loben. Hier sollten wir echte Menschen zeigen und sie um ihre Erlaubnis bitten, eine Meinung zu veröffentlichen. 

Die Abschnitte „So starten Sie mit Joomla“ und „So erweitern Sie Joomla“ bieten einen Überblick über den Einstieg in Joomla bzw. die Erweiterung seiner Kernfunktionen. Der Entwurf enthält einen FAQ-Bereich zur Beantwortung häufiger Fragen zu Joomla. 

Gegen Ende der Seite gibt es eine Schaltfläche „Neueste Version herunterladen“, um einfach auf die neueste Joomla-Version zuzugreifen. In Bezug auf die Grafik enthält der Entwurf derzeit Platzhalter für Menüelemente und Bilder. Diese sollten durch tatsächliche und relevante Bilder ersetzt werden Menüpunkte während der Designphase.“

Für mich ist das ein Gewinner, und viele Elemente davon werden in der endgültigen Version verwendet.

Interessanterweise hat Elisa ihr Design mit Yootheme Pro erstellt und sagte, sie habe kein Problem damit, dass es in der endgültigen Version verwendet werde. Angesichts der neuen Verbesserungen der Barrierefreiheit, die gerade eingeführt wurden, bin ich geneigt, dem zuzustimmen, da dies die Pflege und Aktualisierung der Website erleichtern würde Anstatt alles von Hand zu erstellen, wird das erforderliche Qualifikationsniveau gesenkt, um bei dem Projekt mitzuhelfen, sodass mehr mitmachen und helfen können. Und warum nicht eine der größten Erweiterungen von Drittanbietern präsentieren, die wir haben?

Ich hätte gerne eine Seite auf unseren Websites, um die Erweiterungen von Drittanbietern hervorzuheben, die wir für unsere Websites verwenden, damit andere wissen, was erreicht werden kann und womit.

Robin Clapp

Robin hat ein Design geschaffen, das informativ und freundlich ist. 

Anhand der Designelemente, die wir im Originalartikel beschrieben haben, zeigt dies, wie die Websites mit einem Branding versehen werden könnten. Mir gefällt besonders die Verwendung der Farben, die weitgehend den Joomla-Farben ähneln und dabei helfen, sofort zu erkennen, dass es sich um Joomla handelt, wenn Sie sich dessen bewusst sind Logofarben.

Josean Telleria

Josean hat sich erneut für eine kräftige Farbpalette und auffällige Symbole entschieden, um den Benutzer durch die Website zu führen. 

Er ist der für das Marketing vorgeschlagenen Botschaft „Sicher, schnell, zugänglich, erweiterbar“ und „Ihre Botschaft“ treu geblieben, die uns von einigen Cloud-CMS-Lösungen unterscheidet.

Louise Hawkins

Louise leitete die Entwürfe im Marketing ein und gab Einblicke in ihre Arbeit.

Designhinweise:

Das beigefügte Design beinhaltet einige bewährte Designpraktiken, die nachweislich die Conversions steigern.

Goldener Schnitt – Hier habe ich den Goldenen Schnitt verwendet, um die Hauptelemente optimal zu positionieren. Sie können die Spirale des Goldenen Schnitts sehen, die ich im oberen Teil der Website überlagert habe. Der Goldene Schnitt hilft bei der Positionierung und Größe der Elemente im Verhältnis zu einander ästhetisch am ansprechendsten erscheinen. Ich habe auch den Goldenen Schnitt grob auf die Skalierung von Kopfzeilen angewendet. Dies wird durch Multiplizieren der Schriftgröße des Hauptinhalts mit 1,618 erreicht. https://www.adobe.com/uk/creativecloud/ design/discover/golden-ratio.html 

Emotionale Bilder – Menschen verarbeiten Bilder viel schneller als Text, außerdem verarbeiten Menschen Informationen anders, manche nutzen eine zentrale Verarbeitungsroute und manche eine periphere, dies ist als Elaboration-Likelihood-Modell bekannt. Dies ist ein Überzeugungsmodell und absolut faszinierend! (siehe diesen Artikel) . wenn Sie mehr über das ELM erfahren möchten ) Und ein Bild einer Person, die vor einem Text steht, ist noch aussagekräftiger.

https://www.interaction-design.org/literature/article/elaboration-likelihood-model-theory-using-elm-to-get-inside-the-user-s-mind 

Botschaften, die Anklang finden – Der Text des Heldenbildes ist lose nach dem Goldenen Schnitt skaliert, die Botschaft hier sollte eine sein, die beim Publikum Anklang findet.

CTA in der Hauptnavigation – Best Practices für Landingpages beziehen Ihren Haupt-CTA in die Navigation ein.

Vertrauenssymbole – diese sollten so hoch wie möglich platziert werden, da der Betrachter diese Informationen unbewusst speichert.

Leerraum – Die Verwendung von Leerraum, um den Betrachter effektiv auf Ihre Botschaft zu fokussieren, ist eine bewährte Technik.

Ränder – Ränder auf beiden Seiten ermöglichen es dem Benutzer, sich auf die Mitte der Seite und die Vorteile zu konzentrieren.

Auch wichtig!

Der eingereichte Entwurf war für eine Landingpage gedacht, die den Benutzer davon überzeugen sollte, dass Joomla 5 das richtige Produkt für ihn ist. Es muss vollständig benutzerzentriert sein, also sollten wir es so betrachten, als wären wir jemand, der möglicherweise neu bei Joomla ist. Was würden sie erwarten, was würde helfen, sie zu überzeugen usw. Es ist auch wichtig zu verstehen, wo im Kauftrichter sich ein Benutzer, der diese Seite besucht, befinden würde. Möglicherweise in der Interessensphase? Daher sollten die Nachrichten und Bilder ihn zur nächsten Seite weiterleiten Landingpages sind in der Regel nicht mit vielen Texten, die reich an Schlüsselwörtern sind, optimiert und der Traffic wird in der Regel durch Anzeigen gesteuert. Wenn ich also an meiner Stelle wäre, würde ich für eine Seite wie diese auf die Markenschlüsselwörter von Mitbewerbern bieten. (Aber das ist ein ganz anderes Thema.) !)

Und schließlich sollten wir einige Versionen jedes endgültigen Designs innerhalb der Zielgruppe testen.

Alireza Javaherian

Alireza hat einige Anweisungen gegeben, wenn Sie seine Dateien vom Board herunterladen möchten.

„Hier haben wir eine komprimierte Datei mit 5 Bildern, die ich entsprechend ihrer Reihenfolge und Anzahl anzeigen möchte. Wenn separate Bilder und geteilter Inhalt benötigt werden, werden sie in diesem Abschnitt veröffentlicht.

Das Design dieses Stils und Formulars basiert auf der Idee, dass alle Joomla-Seiten, wie Erweiterungen, Dokumente usw., mit einer Hand geändert werden können.“

Alireza bevorzugt ein Video auf der Startseite als Einführung in die Vorteile von Joomla mit einem einfachen Farbpaletten- und Linienstil, um ein modernes Erscheinungsbild zu erzeugen.

Showkot Shawon

Shawon hat sich außerdem für Farben mit hohem Wiedererkennungswert und ein schlichtes, klares Design entschieden.

Ihre Entwürfe sind hier zu sehen:

https://www.figma.com/proto/Ln1tUzp3OJ8fOJmhFkWQCC/Joomla?page-id=131%3A1392&type=design&node-id=131-1398&viewport=536%2C2432%2C0.41&scaling=scale-down-width

Es lohnt sich, einen Blick darauf zu werfen, denn einige klare Symbole und Ideen für Gruppenbilder zeigen die Tiefe der Community.

Wer hat also gewonnen?

Die Joomla-Community hat es getan; die Mitglieder haben zugehört und viele haben ihre Ideen ausgetauscht; einige haben ihre Ideen in die Praxis umgesetzt, und das Ergebnis wird ein besseres, kollaborativeres Design sein.

Es ist wichtig, alle Mitglieder zu befragen und anzuhören, die daran interessiert sind, mitzureden, insbesondere diejenigen, die bereit sind, ihre Zeit in das Projekt zu investieren.

Diese Designs werden uns noch viele Jahre lang begleiten, daher müssen wir sie so anschaulich wie möglich gestalten.

Sie haben uns Ihre Ideen mitgeteilt; wie geht es weiter?

Das Marketing kann am Tag vor der Veröffentlichung dieses Artikels noch einmal einen Blick darauf werfen und dann einige derjenigen, die sich der Herausforderung gestellt haben, einladen, sich zu treffen und gemeinsam ein paar abschließende Beispiele zu erstellen, die auf den überarbeiteten Anforderungen basieren, die diese Herausforderung mit sich gebracht hat.

Es hat sich so gelohnt, die Ideen und Gedanken der Community zu hören, deshalb würden wir wirklich gerne ein paar ähnliche Designs rund um die Anforderungen erhalten und eine Umfrage in der gesamten Joomla-Community in Mattermost durchführen, um die Meinung der Community zu erfahren.

Während der Erstellung kann es zu weiteren Änderungen und Ergänzungen kommen, aber die Arbeit und der Aufwand der Siegervorlage werden im endgültigen Entwurf erkennbar sein.

Wenn Sie dies lesen und enttäuscht sind, dass Sie die Herausforderung verpasst haben: Es gibt eine noch größere Herausforderung, es auf allen unseren Websites in die Realität umzusetzen. Das wird viel Arbeit erfordern; wir brauchen so viele Leute wie möglich, um es in die Realität umzusetzen.

Wenn Sie also die Ärmel hochkrempeln und Teil der Modernisierung der Joomla-Websites werden möchten, melden Sie sich bitte und bewirken Sie etwas.

Sie können sich auf dem Joomla 5 Challenge-Kanal anmelden

https://joomlacommunity.cloud.mattermost.com/main/channels/or-joomla-5-challenge

Es wäre wunderbar, wenn dies eine echte Gemeinschaftsleistung wäre: Gemeinsam könnten wir die Joomla-Seiten modern und bereit für die Veröffentlichung von Joomla 5 machen!