Das Design im Browser wird mit dem Aufkommen von „Designers Who Code“ immer beliebter. Aber nur weil wir einige neue Fähigkeiten erworben haben, heißt das, wir sollten Papier, Sharpies, Desktop-Publishing-Software und Wireframing-Tools aufgeben und direkt in die Codierung von Prototypen einsteigen?
Browser vs. Photoshop ist ein heißes Thema
Wenn Sie im digitalen Raum mit Designern und Entwicklern arbeiten, haben Sie den steigenden Trend bei Designern gesehen, von denen erwartet wird, dass sie (einige) Programmierkenntnisse haben.
Viele Leute sind alle dafür, während manche glauben, dass Designer keinen Code berühren sollten. Diejenigen Designer, die Code schreiben, werden jedoch zuversichtlicher, und einige argumentieren sogar, dass das Design in Photoshop in bestimmten Szenarien nicht mehr relevant ist.
Ich bin der Meinung, dass Kreativität werkzeugunabhängig ist, aber ich kann die Vor- und Nachteile beider Ansätze isoliert sehen (ich habe sie unten aufgeführt, damit Sie meine Sicht auf die Diskussion einholen können)..
In diesem Artikel verwende ich lose den Begriff "Photoshop" und "UXPin". Ich beziehe mich auf jedes Werkzeug dieser Art, egal ob Sie Sketch, Balsamico oder etwas anderes verwenden! Das gleiche Argument trifft zu. Zufällig sind Photoshop und UXPin meine bevorzugten Werkzeuge.
Eine häufige Situation, in der jemand in einer Organisation im Browser entwerfen kann, ist, wenn er visuelles Design beherrscht, aber auch bequem codiert. Beispielsweise könnte der Zweck darin bestehen, einem Entwickler, der ein CMS erstellt, mitzuteilen, wie das Design aussehen wird. Eine PSD wäre geeignet, aber der Designer könnte das Gefühl haben, dass es sinnvoller wäre, alle Extras wie Animation und Reaktionsfähigkeit so darzustellen, dass sie dem endgültigen Build näher kommen.
Leistungen
Frameworks wie Bootstrap und Foundation beschleunigen den Prozess. Meiner Erfahrung nach ist es gut zu lernen, wie man von Grund auf neu codiert, bevor man sich auf Frameworks stützt, da man erfahren wird, was hinter den Kulissen los ist.
Wenn Sie lernen, Front-End zu programmieren, werden Engpässe reduziert, insbesondere wenn Ihr Team auf der Entwurfsseite schwerer ist. Sie können sich die Entwickler auf die anspruchsvolleren Aspekte der Entwicklung und auf spezielle Bereiche konzentrieren.
Nachteile
Das Entwerfen im Browser kann etwas langsamer sein, wenn Sie sich beim Kodieren nicht sicher sind. Nach meiner Erfahrung kann es sich lohnen, sich für einen Front-End-Entwicklungskurs anzumelden und einige freiberufliche Gigs wie das Erstellen einer einfachen Landing Page auszuprobieren.
Dieser Prozess kann den Fokus der Designer von ihren Kernstärken ablenken. Ja, es kann gut sein, Coding Chops zu haben. Einige Leute argumentieren jedoch, dass die Arbeitsteilung (Menschen, die sich auf sehr spezifische Aufgaben konzentrieren) zu einer höheren Effizienz in der Produktion führt. Die Realitäten des Marktes (und die im digitalen Raum angestrebte Flexibilität) können dazu führen, dass sich die Menschen anders streiten!
Desktop-Publishing-Software wie Adobe Photoshop und Software as a Services (SAAS) wie UXPin sind nur ein paar von vielen Tools, mit denen Designer alles tun können. Sogar Designer das können Code und häufig auch das Design in Browsern werden es wertvoll finden, Dinge zuerst mit diesen Tools zu planen.
Leistungen
Grafikanwendungen sind in frühen Planungs- und Forschungsphasen hervorragend. Nach meiner Erfahrung sind Papier und Sharpies schnelle und schmutzige Methoden, um schnell etwas auszubauen.
Wireframes können für einen Business Analyst oder einen anderen nicht-visuellen Stakeholder eine gute Möglichkeit sein, grundlegende Metadaten zu kommunizieren. Das Entwerfen in einem Browser wäre wahrscheinlich übertrieben, da das Ziel in dieser Phase darin besteht, einen Diskussionspunkt zu schaffen.
Planung und Voraussicht mit Modellen mit geringerer Genauigkeit können zu einer erheblichen Verkürzung der Entwicklungszeit führen.
Nachteile
Das Entwerfen für das responsive Web kann sich in Photoshop wiederholend anfühlen und lässt sich nicht realistisch so darstellen, wie das tatsächliche Build aussehen wird. Meiner Erfahrung nach ist es einfacher, Ihre Medienabfragen für verschiedene Geräte mit dem Auge zu optimieren. So erhalten Sie in Echtzeit Feedback darüber, wie der tatsächliche Build aussehen wird, anstatt eine Reihe spekulativer Modelle in Photoshop zu erstellen.
Beim Entwerfen in Photoshop sind technische Einschränkungen kaum zu erkennen. Zum Beispiel habe ich einmal eine Landing Page für einen Kunden entworfen. Es gab eine E-Mail-Capture-Box, die später aufgrund der Komplexität sehr schwer zu gestalten war. Am Ende habe ich im Browser die "faule Art" "gestaltet", was wesentlich praktischer war.
Fazit
Kreativität ist werkzeugunabhängig. Wenn Sie direkt im Browser arbeiten, werden Sie sofort mit möglichen Einschränkungen konfrontiert und können Ihr Design weiterentwickeln. Nach meiner Erfahrung ist dies jedoch kein Ersatz für einen frühen Schnitt von UxPin und Adobe Photoshop. Diese Ansätze schließen sich auch nicht gegenseitig aus. Ich verwende Adobe Photoshop häufig, auch wenn ich im Browser entwerfe. Heutzutage gibt es auch einige großartige Erweiterungen, mit denen Sie Code viel effizienter programmieren können.
Sind Sie ein Designer, der kodiert? Oder machen Sie lieber Ihre Modelle in Desktop-Publishing-Software wie Photoshop? Hinterlasse einen Kommentar!