30 Tage Design – Eine Branding-Fallstudie

Bei der Arbeit mit Kunden sind mehrere wichtige Aspekte zu beachten – das Einhalten von Erwartungen und Fristen sind zwei davon. Irgendwann in der Karriere eines jeden Designers wird es einen Kunden geben, der mit seinem Projekt eine dringende Dringlichkeit hat. Dies sind die Projekte, die die Kunst des Einhaltens von Fristen lehren und wie verrückt es werden kann.

Es gibt typischerweise zwei Arten von Projekten, denen jeder Designer im Laufe seiner Karriere begegnen wird: „Ich brauche ein benutzerzentriertes Design, das meinem Projekt entspricht, keine strengen Fristen; Ich will nur die beste Lösung“… Das ist der Traum eines jeden Designers. Aber seien wir ehrlich; in Wirklichkeit sind die Dinge immer anspruchsvoller.

„Ich möchte eine unkonventionelle, innovative und kreative Lösung – gute UX, wirklich schöne Benutzeroberfläche … und ich brauche sie gestern.“

Was passiert also, wenn Sie feststellen, dass Sie 30 Tage Zeit haben, um ein Logo zu erstellen und die wichtigsten Markenelemente, eine Website, mobile Benutzeroberflächen und Social-Media-Anzeigen/Grafiken zu entwerfen?

Nach einer kleinen Panikattacke erkennen Sie, dass kluges Arbeiten der einzige Weg ist.

Einen Plan zu erstellen und die Dinge im Voraus zu durchdenken, hilft bei der Produktivität, Präzision und Designqualität. Wie bei jedem erfolgreichen Unterfangen sind harte Arbeit und lange Arbeitszeiten einige der zwingenden Voraussetzungen, um es zu verwirklichen.

Egal was passiert, es gibt immer diese quälenden Fragen:

• Lohnt es sich, mit solchen Zeitbeschränkungen zu tun?
• Wird Zeitdruck zu schlechter Designqualität führen?
• Würde ich einen besseren Job machen, wenn ich mehr Zeit hätte?

Absolut ja!

Wie bei jedem Projekt gibt es immer Vor- und Nachteile und Einschränkungen, die wir als Designer umgehen und sogar zu unserem Vorteil nutzen müssen, um kreative Lösungen zu finden.

Es ist entscheidend, eine klare Vorstellung von den Aufgaben zu haben, die für einen erfolgreichen Abschluss des Projekts erfüllt werden müssen, und den Kunden diplomatisch darüber zu informieren, dass die kurze Zeitachse die Designqualität insgesamt möglicherweise negativ beeinflussen könnte. Der Druck einer erdrückenden Frist ist jedoch keine Entschuldigung dafür, nicht Ihr Bestes für Ihr Handwerk zu geben – nutzen Sie ihn, um sich selbst dazu zu bringen, die bestmögliche Arbeit abzuliefern. Eine Studie der Harvard Business School über kreative Arbeit unter Zeitdruck kam zu folgendem Ergebnis:

Diese Studie legt nahe, dass Manager Maßnahmen ergreifen, um den Mitarbeitern Zeit für kreative kognitive Prozesse zu verschaffen, insbesondere für Mitarbeiter, deren Arbeit ein hohes Maß an Kreativität erfordert. […] Es ist sehr wahrscheinlich, dass kreative Ideen nicht oft ganz ohne jeglichen selbst- oder fremdbestimmten Zeitdruck entstehen.

Diese Ergebnisse deuten darauf hin, dass ein hohes Maß an Druck der kreativen Arbeit entgegenwirken kann, gleichzeitig deutet die Studie jedoch auch darauf hin, dass ein angemessenes Maß an Druck in Bezug auf die kreative Arbeit hilfreich sein kann, um bessere Designs zu produzieren.

