Anzeige

Hintergrund Bild erstellen

Hintergrund Bild erstellen | PSD-Tutorials.de

Erstellt von Niobe, 29.03.2008.

  1. Niobe

    Niobe Aktives Mitglied

    Dabei seit:
    13.01.2008
    Beiträge:
    536
    Geschlecht:
    weiblich
    Ort:
    cross border
    Software:
    CC, OS X 10.x
    Kameratyp:
    Canon
    Hintergrund Bild erstellen
    Ich plane eine HP zu erstellen und habe einen Hintergrund gefunden den ich gerne in PS erstellen möchte. Das Bild soll in dieser Art aussehen
    css Zen Garden: The Beauty in CSS Design

    Leider sind meine Versuche solch' einen Hintergrund zu erstellen kläglich gescheitert. Ich würde mich sehr freuen, wenn mir jemand auf die Sprünge hilft bei dem Design wie ich am besten anfange und mir ggf. weitere Unterstützung bis zur Fertigstellung geben. Vielleicht kann daraus auch ein "kleines Kochbuch" für weitere Hintergrundentwürfe resultieren. Ich würde dann Step for Step ein Tut erstellen.

    Besten Dank - bin schon sehr gespannt. Gruss Niobe
     
    #1      
  2. jense

    jense Aktives Mitglied

    Dabei seit:
    15.03.2006
    Beiträge:
    305
    Geschlecht:
    männlich
    Software:
    PS-CS6 AI-CS6 ID-CS6
    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    Auf dem Hintergrund ist ein Verlauf von rot nach schwarz. (1.Klasse Photoshop)
    Dann ist dort eine waagerechte Linie. (Vorschule Photoshop)
    Links oben ist ein Ornament oder Blume oder sowas. In der gleichen farbe wie die waagerechte Linie. Das kann man toff mit Pfaden erstellen. Zieh dir Pfade da wo du sie haben willst, also so das sie deine Gewünschte Form ergeben und dann fülle die Pfadkontur. (ca.2 Klasse Photoshop)

    Das alles dann natürlich auf verschiedenen Ebenen erstellen und fertig ist es.
    Mehr ist da nicht im Hintergrund.
    Sag doch mal bei was du Schwierigkeiten hast.
     
    #2      
  3. mamam

    mamam Noch nicht viel geschrieben

    Dabei seit:
    12.12.2007
    Beiträge:
    6
    Geschlecht:
    männlich
    Software:
    PS, Illustrator & Dreamweaver
    Kameratyp:
    Sony DSLR A100
    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    ich möchte nur anmerken, dass die ganzen grafiken komplett über CSS eingebunden sind. als tipp: lad dir das CSS-file runter und schau dir die grafiken an, das hilft dir bestimmt.
     
    #3      
  4. Niobe

    Niobe Aktives Mitglied

    Dabei seit:
    13.01.2008
    Beiträge:
    536
    Geschlecht:
    weiblich
    Ort:
    cross border
    Software:
    CC, OS X 10.x
    Kameratyp:
    Canon
    Hintergrund Bild erstellen
    Vielen Dank für die rasche Antwort.
    D.h. die ausgefranzt weiße Umrandung wird mittels Pfaden erstellt.

    Sehr schade, dass ich nicht an den PS Vorschule und Klassen teilnehmen kann bzw. auch konnte. Der Dozent ist nicht mehr unter uns und ein adäquater Ersatz wurde leider noch nicht gefunden. Deshalb hier meine Anfänger Fragen. Aber ich arbeite daran!

    Danke für den Tipp - werde ich machen. Das wird mir helfen.
     
    Zuletzt von einem Moderator bearbeitet: 30.03.2008
    #4      
  5. jense

    jense Aktives Mitglied

    Dabei seit:
    15.03.2006
    Beiträge:
    305
    Geschlecht:
    männlich
    Software:
    PS-CS6 AI-CS6 ID-CS6
    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    Na die ausgefranzte weiße Umrandung gehört ja nicht zum Hintergrund. Das fällt untern den Punkt Content. Das gehört zu einer Textbox. Die Grafiiken für so einen Rahmen sind schnell erstellt. Eingebunden wird das über CSS. Quasi an allen Rändern der Textbox.

    Aber du hattest halt nach dem Hintergrund gefragt. Und das ist nu echt 1.Klasse. Und beschrieben hab ich es auch noch. Mehr ist an diesem Hintergrund nicht drann.
    Aber ich helf gern. Nur dann sag jetzt mal genau bei was du bei diesem Bild Schwierigkeiten hast.
     
    #5      
  6. Niobe

    Niobe Aktives Mitglied

    Dabei seit:
    13.01.2008
    Beiträge:
    536
    Geschlecht:
    weiblich
    Ort:
    cross border
    Software:
    CC, OS X 10.x
    Kameratyp:
    Canon
    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    Die Schwierigkeit ist, dass ich bisher PhotoImpact im Einsatze hatte und umsteigen will auf Photoshop. Also, ist der Kopf voll mit PI und PS will gelernt sein. Deshalb habe ich mich zu einem Kurs angemeldet der nun in der Form, wie ausgeschrieben nicht stattfinden kann, da der Dozent verstorben ist. Hinzukommt, dass ich PS auf einem lahmen Laptop als Testversion installiert habe... und da kann ich halt nur stöhnen, da alles nicht so flott geht. Mein Arbeits-PC ist defekt (Plattencrash) und da muss auch noch mehr sein, Lüfter und USB Anschlüsse.
    Ich glaube ich vertage das alles bis ich wieder vernünftig arbeiten kann. Sorry, wollte Dich nicht in der Form belästigen...
     
    #6      
  7. hyperactive

    hyperactive Fotojäger

    12111
    Dabei seit:
    28.03.2008
    Beiträge:
    2.915
    Geschlecht:
    weiblich
    Ort:
    NRW
    Kameratyp:
    Canon EOS 60D, CANON EOS 450D, Olympus C-500 Zoom, Casio EX-FH20, div. digitale und analoge Kameras
    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    Hallo Niobe!
    Ehrgeiziges Projekt... ein Zen Garden. Ich hatte das Buch neulich in der Hand. (40 €?). Die sind sehr fortgeschritten.... Weißt Du, worauf Du Dich da einlässt.

    Den Hintergrund hat Dir jense ja schon erklärt.
    Die Grafik ist nicht soooo schwer. Du öffnest eine Fläche im passenden Format und suchst Dir einen passenden Pinsel. Guck mal in die trockenen Pinsel und so.
    Damit malst Du erstmal einen groben Rand mit vielen Zacken. Dann vielleicht noch mit einem zweiten Pinsel oder in kleinerer Größe drüber malen, damit andere Randeffekte entstehen.

    Ich habe das Gefühl, in dem ZEN-Bild ist der Rahmen in verschiedenen Schichten erstellt, die unterschiedliche Intensität haben.

    Eine Alternative wäre meiner Ansicht nach, einen Briefbogen oder eine Karte im Schreibwarenhandel zu kaufen, die den passenden Rand-Effekt hat. Gibt es zu Hauf.
    Die legst Du auf einen andersfarbigen Hintergrund und lichtest sie ab. Ob ein Scanner gute Dienste leistet, bliebe auszuprobieren. Dann stellst Du diesen Bogen über die Farbauswahl frei und voilá...

    Das wäre jedenfalls eine schnelle Variante.

    Dann bleibt Dir das Problem, das in die Website einzubinden und richtig zu platzieren, damit der Text genau auf der Karte steht.

    Wenn Du Dich mit Website-Gestaltung und Programmierung nicht auskennen solltest: Mach nur den Hintergrund ;)

    Viel Erfolg
     
    #7      
  8. IronNight

    IronNight Guest

    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    Also ich mache das immer, indem ich mehrere ebene auf Ineinander kopieren setze und die hintergrund ebene einfärbe, dann auf jedem einen eigenen brush setze (andere brush dateien jeweils auf eigene ebene) und das ergibt dann geile effekte und dann noch vielleicht autofarbe klicke.
     
    #8      
  9. Niobe

    Niobe Aktives Mitglied

    Dabei seit:
    13.01.2008
    Beiträge:
    536
    Geschlecht:
    weiblich
    Ort:
    cross border
    Software:
    CC, OS X 10.x
    Kameratyp:
    Canon
    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    Hallo hyperactive,
    nein es handelt sich nicht um einen Zen Garden, obwohl das die absolute Herausforderung wäre. Ich bin nur jemand der mit einem "Rosenvirus" infiziert ist. Deshalb möchte ich eine neue HP zu diesem fazinierenden Thema erstellen.

    Vielen Dank für deine Tipps. Mich bringt das nun schon sehr viel weiter. Ich möchte zuerst den Versuch machen und den Hintergrund elektronisch zu gestalten. Die Alternative einen Briefbogen oder eine Karte im Schreibwarenhandel zu kaufen habe ich ja dann immer noch.

    @IronNight,
    danke, das werde ich auf jeden Fall probieren.
     
    #9      
  10. hyperactive

    hyperactive Fotojäger

    12111
    Dabei seit:
    28.03.2008
    Beiträge:
    2.915
    Geschlecht:
    weiblich
    Ort:
    NRW
    Kameratyp:
    Canon EOS 60D, CANON EOS 450D, Olympus C-500 Zoom, Casio EX-FH20, div. digitale und analoge Kameras
    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    Hallo Niobe!
    Das verstehe ich. Du hast Dir nur gleich als Vorgabe die Meister ausgesucht. Naja, ich hab mal gebastelt, nur ganz schnell.
    Hier ist mein Ergebnis: 4 Ebenen, 3 verschiedene Werkzeugspitzen, (eine in 2 Größen) Dann zuerst eine "Mitte gemalt" und danach überlappende Ränder.
    Jede Ebene für sich dann mit dem Filter "nasses Papier" mit ziemlich extremen Eigenschaften bearbeitet, danach dann die weißen Ebenen vereint und rote drunter, damit man was erkennt und es Deiner Website ähnlich sieht...

    Hier ist das Bild [​IMG]

    Ach ja: Willst Du eine Rosen-Website wirklich rot? Beißt sich das nicht mit den Blumen? Bzw verfälscht der Hintergrund dann nicht die Wirkung?

    Vielleicht machst Du ein Bild, das an den Rändern rot ist und legst einen breiten schwarzen Streifen über das Bild. Darin kannst Du dann die Bilder ausstellen, ohne dass es ZU viel ablenkt...

    Ich bastele mal dran rum, um mir ein netter Entwurf einfällt.

    Kann mir jemand sagen, mit welchen Pixel-Maßen Ihr Hintergrund-Bilder erstellt, damit sie jedenfalls im Allgemeinen eine gute Wirkung erzielen? Nach rechts weg muss man eh hinterher füllen, damit man auf alle Maße kommt...
     
    #10      
  11. hyperactive

    hyperactive Fotojäger

    12111
    Dabei seit:
    28.03.2008
    Beiträge:
    2.915
    Geschlecht:
    weiblich
    Ort:
    NRW
    Kameratyp:
    Canon EOS 60D, CANON EOS 450D, Olympus C-500 Zoom, Casio EX-FH20, div. digitale und analoge Kameras
    Hintergrund Bild erstellen
    AW: Hintergrund Bild erstellen

    Hallo!

    Also, das ist das erste Mal, dass ich eine HP in Photoshop entwerfe. Bitte nicht zu hart mit mir umgehen. Sonst schreibe ich Websites in html und css und die wirken bei mir noch bei Weitem nicht so grafisch und gutaussehend.

    Ich würde vorschlagen, den Hintergrund mittig einzubinden und dabei den Text über den schwarzen Streifen fließen zu lassen. Den Hintergrund entweder stehen lassen, oder unterhalb des Bildes einfachen schwarzen Hintergrund und die Grafik direkt oben an den Bildrand heften, dann funzt es.

    Hier also mein Entwurf:
    [​IMG]

    Die Rose ist nur ein Beispiel. Das ist eine PSE-Standardform, die ich ein wenig verzogen habe.

    Arbeitsschritte:

    Fläche im Querformat.
    Füllen mit Verlauf von rot nach schwarz.
    Farbebene mit schwarzer Füllung als breiten Block zwischen Ober- und Unterseite anlegen.
    Eine Füllebene als Streifen in Rot quer legen.
    Dann Form aussuchen oder bauen.
    Form zweimal übereinander legen.
    Die obere davon im selben rot füllen, wie den Streifen.
    Die untere mit dem "Perspektivisch Verzerren" Werkzeug oder wie man man verzerren / verschieben.
    Untere Form mit Farbverlauf von schwarz zu rot nach Geschmack füllen. Mit der Richtung und Ähnlichem kann man ganz nett spielen.

    Dann habe ich noch mit dem Radiergummi etwas von der Stilseite der unteren Blumen-Ebene weggenommen, weil es dann mit dem Übergang zum rot besser passt.

    Fazit: 5 Ebenen, wenig Arbeit (für die Demo-Version) und ein ganz ansprechends Aussehen, oder?
    Wenn Du magst, maile ich Dir das psd, dann kannst Du sehen, wie genau die Ebenen aussahen, aber das braucht es wohl gar nicht.
     
    #11      
  12. Niobe

    Niobe Aktives Mitglied

    Dabei seit:
    13.01.2008
    Beiträge:
    536
    Geschlecht:
    weiblich
    Ort:
    cross border
    Software:
    CC, OS X 10.x
    Kameratyp:
    Canon
    Hintergrund Bild erstellen
    @IronNight,
    den Tipp werde ich mir auf alle Fälle merken!

    @Hallo hyperactive,
    danke für deinen Vorschlag. Ich finde, das macht schon einen recht guten Eindruck. ;) Und es schaut nach deiner Beschreibung auch nicht sooooo schwierig aus. Es kommt halt auch auf den Betrachter an. Da ich das als Hobby und zur Entspannung betreibe, sind meine Ansprüche eher einfacher Natur. In html versuche ich mich seit einiger Zeit mit mehr oder weniger Erfolg. Fairerweise muss ich aber sagen, dass mich jemand unterstützt wenn ich nicht weiterkomme. Mit CSS tue ich mich eher seeeeeeeehr schwer - vieles kann ich lesen und interpretieren, aber leider kaum selbst etwas ändern. Aber ich will mich ja hier nicht verquatschen - sorry.

    Deine Anmerkung... "zur Rosen-Website wirklich rot? Beißt sich das nicht mit den Blumen? Bzw. verfälscht der Hintergrund dann nicht die Wirkung?"
    Ja ich glaube, dass ich mir da noch mehr Gedanken machen muss. Das wird so nix. Ein Hintergund, der eher blass ist würde den Objekten der Begierde sicher sehr viel mehr entgegen kommen bzw. die Rosen in ihrer Farbe und Forum unterstreichen. Wenn du Lust hast, hier habe ich einen Link mit eine paar schönen Rosen gefunden fehngarten Da hat sich jemand sehr viel Mühe gegeben.

    Ich muss zuerst einmal wieder meinen PC haben, der ist nämlich nochmals zur Reparatur. Dann werde ich mich wieder an das Thema wagen und mich melden. Danke schon mal im Voraus für Dein Angebot und Deine Zeit!

    Gruss Niobe
     
    Zuletzt von einem Moderator bearbeitet: 07.04.2008
    #12      
x
×
×