Lernen Sie Photoshop nur für das Webdesign


17

Ich möchte Webdesigner werden, deshalb schaue ich mir viele Photoshop-Videotutorials an, aber einige dieser Tutorials sind für das Webdesign nicht nützlich. In einigen Filmen geht es beispielsweise um Haut oder Zähne oder das Zeichnen einer Blume oder das Ändern des Musters einer Wand oder ähnlicher Dinge. Weil ich keine spezielle Ressource für das Webdesign habe und diese Tutorials eine Art Zeitverschwendung für mich sind!

Kennen Sie eine Tutorial-Quelle, um mir zu helfen, Webdesign in Photoshop zu lernen?

Was kann ich tun, um mich auf das Webdesign in Photoshop zu konzentrieren?

Welche Teile von Photoshop sind für das Webdesign erforderlich und welche nicht?

Antworten:


15

Jedes Werkzeug, jeder Pinsel, jeder Filter und jeder Effekt in Photoshop hat seinen eigenen Zweck in der Welt. Es gibt kein einfaches "dieses Werkzeug gut lernen und für alles verwenden", da verschiedene Werkzeuge usw. für verschiedene Effekte verwendet werden.

Wenn Sie beispielsweise glänzende, leicht 3d-glänzende Schaltflächen auf Ihrer Seite mögen (diese waren vor einiger Zeit sehr beliebt), müssen Sie Schatten, mehrere Farbverläufe, Maskierungen und möglicherweise ein wenig Hand-Jiggering mit einem Pinsel-Werkzeug verwenden. Für einen Hintergrund können Sie einfach eine Volltonfarbe oder einen Farbverlauf mit einer strukturierten / gemusterten Maske verwenden.

Da es keinen "einen Teil von Photoshop" gibt, den Sie lernen müssen, ist es das Beste, wenn Sie sich mit den verschiedenen Werkzeugen abrunden. Stöbern Sie herum und schauen Sie sich alle Arten von Websites an. Notieren Sie sich die Funktionen, die Ihnen gefallen, und versuchen Sie dann, sie selbst neu zu erstellen. Oft kann man die Elemente zerlegen - hat das Objekt Ränder, Verläufe, Texturen, Lichtquellen usw. - und etwas Ähnliches nachbilden.