Es ist immer eine Herausforderung, alles zu erledigen, wenn Sie als Freiberufler mit mehreren aktiven Projekten arbeiten, aber es ist eine großartige Gelegenheit, Ihren Zeitplan gewissenhaft einzuhalten und Ihre begrenzte Zeit für sich arbeiten zu lassen! Remote-Arbeit für Sie zum Laufen zu bringen, ist einfach, aber nicht einfach. Kombinieren Sie dies mit einem soliden Plan, und Sie haben ein Erfolgsrezept.

Tage 1-2: Das Wichtigste zuerst – Planen!

Der erste Schritt besteht darin, das Projekt in kleinere Teile zu zerlegen und zu berechnen, wie viel Zeit es dauern wird, jede Phase des Projekts abzuschließen. Das Setzen von Zielen steigert Motivation und Leistung. Die Wissenschaft der Zielerreichung empfiehlt, Ihr großes Ziel in klar definierte Aktionsschritte zu unterteilen – dies wird Ihnen einen großen Vorteil bei Ihren Bemühungen, es zu erreichen, verschaffen.

Beim Branding-Design empfiehlt es sich, mehrere Versionen des Designs zu erstellen, damit der Kunde aus verschiedenen Optionen wählen kann. Meine persönliche Vorliebe ist es, drei Iterationen von Logodesigns und Hauptmarkenelementen wie Typografie, Farbpaletten, Bildern und Symbolsätzen zu erstellen. Wenn Sie dies zuerst tun, können Sie das Konzept und die visuellen Ideen zum nächsten Schritt bringen.

Erstellen Sie Arbeitsprozesse und folgen Sie ihnen.

Das Erstellen von Arbeitsprozessen erleichtert den Arbeitsablauf und die Verantwortung, die mit jedem Projekt einhergeht. Das Folgende ist mein üblicher Ansatz für ein typisches Designprojekt, sei es Branding oder User Interface Design:

Forschung

Erfahren Sie alles über das Geschäft Ihres Kunden:

• Was ist der Kern ihres Geschäfts und was ist ihre Haupttätigkeit?
• Wer ist ihre Zielgruppe und was sind ihre Bedürfnisse?
• Was sind ihre Ziele und welches Problem soll mit Design gelöst werden?
• Wer ist die Konkurrenz und wie können Sie besser sein?

Ein Fragebogen oder Designbriefing ist eine der bequemsten und effizientesten Möglichkeiten, die oben genannten Informationen zu sammeln.

Erstellen Sie ein Moodboard

Eines der Dinge, für die Sie ein Moodboard verwenden können, ist die Erstellung des Konzepts – ein wesentlicher Bestandteil jedes Projekts. Verschaffen Sie sich einen Überblick – nehmen Sie all Ihre Recherchen zusammen und bringen Sie sie auf einer großen Leinwand an, damit Sie alle Elemente sehen können, die in die Designs integriert werden sollten. Es gibt mehrere kostenlose Tools, mit denen Sie ganz einfach Moodboards erstellen können.

Wenn Sie sich nicht für Online-Tools interessieren, funktioniert die Verwendung von Adobe Illustrator gut, da Sie Elemente erstellen, hinzufügen und frei verschieben können. Betrachten Sie es als eine Collage – machen Sie sich nicht zu viele Gedanken über die Positionierung der Details; Sie können alles nach Ihren Wünschen gestalten. Das primäre Ziel ist zu sehen, wie Farben, Fotos, Icons, Typografie usw. miteinander funktionieren – visuell und im Storytelling.

Tag 3: Erstellen Sie ein Designkonzept

Die Erstellung eines Konzepts ist der nächste Schritt nach Fertigstellung Ihres Moodboards und bildet die Grundlage für all Ihre zukünftige Arbeit. Ein Konzept wird als experimentelles Modell erstellt, um die Umsetzbarkeit von Designmerkmalen zu testen.

Das Moodboard ist hilfreich, um frühzeitig eine visuelle Richtung festzulegen, die der von Ihnen anvisierten Zielgruppe und den Zielen des Unternehmens entsprechen sollte. Das Konzept bildet die Grundlage für Ihre UX-Ausrichtung und ist daher Teil der 10 UX-Ergebnisse, die von Top-Designern verwendet werden.

