Wie sie es gemacht haben SnoValuation, gebaut mit Adobe Muse

Wie verwenden Profis Adobe Muse? Ich brauchte zehn Minuten, um Robert Tait, den Mann hinter 910Zens SnoValuation, nach seinem Adobe Muse-Workflow zu fragen.

Das Interview

Beschreiben Sie Ihren Design-Workflow bei der Verwendung von Adobe Muse. Was ist das allererste, was du tust? Zeichnen Sie mit Papier und Bleistift? Unterscheidet sich Ihr Workflow für das Internet von anderen Medien??

Mein Workflow hängt in der Regel vom Projekt ab und davon, wie kreativ uns der Kunde sein wird. Jedes Projekt beginnt mit einem detaillierten Fragebogen, der uns hilft, in den Fußball zu gelangen, bevor wir mit Design, Layout oder Benutzeroberfläche spielen.

Normalerweise beginne ich mit Bleistift und Papier und skizziere kleine Thumbnails. Diese Ideen werden letztendlich größer und raffinierter. Wenn ich mit den verschiedenen Optionen zufrieden bin, werde ich die Gelegenheit nutzen, sie in Photoshop in voller Größe (in diesem Fall Websites) zu gestalten. Manchmal ist Interaktivität ein wesentlicher Bestandteil der Website. Daher ist es einfach, in Muse zu springen, um zu zeigen, wie verschiedene Dinge funktionieren.

Ich entwerfe und plane seit über 15 Jahren Websites und Adobe Muse hat meinen Prozess komplett verändert. Früher haben wir eine flache Website entworfen und diese Comps oder Artwork den Codierern übergeben, um alles zusammenzustellen. Es war, als würde man alle Teile eines Autos entwerfen und erstellen, aber dann musste man alle Teile einem Mechaniker geben, um ihn zusammenzusetzen. Jetzt können Sie alles auf einmal entwerfen, erstellen und zusammenbauen. Es ist wirklich revolutionär.

Jetzt kann ich Muse an meiner Erkundung teilnehmen lassen. Ich baue mehr Interaktivität in Websites ein, da ich die Dinge in Echtzeit ausprobieren und die Ergebnisse sehen kann. Plötzlich ist eine flache, statische Website nicht mehr so ​​aufregend wie früher.

Wenn ich an anderen Projekten wie Logos oder Broschüren arbeite, ändert sich mein Workflow nicht allzu sehr. Die Ideen müssen von irgendwoher kommen, und ich finde es sehr befreiend, mit Bleistift und Papier zu beginnen. Wenn Sie auf den Computer hüpfen und einfach losklicken, sind Sie plötzlich an Computer, Software und die einzelnen Programme gebunden. Ich finde, dass ich erst, nachdem ich geeignete Lösungen auf Papier gefunden habe, die richtige Software für meine Vision auswählen kann.

Wie stark sind Sie auf andere Designanwendungen wie Photoshop, Illustrator oder Cloud-Synchronisierung angewiesen??

Photoshop, Illustrator und Muse sind meine drei Großen. Mit diesen drei Programmen kann ich fast alles, was mir als Webdesigner einfällt. Die Synchronisierung der Creative Cloud bietet zusätzlichen Komfort. Plötzlich haben Ihr Laptop und Ihr Desktop dieselben Einstellungen. Sie können sich jede Adobe-Anwendung (und es gibt viele) zu jeder Zeit holen und installieren. Updates sind schnell und problemlos und Sie können sogar Dateien hochladen, an denen Sie gerade arbeiten, um sicherzustellen, dass Sie niemals eine wichtige Datei auf Ihrem anderen Computer lassen.

Alles in allem hat die Creative Cloud meine Arbeitsweise verändert und alles ist jetzt nahtloser und komfortabler als je zuvor.

Wie haben Sie festgestellt, dass der Muse-Prozess vom statischen Design zur Interaktivität in einem Webbrowser wechselt??

Beim Entwerfen einer Website versuche ich immer, auf einzigartige Weise zu planen, um den Benutzer mit einem gewissen Maß an Interaktivität zu beschäftigen. Sie machen nicht immer den Schnitt, und Sie müssen Ihre Zielgruppe im Auge behalten, daher bleiben einige Ideen auf dem Boden des Schneidraums.