Gleichzeitig kann ich nicht hart genug nach Hause hämmern, dass es mehr zu entwerfen gibt als nur Photoshop. Meine Empfehlung wäre, eine Design - Klasse an dem lokalen Community College zu nehmen (oder whever) und ein Gefühl für Dinge wie Gleichgewicht, Farben zu erhalten, Leerzeichen, usw. Diese Konzepte oft den Unterschied zwischen der Suche professionellen und sieht aus wie jemand Tante ( die, In diesem Szenario hat kein Designer eine Geocities-Vorlage bearbeitet.


4
"... es gibt mehr zu gestalten als nur Photoshop." Hört hört! +1.
Philip Regan

1
In Photoshop fehlen einige Funktionen, von denen das Entwerfen eines Layouts neben vielen Vektorwerkzeugen profitieren würde. Möglicherweise wechsle ich zum Illustrator und verwende Photoshop für andere Spezialgrafiken. Wie Charaktere, fotorealistische Ikonen ...
Muhammad Umer

17

"Ich möchte Webdesigner werden, deshalb schaue ich mir viele Photoshop-Videoanleitungen an."

Kennen Sie HTML, CSS und JS? Wenn nicht, fangen Sie zuerst dort an.

Photoshop wird dann als Werkzeug zum Erstellen der Grafiken verwendet, die zu HTML, CSS und JS passen.

In PhotoShop gibt es nichts Bestimmtes, das sich auf das Design von Websites bezieht. Es ist einfach ein Werkzeug zum Erstellen und Bearbeiten von Bildern.


4

Um Websites zu entwerfen, sollten Sie sich auch andere Modelle ansehen. Betrachten Sie einige der Effekte, die Sie verwenden könnten, z. B. Seitenablösungen und Links in der Navigationsleiste. Vieles davon ist in Photoshop nicht schwer zu tun, erfordert aber ein wenig Googeln. Ich überprüfe oft Dribbble , eine wundervolle Design-Community. Es ist sehr beliebt, daher werden Sie sicher feststellen, dass viele neue Techniken von Webdesignern implementiert werden.

Um sich jedoch einen allgemeinen Überblick zu verschaffen, versuchen Sie, mit einer Reihe von Tutorials zu arbeiten, die speziell für das Entwerfen von Websites verwendet werden. Auch wirklich einfache Tutorials. Denn diese beschreiben die Schritte für Sie und Sie können diese in zukünftigen Projekten replizieren. Ich habe unten 2 wirklich großartige Ressourcen hinzugefügt. Ich hoffe, Sie werden sie überprüfen. Ich garantiere dir, dass du ein Tutorial für Anfänger findest, das dir gefällt - und du wirst viel lernen!


4

Wenn Sie Websites entwerfen möchten, ist die Arbeit mit Fireworks weitaus besser als mit Photoshop. PS ist im Kern eine Fotomanipulationsanwendung, und obwohl ihre Werkzeuge für Drahtmodelle verwendet werden können, sind sie darin nicht besonders effizient. Anders ausgedrückt: Die Verwendung von PS für das Webdesign entspricht der Verwendung von PS als DTP-Anwendung über InDesign. Ja, es kann getan werden, aber es ist keine großartige Möglichkeit, und Sie werden auf lange Sicht verlieren.

Die Vorteile von Fireworks sind:

  • Es ist viel einfacher, mit echten Vektorformen zu arbeiten
  • FERN einfacher zu definierende Pixelabmessungen; Kein Verwischen von Strichen auf der Strecke usw.
  • Sie können "Masterseiten" definieren, um Änderungen im gesamten Design Ihrer Modelle vorzunehmen, ohne jedes einzelne Bild wiederholen zu müssen
  • Einfacheres Erstellen einer Bibliothek mit häufig verwendeten UI-Steuerelementen (nützlich für das Entwerfen von Web-Apps)
  • Benutzeroberfläche näher an der typischen Desktopanwendungsoberfläche, was eine flachere Lernkurve bedeutet

Die einzigen wirklichen Vorteile, die Photoshop auf den Tisch bringt, sind die Tatsache, dass

  • Die Schriftwiedergabe ist besser
  • Ihre Kollegen werden die Anwendung ein wenig besser kennen

1
Ja, Fireworks ist besser, andernfalls müssen Sie Illustrator und Photoshop verwenden und hin und her wechseln.
Cakey

0

Bei "Es gibt mehr zu gestalten als Photoshop": Ich fand das aufschlussreich: http://naldzgraphics.net/tips/what-designers-need-to-know-about-typography/


Es leidet unter gestelzener Prosa und gelegentlichen Grammatikfehlern. Ich kann es in einem Kommentarfeld zusammenfassen (und verbessern): Verwenden Sie in allen Dingen guten Geschmack und schauen Sie nach und machen Sie sich die folgenden Wörter klar: Schriftart vs. Schrift , Serife vs. Ohne Serife, Kerning, Tracking, Abstand , führen, ausrichten, bündig, gerechtfertigt. Der Artikel enthält für die meisten von ihnen keine klaren oder vollständigen Definitionen. Die Erklärungen sind oberflächlich und scheinen aus zweiter Hand.
Wildcard

Es ist auch eine Antwort nur auf einen Link.
Wildcard

0

Photoshop ist nur ein Werkzeug, und je besser Sie das Werkzeug kennen, desto besser können Sie es verwenden, um das zu tun, was Sie tun möchten. Es gibt jedoch mehr zu gestalten, als nur Photoshop zu kennen.

Diese Einstellung, die Sie benötigen, um Photoshop zu lernen und dann Designer zu werden, ist die gleiche, als würden Sie sich selbst als Baumeister bezeichnen, weil Sie wissen, wie man einen Hammer benutzt, oder als Mechaniker, weil Sie einen Schraubenschlüssel benutzen können. Design als solches sorgt dafür, dass die Dinge gut funktionieren (und sieht dabei wahrscheinlich auch gut aus). Es hat sehr wenig damit zu tun, Photoshop / Illustrator / InDesign / Sketch / whatever zu kennen, aber wie Sie diese Tools verwenden, um Ihre Ideen zu verwirklichen.

Es gibt Unmengen schlechter Tutorials auf YouTube und Unmengen guter Tutorials. Erfahren Sie, wie Sie das alles machen, die Techniken werden auf der ganzen Linie trotzdem wertvoll sein. Creative Block hat auch nette Tutorials. Aber außerdem sollten Sie sich mit Farbtheorie, Layouttheorie, Typografie (Eric Spiekermans Stop Stealing Sheep & Find Out How Type Works ist ein sehr gutes Intro) und anderen traditionelleren Grafikdesignfähigkeiten befassen, in die Sie Ihre Zeit viel mehr investieren können, als nur zu lernen Photoshop.

Wie bereits erwähnt, ist das Erlernen von HTML / CSS / JS auch für die Arbeit mit Webdesign ein absolutes Plus.


-2

Sie können Ihre PSD-Datei hier https://www.oss-usa.com/web-preflight?promo=web-preflight kostenlos auf bekannte Probleme mit der Webkompatibilität überprüfen


Hallo Nik, willkommen auf der GDSE und danke für deine Antwort. Ich verstehe nicht, wie dies die Fragen beantwortet. Könnten Sie das bitte näher erläutern? Vielen Dank!
Vincent

Ich habe Erfahrung in der Webentwicklung und habe viele Anfänger im Bereich Webdesign getroffen. Es gibt häufige Fehler, die jeder machen kann. Zum Beispiel Dezimalpixel in Schriftgrößen. Dieser Service kann Neulingen helfen.
Nik

Vielen Dank. Es wäre jedoch sehr hilfreich, wenn Sie Ihre Erfahrungen teilen und diese Fehler darlegen möchten. Auf diese Weise hat Ihre Antwort immer noch (viel!) Wert, falls der Link zu einem späteren Zeitpunkt unterbrochen wird. Link Rot ist der Grund, warum wir uns nicht für (meistens) Nur-Link-Antworten interessieren, und der Grund, warum ich Ihre Antwort abgelehnt habe. Bitte lassen Sie sich nicht entmutigen. Wir wissen, dass die Nutzung dieser Website eine Lernkurve sein kann. Wir sind glücklich , Sie zu haben, halten einen Beitrag!
Vincent
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.