Es ist wichtig zu wissen, wie wichtig dieser Schritt ist, denn ein solides Konzept hilft dabei, eine überzeugende Geschichte nachzuerzählen, sogar in den ersten Phasen des Projekts. Das Hauptaugenmerk sollte eher auf den Gefühlen und Erfahrungen liegen, denen Benutzer beim Umgang mit den visuellen Elementen begegnen, als darauf, was die visuellen Elemente selbst sind.

Einer der einflussreichsten Marketingberater und Motivationsredner der Branche, Simon Sinek, hielt einen brillanten TED-Vortrag zu diesem Thema.

Das Moodboard kann Ihnen helfen, ein paar kurze Slogans zu erstellen oder vielleicht Symbol- und Fotostile in ein Konzept einzufügen. Da es gut ist, Typografie zu haben, die unabhängig vom Medium schnell gelesen werden kann, ist es auch wichtig, eine web- und druckfreundliche Typografie zu berücksichtigen. Dies ist ein Schlüsselelement für großartiges Design und auch eines der Prinzipien, die von universellen Designpraktiken beachtet werden.

Tag 4: Markenvisualisierungen entwerfen

Der Markenaufbauprozess kann langwierig und zeitaufwändig werden, wenn Sie von Anfang an beim falschen Ansatz erwischt werden. Beginnen Sie mit der Erstellung von Logo-Iterationen am besten, wenn Sie ein genehmigtes Konzept haben und die visuellen Anleitungsdateien fertig sind. Dies gibt Ihnen die Gewissheit, dass Sie sich in die richtige Richtung bewegen, und ermöglicht es Ihnen, die Branding-Herausforderungen auf intelligente und zeiteffiziente Weise anzugehen.

Es ist wichtig, kleine Stift- und Papierskizzen Ihrer Designideen anzufertigen. Es wird weniger Zeit in Anspruch nehmen, wenn Sie zuerst skizzieren und dann mit Illustrator, Sketch usw. fortfahren, um an Ihrem Logo zu arbeiten. Dieser Schritt hat mir geholfen, drei verschiedene Logovorschläge zu entwerfen, die alle in die für die Marke gewählte visuelle Richtung passen. Dies dauerte ein paar Tage, bis es fertig war:

Es kann einige zusätzliche Änderungen und Optimierungen am Logodesign geben, aber sobald sich der Kunde für das Logo entschieden und andere Elemente wie Farben, Typografie, Symbole und Fotostil genehmigt hat, sind Sie mit den grundlegenden Branding-Elementen fertig.

Tage 7-15: Website-Design

Markenentwicklung umfasst mehr als nur das Logo – sie umfasst nahezu alle Aspekte des Designs, einschließlich der Website. Es kann hilfreich sein, zuerst mit der Website zu beginnen, da Sie das visuelle Konzept erweitern können, indem Sie visuelle Regeln anwenden und sehen, wie sie zusammenarbeiten. Dies gilt insbesondere dann, wenn Sie eine Website erstellen, die letztendlich ein ähnliches Ziel und ähnliche Elemente wie die mobile Anwendung hat.

Seitenverzeichnis

Eine Sitemap ist eine Liste von Seiten einer Website, die für Crawler oder Benutzer zugänglich sind. Es kann entweder ein Dokument sein, das als Planungstool für das Webdesign verwendet wird, oder eine Seite, die die Seiten einer Website hierarchisch darstellt.

Es ist eine große Hilfe, wenn ein Kunde bereits eine Sitemap hat, weil sie Ihnen einen klaren Überblick über alle Seiten gibt, die zu einer Website gehören. Wenn Sie ein Projekt erhalten, für das eine Sitemap benötigt wird, müssen Sie mit dem Kunden zusammenarbeiten, um eine zusammenzustellen.

