Der Interface-Designer und der Frontend-Entwickler sind verschiedene Spezialisten, aber ihre Aufgaben sind eng miteinander verbunden. So sehr, dass intelligente Designer die Grundlagen des Layouts verstehen und Programmierer die Prinzipien guten Designs kennen. Dies hilft, Missverständnisse zu vermeiden und das erwartete Ergebnis zu erzielen. Details sagt Vladimir Sinitsyn, Leiter
Design und UX in Netology.
Hallo! Hier sind zwei Hauptgründe, warum Front-End-Entwickler die Grundlagen des Designs kennen müssen.
Der erste Grund. Frontender und Designer lösen ein häufiges Problem
Der Designer erstellt das Layout und der Front-End-Entwickler verwandelt es in eine vollständige Site-Oberfläche. Ein qualitativ hochwertiges Produkt entsteht, wenn beide Spezialisten das Wesentliche ihrer Arbeit verstehen.
- Der Designer muss die Grundlagen von Layout und CMS verstehen (wenn er ein Layout für das Steuerungssystem erstellt). Dies ermöglicht es, technische Einschränkungen besser zu definieren und wie schwierig es für das Front-End sein wird, die Idee umzusetzen.
- Der Entwickler muss die Logik und Struktur des Layouts richtig verstehen, herausfinden, was und wie es funktioniert, wie Animationen angezeigt werden und wie die Interaktion zwischen Elementen auf der Seite stattfindet. Weil die Ideen von Designern nicht immer auf den ersten Blick offensichtlich sind.
Designer denken oft ungewöhnlich und finden innovative Lösungen für die Weboberfläche der Website. Für einen Front-End-Entwickler ist es einfacher, die Logik des Designers zu verstehen und den Fluss seiner Gedanken zu verstehen.
Kollaborationssysteme mit Layouts vereinfachen die Arbeit nicht immer. Jetzt sind die Systeme zum Erstellen von Layouts so entwickelt, dass der Designer alle erforderlichen Informationen ohne persönliche Besprechungen und Diskussionen an den Front-Endner übermitteln kann - einfach die gemeinsame Arbeit im Programm organisieren. Dies spart einerseits Teamzeit. Auf der anderen Seite muss der Entwickler die Idee des Kollegen verstehen und herausfinden, wie das Layoutdesign funktioniert. Andernfalls können lange Diskussionen und Verbesserungen nicht vermieden werden.
So stellen Sie die Interaktion zwischen einem Designer und einem Entwickler her: Grundregeln
Ich werde einige Tipps aus eigener Erfahrung geben, wie man eine Zusammenarbeit aufbaut und die Teamarbeit komfortabler macht.
Wenn Sie Designer sind und ein Layout vorbereiten, versuchen Sie, die Arbeit des Front-End-Entwicklers zu vereinfachen:
- Arbeite am Gitter. Ja, Asymmetrie als Technik wird mittlerweile populär, sollte aber auch in das Raster eingetragen werden.
- Geben Sie so viele Objekte wie möglich in das Layout ein. Das Tippen erleichtert und beschleunigt das Layout.
- Zeigen Sie die Zustände von Objekten in der Interaktion an.
- Sortieren Sie die Ebenen und benennen Sie sie mit Anzeigenamen. Beispielsweise ist die Kopfzeile die Kopfzeile, die Schaltflächenebene die Schaltflächen. So wird der Entwickler Ihr Layout schnell herausfinden.
- Sammeln Sie alle Bilder, Symbole, Schriftarten und anderen Elemente an einem Ort, damit Sie später keine Zeit damit verschwenden, Elemente aus dem Layout zu exportieren.
- Erstellen Sie ein UI-Kit auf einer separaten Seite und zeigen Sie alle Status und Elemente an.
- Seien Sie nicht zu faul, um das Layout des Prototyps zu kommentieren, bevor Sie es an den Front-End-Anbieter weitergeben. Auf diese Weise kann ein Kollege es schneller herausfinden.
Wenn Sie ein Front-End-Anbieter sind und das Layout in eine Website-Oberfläche verwandeln:
- Sie können dem Designer gerne eine Frage stellen, wenn etwas nicht klar ist.
- Wenn Sie aus Erfahrung feststellen, dass Sie Änderungen am Layout vornehmen müssen, besprechen Sie diese zunächst mit dem Designer. Änderungen müssen vereinbart werden.
- Wenn es sich bei dem Projekt um ein Teamprojekt handelt, besprechen Sie in der ersten Arbeitsphase mit Kollegen, welche Tools Sie verwenden möchten und wie Sie das Layout am besten für das Layout an Sie übertragen können.
- Haben Sie keine Angst, über Design zu diskutieren und konstruktive Kommentare abzugeben. Wenn Sie feststellen, dass etwas nicht realisiert werden kann, erklären Sie, warum und was ersetzt werden kann.
Wenn jedes Teammitglied versteht, was seine Kollegen tun und wie sie ihre Aufgaben vereinfachen können, verläuft die Arbeit reibungslos. Das Ergebnis ist eine pünktliche Qualitätsschnittstelle.
Der zweite Grund. Für Entwickler, die sich mit Design auskennen, ist es einfacher, einen Job zu finden
Ein Entwickler mit guten Designkenntnissen kann ein universeller Spezialist werden und zwei Positionen gleichzeitig schließen.
Wo Front-End-Designer gefragt sind
Große Unternehmen sind bereit, zwei separate Spezialisten zu bezahlen - einen Entwickler und einen Designer. In anderen Marktsegmenten ist die Situation anders - oft bevorzugen Unternehmen die Einstellung universeller Spezialisten, die allein einen großen Aufgabenpool schließen können.
Site Builder sind mittlerweile beliebt und die meisten CMS-Systeme arbeiten als Konstruktoren. Mit ihrer Hilfe kann ein Programmierer eine einfache Benutzeroberfläche erstellen. Um jedoch ein qualitativ hochwertiges Layout zu erstellen, benötigen Sie noch die Fähigkeiten eines Designers. Designer nutzen massiv kleine Unternehmen und Privatkunden. Für sie ist es rentabler, einen universellen Spezialisten einzustellen, der das Layout erstellt und es in eine Schnittstelle mit oder ohne Konstruktor verwandelt. Ähnliches gilt für Freiberufler.
Was Sie zuerst über Design lernen sollten, wenn Sie ein Front-End-Entwickler sind
Ich erinnere mich sofort an eine gute
Illustration der 20 grundlegenden Gestaltungsprinzipien. Ich rate dir, mit ihr zu tauchen.
Machen Sie sich in der nächsten Phase mit den Tools zur Erstellung von Benutzeroberflächen vertraut: Figma, Adobe XD oder Sketch. Lesen Sie, schauen Sie sich die Bewertungen der einzelnen an und wählen Sie aus, welche näher bei Ihnen liegt. Die Hauptsache ist nicht auf Handbücher beschränkt. Beobachten Sie sie und üben Sie Ihre Fähigkeiten sofort in der Praxis, direkt im Tool.
In Zukunft empfehle ich, die Programme 3D: Cinema 4D und Adobe Dimension zu verstehen. und Schnittstellenanimationen: ProtoPie und Adobe After Effect.
Wo man studieren kann
In der Universität. Ich werde Universitäten nicht empfehlen, sie geben zu viel extra für einen schnellen Start und die Ausbildung selbst ist gestreckt. Wenn dies Ihre erste Ausbildung ist, können Sie für ein Diplom zur Universität gehen. Diejenigen, die bereits eine Ausbildung haben, sollten sich auf Intensitäten (sie werden sogar an einigen Universitäten unterrichtet) oder Online-Kurse konzentrieren.
Unabhängig. Selbstbildung ist für diejenigen geeignet, die wissen, wie man Informationen filtert und strukturiert, Ausdauer und Selbstdisziplin haben. Jetzt gibt es im öffentlichen Bereich zu viele nicht immer überprüfte und nützliche Informationen, in denen Sie verwirrt werden und sich noch mehr von den erforderlichen Fähigkeiten entfernen können.
Auf Online-Kursen. Eine Option für diejenigen, die strukturierte Informationen, Anweisungen und Feedback von Lehrern erhalten möchten.
Tipps
- Lernen Sie die Grundlagen des Designs, um die Layouts besser zu verstehen und sie ohne viel Diskussion und Verfeinerung in Schnittstellen umzuwandeln.
- Studieren Sie das Design gründlich, um ein universeller Spezialist zu werden, und bewerben Sie sich nicht nur in großen Unternehmen, sondern auch in digitalen Agenturen, Start-ups und suchen Sie freiberufliche Kunden.
- Beherrschen Sie die Werkzeuge des Designers nicht anhand des Handbuchs, sondern manuell - öffnen Sie das Programm und verstehen Sie es.
- Wenn Sie bereit sind, Informationen zu filtern und nützliche Schulungsmaterialien im Internet zu finden, lernen Sie Design selbst. Wenn Sie den Prozess beschleunigen und in einem strukturierten, relevanten Programm studieren möchten, wählen Sie Kurse.
Wenn Sie bereit sind, die Grundlagen des Webdesigns zu erlernen, laden wir Sie zu einem neuen Kurs in Netologie ein
Wir haben den Kurs „
Webdesign von Null bis Mitte “ gestartet und laden Front-End-Entwickler ein, die die Benutzeroberfläche „aus Sicht des Designers“ beherrschen möchten.
Viereinhalb Monate Training im Videoformat, Workshops und Analyse der Hausaufgaben. Wir konsolidieren die Theorie mit der Praxis und beherrschen auch die wichtigsten Werkzeuge eines Webdesigners.