In diesem Fall mussten wir mehr Interaktivität einstellen, da sein Zielmarkt Skihüttenbesitzer oder Bankiers ist. Sie neigen dazu, allein wegen Fakten vor Ort zu sein. Ich bin wirklich erstaunt, dass ich mit diesem Projekt mit dem Design-Level fertig werden konnte. Glücklicherweise ist der Besitzer der Website ziemlich jung und hip. Wenn Sie die Handvoll Websites in dieser Branche betrachten, sehen sie alle so aus, als wären sie Mitte der 90er Jahre in Microsoft Word entwickelt worden. Diese Seite hebt sich wirklich von der Masse ab.

Auf Websites, an denen mehr Interaktivität erwünscht ist, finde ich, dass Adobe Muse ein erstaunliches Werkzeug ist, da es eine Fülle von Tools "In The Box" (sozusagen) zur Verfügung stellt, mit denen Sie Dinge im Fluge ausprobieren können und sehen, was funktioniert und was nicht. t.

Es ist erfrischend, nicht auf einen Kodierer angewiesen zu sein, um meine Vision in die Realität umzusetzen.

Wie haben Sie sich interaktive Elemente wie Wegpunkteffekte vorgestellt / gestaltet, in denen Elemente beim Blättern der Seite animiert werden?

Ich konnte keinen dieser Effekte auf dieser Website verwenden, aber es ist großartig, alle möglichen Tricks im Ärmel zu haben. Sie wissen nie, wann ein Kunde nach etwas fragen wird, oder müssen irgendwann seine Socken wegblasen. Alle Parallax-Scrolling-Optionen sind fantastisch und decken ein so breites Spektrum ab, dass es einfach ist, etwas Bewegung einzuführen, um ein Produkt zu präsentieren, den Benutzer zu begeistern oder einfach nur Spaß zu haben.

Gab es Aspekte Ihrer Website, die Sie mit Adobe Muse besonders schwierig erstellen konnten??

Das kompliziertere Parallax-Scrollen kann einige Experimente erfordern, um sich durchzusetzen, aber nichts ist wirklich zu schwierig, um in Muse zu bauen.

Bei SnoValuation habe ich ursprünglich Registerkarten verwendet, um zwischen zwei Google-Karten (Westküste und Ostküste) zu wechseln. Wenn ich jedoch in einem Browser zwischen den Karten umschalte, wurde die Karte (die sich ursprünglich hinter dem anderen versteckte) nie richtig zentriert. Ich fand schließlich heraus, dass es sich um einen Google Map-Fehler handelte, und hatte nichts mit Adobe Muse zu tun. Irgendwann haben wir nur die zweite Karte verschrottet, da der Benutzer problemlos zu einer beliebigen Karte navigieren kann.

Wie viel Gestaltungsfreiheit hatten Sie bei der Verwendung von Standardkomponenten wie Kontaktformularen, Karussells, Karten usw.?

Wieder ist diese Site im Wesentlichen für Skihüttenbesitzer und Bankiers konzipiert. Ich hatte also keine freie Herrschaft, aber ich hatte das Glück, einen progressiven Kunden zu haben, der keine "typische" Bewertungsseite haben wollte.

Die eingebauten Komponenten und die Tatsache, dass es einfach ist, Code an jeder beliebigen Stelle einzubetten, macht ihn unglaublich flexibel. Wenn Sie nicht finden, was Sie in einem Widget benötigen (und es viele Optionen gibt), können Sie den Code normalerweise nur von einer Drittanbieter-Site aus einbetten.

Die enthaltenen Widgets sind großartig und werden mit jedem Update besser.

Ich konnte das eingebaute Formular für die Kontaktseite verwenden und Google Maps direkt einbetten. Es ist großartig, diese Elemente als Teil der Anwendung zu haben, und jede neue Version der Anwendung enthält mehr und mehr nützliche Möglichkeiten.

Auf der Oberfläche sehen einige dieser Widgets einfach aus, aber es ist erstaunlich, was Sie mit den Standardwerkzeugen mit etwas Kreativität tun können.

Ich habe bereits mit dem Eigentümer der Website Gespräche geführt, um neue Updates vorzunehmen, die eine Reihe der neuen In-the-Box-Funktionen enthalten. Ich freue mich auf die zweite Phase.