Dies könnte bedeuten, dass Sie Ihrem Kunden ein paar Fragen stellen:

• Wie viele Seiten hat die Website?
• Welche Seiten sind die wichtigsten?
• Gibt es Unterseiten?

Dadurch erhalten Sie ein klares Bild von der Struktur der Website und eine gute Vorstellung vom Umfang des Projekts.

Zuerst kopieren

Ich finde es nützlich, den Kunden im Voraus zu bitten, mir alle Texte und Inhalte zu geben, die er/sie auf der Website einfügen möchte. Es ist eine bewährte Methode, das Design um die Kopie herum zu arbeiten, anstatt zuerst die Benutzeroberfläche zu erstellen und danach zu versuchen, die Kopie anzupassen.

Der Copy-First-Ansatz spart Ihnen und den Entwicklern viel Zeit. Wenn Sie den umgekehrten Weg gehen, könnten Sie auf Probleme stoßen. Die Verwendung von Dummy-Text ist zwar manchmal nützlich, kann sich jedoch negativ auf ein echtes Projekt auswirken, insbesondere wenn das Design stark auf Typografie basiert und auf Inhalt ausgerichtet ist. Ein kopiezentriertes Design hat keine Nachteile und hilft nur dabei, kreative Arbeiten von außergewöhnlicher Qualität zu erstellen.

Homepage-Design

Wenn Sie alle vorherigen Schritte befolgen, haben Sie bereits allgemeine visuelle Richtlinien, eine Sitemap und einen Text. Jetzt können Sie mit der Gestaltung der Seiten für die Website fortfahren.

Die Startseite ist das erste, was Benutzer sehen, wenn sie auf eine Website kommen, und daher die wichtigste Seite. Die Anwendung des Pareto-Prinzips zeigt, dass die Homepage 80 % der Designrichtung (Kontext, Typografie, Farben, wiederholbare Elemente usw.) und der Rest der Seiten 20 % enthält.

Es empfiehlt sich, mit dem Gruppieren und Auswählen von Abschnitten für die Homepage zu beginnen. Vollständiger Inhalt und Text helfen mir normalerweise dabei, die gesamte Seite zu organisieren und zu sehen, welche Aspekte fehlen, sowie die Abschnitte, die hinzugefügt werden könnten, um die Wirkung zu maximieren und die Benutzer zum Kauf/zur Nutzung des Produkts oder der Dienstleistung zu bewegen.

Um den Service oder das Produkt hervorzuheben, versuchen Sie, auffällige Call-to-Action-Abschnitte zu verwenden. Sie sind eine hervorragende Möglichkeit, Werbung zu machen und die Aufmerksamkeit der Benutzer auf sich zu ziehen, um ein Produkt zu kaufen, einen Newsletter zu abonnieren, sich anzumelden usw.

Wenn es die Technologie, die Zielgruppe und die Art des Geschäfts des Kunden zulassen, kann das Hinzufügen von Bewegungsdesign wie GIF oder Animation der gesamten Website einen Subkontext verleihen und den Call-to-Action-Bereich betonen. Designer sollten jedoch darauf achten, nicht zu weit zu gehen und etwas zu schaffen, dessen Entwicklung viel Zeit in Anspruch nimmt.

Tage 15-25: Universelles Design anwenden

Universelles Design, wie es von seinen Entwicklern beschrieben wird, „kann angewendet werden, um bestehende Designs zu bewerten, den Designprozess zu leiten und sowohl Designer als auch Verbraucher über die Eigenschaften besser nutzbarer Produkte und Umgebungen aufzuklären.“

Das Konzept des universellen Designs ist eine der optimalsten Lösungen, wenn es um ein Projekt mit großem Umfang geht – ein einheitliches Konzept und eine fokussierte visuelle Ausrichtung für Branding, Website und mobile Anwendungen sind von großem Vorteil, wenn das Design unter Zeitdruck steht.

