kostenloser Webspace werbefrei: lima-city


Muster nahtlos kacheln (GIMP)

lima-cityForumDie eigene HomepageGrafikdesign

  1. Autor dieses Themas

    gentleman1

    gentleman1 hat kostenlosen Webspace.

    Liebe Community,

    ich arbeite gerade wieder an einer Website und da diese Website aus Bayern :prost: kommt, soll ich in den Hintergrund das Muster der bayerischen Rauten legen.

    Das ganze sollte dann in etwa so (http://de.fotolia.com/id/38759906) aussehen. :wow:

    Es soll auf dem oberen viertel der Seite die bayerischen Rauten angezeigt werden und dann soll mit einem Farbverlauf in das Hintergrundblau der Seite übergeleitet werden :blah: - in etwa so wie auf dem Bild eben.

    Das mit dem Farbverlauf u.ä. bekomme ich schon hin :smokin:, aber es besteht eben erst mal die Frage :confused:: Wie kann ich das ganze nahtlos kacheln und es so als Hintergrund benutzen?

    Ich habe mit GIMP bereits mal ein bisschen daran herumgefeilt. Ich habe mir die bayerische Rauten (http://de.wikipedia.org/w/index.php?title=Datei:Flag_of_Bavaria_%28lozengy%29.svg) von der Wikipedia heruntergeladen und habe dann bei GIMP mit Nahtlos machen (Filter > Abbilden > Nahtlos machen) versucht, einigermaßen hin zu bekommen.

    Leider ist es so, dass die Kanten nicht nahtlos an ein ander passen und es etwas ... abstrakt :slant: aussieht...

    Wenn ich das ganze nahtlos aneinander fügen will, ist das einzige Problem: Das ganze sieht dann nicht mehr wirklich nach den bayerischen Rauten, sondern eher nach moderner Kunst aus und die will ich auf dieser Seite echt nicht haben... :scared:

    Kann mir vielleicht jemand sagen, wie ich (unter Windows) hinbekommen kann, das ganze so zu Kacheln das es einigermaßen ordentlich aussieht?

    Viele Grüße
    Vitus :cookie:


    Beitrag zuletzt geändert: 3.8.2012 17:34:41 von gentleman1
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. g****e

    Versuch mal dieses Tutorial:
    http://www.youtube.com/watch?v=8wTSrBmmX1U
    Das sieht eigentlich recht gut aus, könnte gut passen :)

    Liebe Grüße
  4. sonok

    Moderator Kostenloser Webspace von sonok

    sonok hat kostenlosen Webspace.

    Um dies zu erreichen braucht man an sich nur die richtige Software. Ich hab ein paar Adobe-Produkte und erzähl Dir mal, wie ich mit denen da vorgehen würde. Eventuell findet sich hier jemand, der die Schritte mit Gratis-Software nachvollziehen kann und die Menübefehle nennt; bzw schaffst Du das selber.

    Zuerst mußt Du Dir überlegen, was Du da eigentlich siehst bzw sehen willst. Die Bayernrouten sind in dem Sinne eher eine Grafik denn ein Bild, dh eher Vektor- als Pixelgrafik. Diese Bayern-Vektorgrafik ist an sich zweidimensional, was Du haben willst ist eine Dreidimensionalität. Von daher wären die Arbeitsschritte:

    1) Die Rauten in der Menge die Du möchtest erstellen
    2) Den "Rautenteppich" um die xyz-Achse kreiseln lassen
    3) Eine Perspektive hinzufügen
    4) Als Pixelbild speichern und in einem Bildbearbeitungsprogramm (zB Gimp :tongue:) mit dem Foto zusammenfügen

    Danach ist der Himmel im Grundgerüst an sich fertig. Ich würde den speichern, als Pixelbild exportieren, ins Photoshop einfügen und dort die restlichen Effekte anwenden.

    Ich hab's mal grob gemacht und abgefilmt, damit Du eine Ahnung der Vorgehensweise bekommst ...

    http://www.hgb-leipzig.de/~sonok/sachen/screencast/ (Video wird die Tage wieder gelöscht) :wave:
  5. Autor dieses Themas

    gentleman1

    gentleman1 hat kostenlosen Webspace.

    Hallo nochmal und vielen Dank für eure Antworten,

    sonok schrieb:
    Diese Bayern-Vektorgrafik ist an sich zweidimensional, was Du haben willst ist eine Dreidimensionalität.


    Vielleicht hast du da etwas falsch verstanden, aber es geht mir im Prinzip gar nicht um die Dreidimensionalität, sondern eher um das nahtlose zusammenführen. :confused:

    Ich werde mir deinen Screencast trotzdem (wenn ich wieder zuhause bin und bessere Internetverbindung habe) ansehen und vielleicht ja etwas hilfreiches finden. Vielen Dank für deine Mühe. :wave:

    Das Tutorial werde ich auch gerne ausprobieren bloß habe ich leider eben eine ziemlich langsame Internetverbindung und die Möglichkeit besteht daher momentan nicht. Sobald ich wieder zu Hause bin, schaue ich mir alles an :mad:

    Auf jeden Fall: Vielen Dank für eure Mühen!

    VG
    Vitus :cookie:
  6. http://krisi12345.lima-city.de/raute.png
    Ich hab zwar (wie man sieht) etwas unsauber gearbeitet, und damit meine ich kleine Fehler im Pixel bereich aber das Bild ist kachelbar.
  7. Glätte die Ränder, dann müßte es funktionieren.

    Falls nicht, meld dich nochmal dann mache ich Dir einen blauweißen hintergrund mit rauten.:prost:
  8. Autor dieses Themas

    gentleman1

    gentleman1 hat kostenlosen Webspace.

    Hallo noch mal :blah:,

    krisi12345 schrieb:
    http://krisi12345.lima-city.de/raute.png


    Vielen Dank für deine Antwort und Mühe. Leider kann ich mir das ganze momentan nicht ansehen, da die Webspaces offline sind :wall:. Ich werde dies aber schnellstmöglich tun... :wazzup:

    gifs schrieb:
    Glätte die Ränder, dann müßte es funktionieren.


    Leider nein :eek:! Wenn ich es so mache, wie in dieser Anleitung (http://www.helpster.de/in-gimp-kanten-glaetten-anleitung_90932#zur-anleitung) dann kommt leider wieder kein nahtloses Bild heraus. :frown:

    Das Ergebnis findest du auf folgender Seite (die Webspaces sind ja leider offline): http://www.anony.ws/i/2012/08/06/PlyG1.png :slant:

    Viele Grüße und ein :prost: auf kaputte Webspaces
    Vitus :cookie:
  9. gentleman1 schrieb:
    Leider nein :eek:! Wenn ich es so mache, wie in dieser Anleitung (http://www.helpster.de/in-gimp-kanten-glaetten-anleitung_90932#zur-anleitung) dann kommt leider wieder kein nahtloses Bild heraus. :frown:

    Das Ergebnis findest du auf folgender Seite (die Webspaces sind ja leider offline): http://www.anony.ws/i/2012/08/06/PlyG1.png :slant:

    Also ich geb dir hier einfach mal ne kurze Anleitung wie ich es gemacht hab:
    Also erst einmal muss ich sagen dass das Bild aus Wikipedia zu klein um es kachelbar zu machen. Deswegen, und das ist auch das schwierigste bei der ganzen Sache oder zumindest nimmt es die meiste Zeit in anspruch musst du die Flagge so vergrößern das sie kachelbar ist d.h. das sie sich irgendwann nach rechts und nach unten wiederholt. Das machst du in dem du einfach in Gimp die Ebene mit der (kleinen) Flagge kopierst und dann die neue Ebene Pixel genau auf die andere bzw. neben die andere legst damit man die Schnittkanten (wenn man das so nennen kann) nicht sieht. Ist die Flagge groß genug (etwas größer als meine Version) kannst du ganz leicht den Teil raus schneiden der sich kacheln lässt wenn man ihn nebeneinander legt. Dazu nimmst du einfach die rechteckige auswahl, setzt dann irgendwo an einer rauten ecke oben links an und ziehst den auswahl kasten so lange nach rechts bist du den punkt erreicht hast an dem das Bild "von vorne anfängt". Mit etwas rumprobieren und etwas vorstellungskraft kriegst du das schon hin :wink:. Das ganze machst du dann auch noch nach unten. Wie du dann nur die auswahl ausschneidest weißt du denk ich mal.

    Und fertig ist deine kachelbare Bayern Flagge.

    Ich hoffe du hast es verstanden ^^
  10. Autor dieses Themas

    gentleman1

    gentleman1 hat kostenlosen Webspace.

    Halli Hallo,

    ich wollte euch nur mal vielen vielen Dank für eure nette Hilfe sagen. Die Seite ist jetzt einen großen Schritt weiter gekommen. ;-)

    Noch einmal: Vielen vielen Dank euch allen und ein :prost: auf krisi12345. :wave:

    Viele Grüße
    Vitus :cookie:
  11. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!