Haben Sie mit Adobe Muse irgendwelche Aspekte des Designs ausgelöst, an die Sie sonst möglicherweise nicht gedacht hätten / gewagt hätten?

Die Verwendung von Muse ist fast wie die Verwendung von Photoshop. Es ist nicht ungewöhnlich, dass ich anfange, die erste Idee in Photoshop zu entwickeln und dann einige der rohen Elemente in Muse zu verschieben, um sie zusammenzubauen. Sobald Sie sich in Muse befinden, können Sie die Elemente umdrehen, drehen, skalieren, animieren, verblassen… Es ist erstaunlich, was Sie tun können, und das Schöne ist, dass „was Sie sehen, was Sie bekommen“..  

Adobe Muse fügt eine zusätzliche Stufe der kreativen Freiheit hinzu.

Das Arbeiten in Photoshop und das Übergeben Ihrer Dateien an einen Programmierer fühlte sich immer etwas leer an… als ob etwas fehlte. Jetzt können Sie zusehen, wie die Magie lebendig wird und Dinge verändern, während Sie gehen.

Nun gibt es keine Entschuldigung für Designer, um langweilige Websites zu erstellen.

Haben Sie mit Muses Werkzeugen experimentiert, die Sie letztendlich nicht verwenden mussten??

Ich teste IMMER die neuen Tools, wenn ich Zeit habe. Es gibt so viele Optionen, dass Sie nicht auf jeder Website alles verwenden können. Es lohnt sich, mit jedem Werkzeug zu experimentieren, weil Sie nie wissen, ob Ihr nächstes Projekt von einem der enthaltenen Widgets profitieren wird. Ich mag es, alle meine Optionen zu kennen, bevor ich Entscheidungen fällen kann.

Ich bin immer auf ein Muse-Update gespannt, da sie scheinbar einen Puls in die kommenden Trends haben. Muse benutzen lernen ist wie das, wonach Ihre Kunden fragen.

Nachdem Sie das Endprodukt erstellt hatten, hatten Sie das Gefühl, dass die Ausgabe in irgendeiner Hinsicht manuell angepasst werden musste?

Glücklicherweise sieht Muse gut aus, wenn er auf verschiedenen Browsern ähnlich aussieht und sich ähnlich verhält. Ich werde immer so viele Geräte wie möglich prüfen, um sicherzugehen, dass es auf der Straße keine Überraschungen gibt, aber die Feinabstimmung ist in der Regel minimal.

Das einzige, was ich anpassen musste, war, die Header-Textfelder breiter zu machen, da ich ein oder zwei seltsame Pausen bekam. Abgesehen davon gibt es sehr wenig nicht-designbezogene Optimierungen.

Muse bietet die Möglichkeit, eine separate Screen-, Mobile- und Tablet-Version eines Designs zu erstellen. Wie fanden Sie das Entwerfen separater Versionen und war das Endergebnis, was Sie sich erhofft hatten??

Die SnoValuation-Site ist ziemlich einfach, so dass beim Downsizing auf die mobile Version nicht viel verloren geht. In dieser speziellen Situation hat SnoValuation nicht nach einer "Tablet" -Größe gefragt, und ich hatte das Gefühl, dass die "Desktop" -Version (die die Standard-Tablet-Version ist, wenn keine Tablet-Version erstellt wird) gut genug übersetzt, um sie in Ruhe zu lassen.

Sie wissen nie, auf welchem ​​Gerät jemand Ihre Website anzeigt. Schön, dass Muse die drei verschiedenen Versionen anbietet. Es ist auf den ersten Blick etwas entmutigend, aber normalerweise erfordert es nicht viel mehr Aufwand, die Größe Ihrer Website zu ändern, um für die beiden anderen Optionen optimiert zu werden. Es erfordert ein wenig Optimierungs- und Experimentieraufwand, aber es ist die zusätzliche Anstrengung wert, Ihre Nachricht zu vermitteln, unabhängig davon, welches Gerät der Benutzer gerade betrachtet.

Mehr Adobe Muse

Schauen Sie sich die neuesten Angebote und Funktionen von Adobe Muse auf der Homepage von Adobe Muse an.