Die Notwendigkeit sich wiederholender Elemente kann eine Herausforderung für sich sein. Dies geschieht, wenn Sie auf technische Anforderungen stoßen. Responsive Websites und mobile Plattformen haben eine völlig andere Philosophie und ein anderes Regelwerk und können daher zu einem Problem werden, wenn sie nicht angemessen angegangen werden. Nichtsdestotrotz ist das Erstellen von Elementen, die auf mehreren Plattformen verwendet werden können, eines der Rückgrate für den Erfolg eines jeden Projekts – unter diesen besonderen Umständen wäre es nicht möglich gewesen, so viele Plattformen/Geräte ohne ein einheitliches Design abzudecken, das die Richtung für die Marke klar vorgibt Entwicklung.

Der Nachteil einer knappen Frist und des Entwerfens für mehrere Plattformen besteht darin, dass Sie möglicherweise nicht das volle Potenzial jeder der Plattformen nutzen, für die Sie entwerfen. In solchen Fällen könnte aufgrund der Zeitbeschränkung eine einfache „kugelsichere“ Lösung, die der Benutzerbasis vertraut ist, eine wertvolle Idee sein.

Zum Beispiel: Wenden Sie eine Idee auf mehreren Seiten erneut an und gestalten Sie sie für jedes Gerät neu. Die Muster sind im Wesentlichen ähnlich, was zu Ihren Gunsten ist. Dies kann an der Art und Weise liegen, wie Sie wichtige Informationen anzeigen oder Benutzer zum Kauf eines Produkts einladen. In diesem Fall könnte sogar eine Suchleiste ähnlich, wenn nicht sogar gleich sein.

Flussdiagramm

Das Design der Website ist abgeschlossen und Sie haben eine klarere Vorstellung von der UX für die Apps.

Eine Möglichkeit, den UX-Erstellungsprozess einfacher und klarer zu gestalten, besteht darin, ein Benutzerflussdiagramm zu erstellen.

Es gibt mehrere Methoden und Werkzeuge, die Sie verwenden können, um Flussdiagramme zu erstellen – die übliche Praxis besteht darin, grafische Diagramme mit kurzen Titeln und, falls erforderlich, Erläuterungstext zu erstellen. Ich bevorzuge die Verwendung von Sketch oder Illustrator, aber jedes Werkzeug, mit dem Sie Elemente erstellen und verschieben können, ist für diese Aufgabe geeignet.

Will Little hat eine großartige Interpretation davon gegeben:

Hier müssen Ingenieure und Kreative eng zusammenarbeiten, um zu entscheiden, welche Art von Software-Tools die beabsichtigten Schnittstellen und das Klick-/Wischverhalten am besten unterstützen können, bis hin zu jedem letzten Tab, Tooltip, Lightbox, Symbol usw. .

Machen Sie es hoch, indem Sie es niedrig machen

Die Entdeckung des Hauptzwecks der App hilft bei der Definition der UX. Das kann einem Benutzer helfen, ein Produkt zu kaufen, oder ihm vielleicht helfen, ein Produkt zu verwenden – die Benutzererfahrung muss dem Rechnung tragen. Low-Fidelity-Drahtmodelle, die auf Papier erstellt und dann in Sketch oder Photoshop auf höhere Genauigkeit gebracht werden, können den Prozess erheblich vereinfachen.

In diesem Fall reichten Low-Fidelity-Wireframes aus, da die App einfach ist und nur benötigt wird, um den visuellen Details der Website zu folgen.

Wenn Sie können, organisieren Sie einen kleinen Test für Ihre UX. Sie benötigen eine Testgruppe von zukünftigen Benutzern, um zu sehen, ob die Wireframes und der UX-Flow sinnvoll sind. Nach dem Test sind Sie mit wertvollen Erkenntnissen ausgestattet und können mit dem nächsten Schritt (Erstellen einer Benutzeroberfläche) fortfahren.

Einheitliches Design

Nachdem Sie einige Optimierungen an der UX vorgenommen haben, haben Sie alles, was Sie zum Erstellen einer logischen und klar definierten Benutzeroberfläche benötigen, sodass Sie sie an die visuellen Anforderungen von iOS- und Android-Plattformen anpassen können. Da iOS einige sehr spezifische Designrichtlinien hat, die Sie möglicherweise daran hindern, in den Apple App Store zu gelangen, müssen Sie sich mit diesen Regeln vertraut machen und sorgfältig prüfen, wie Ihr Design während der Entwicklungsphase implementiert wird.

Sie können ein einheitliches Design für iOS- und Android-Plattformen erstellen und gleichzeitig ihre größten Stärken nutzen, indem Sie beim Entwerfen der Benutzeroberfläche Richtlinien und Regeln befolgen.

Tage 25–30: Erstellen Sie Anzeigen synchron mit Branding

Zu diesem Zeitpunkt sollten Sie ein Logo, Branding-Elemente, eine Website und mobile Anwendungen entworfen haben. Obwohl Sie alles in weniger als 25 Tagen entworfen haben, ist es noch zu früh zum Feiern, da noch ein weiterer Schritt zu berücksichtigen ist – die Erstellung von Anzeigen für soziale Netzwerke und Printmedien. Hier hilft Ihnen das eingangs erstellte Konzept weiter.

Das Befolgen dieser Tipps beim Entwerfen von Anzeigen und Materialien für soziale Medien wird die Qualität, das Engagement und die allgemeine Kreativität Ihrer visuellen Elemente erheblich verbessern:

• Verwenden Sie lebendige und leuchtende Farben, die auffallen.
• Das Zeigen glücklicher und aktiver Menschen hilft bei der Dynamik und den Gefühlen in Bezug auf Ihre Grafiken.
• Bewegung, Aktivität und Aufregung von Menschen ist immer ein Hingucker und hilft bei der Übertragung von Gefühlen insgesamt.

All diese Regeln helfen Ihnen dabei, hervorragende Grafiken für Anzeigen zu erstellen. Verwenden Sie gegebenenfalls die Farbpalette, Typografie und andere visuelle Elemente, die Sie auf Ihrer Website, Ihrem Branding und Ihren Anwendungen verwendet haben. Dies wird Ihnen helfen, in Ihren Entwürfen konsistent zu sein, und wird sich zu Ihren Gunsten auswirken, wenn Sie unter Zeitdruck arbeiten.

Verpflichten Sie sich niemals zu einer Frist, die Sie nicht einhalten können

Gelegentlich kann jeder den Aufwand und die Arbeit eines Projekts unterschätzen – deshalb ist es zu Beginn eines Projekts entscheidend, jeden Schritt zu planen. Ziele und realistische Ziele, die in kleine Teile unterteilt sind, sind entscheidend für die pünktliche Lieferung solider Arbeit.

Benjamin Franklin hat es am besten ausgedrückt: „Indem Sie sich nicht vorbereiten, bereiten Sie sich auf das Scheitern vor.“

Versäumen Sie nie, sich vorzubereiten, und rechnen Sie immer mit der Möglichkeit, dass Sie die für die Ausführung des Auftrags erforderliche Zeit unterschätzt haben. Auch wenn Kunden Fristen haben, sollten Sie über die Fähigkeiten verfügen, mit denen Sie feststellen können, ob ein Projekt machbar oder überhaupt eine Überlegung wert ist. Lassen Sie dies jedoch keine Entschuldigung dafür sein, sich einer persönlichen Herausforderung nicht zu stellen, die Sie letztendlich zu einem geschickteren Designer und Zeitmanager machen könnte.

• • •

Weiterführende Literatur im Toptal Design Blog:

• UI-Design Best Practices und häufige Fehler
• Leere Zustände – Der am meisten übersehene Aspekt von UX
• Einfachheit ist der Schlüssel – Erforschung des minimalen Webdesigns
• Heuristische Prinzipien für mobile Schnittstellen
• Lesbares Design – Ein Leitfaden zur Web-Typografie