Anzeige
Tutorialbeschreibung

Maske - Template

Maske - Template

Macromedia Fireworks 8 - Maske - Temlplate Tutorial

Erstellt mit Macromedia Fireworks 8. Geht natürlich auch mit Vorgänger.

Ihr könnt natürlich das "Tutorial - Maske " als .PDF Datei herunterladen.

Link: Uploadcenter "Rapidshare"

Datei: "RAR" / "PDF"

Größe: "0.40 MB"

DOWNLOAD


Vorwort: 

In diesem Tutorial wird eigentlich die „Maske“ erklärt. Aber wenn wir schon mal dabei sind, machen wir das Tutorial so wie im Vorschau. Das könnt Ihr dann sozusagen als Template benutzen. Alles andere bleibt euerer Fantasie überlassen.

Schritt 1:

Wir öffnen ein neues Dokument.

Größe von „700 x 500 Pixel“.
Hintergrundfarbe: #333333

Schritt 2:

Wir nehmen unseren „Abgerundetes Rechteckwerkzeug“ und zeichnen ein Rechteck in der
Größe: 150 x 80 Pixel
Farbe: Weiß. Im Grunde nicht wichtig, weil die Rechtecke später mit unserem Bild Maskiert werden.

Schritt 3:

Setzt das gezeichnete Rechteck etwas links oben auf die Leinwand und rundet die ecken einwenig ab.

Bilder

Bild 1 / Schritt 4:

Das ganze sieht dann insoweit so wie in Bild 1 aus.
 

Schritt 5:

Wir Klonen unseren Rechteck vorerst 3 Mal und setzen diese Wagerecht auf eine Linie und setzt die Rechtecke jeweils ca. 4 punkte voneinander entfernt.

Bilder

Bild 2 / Schritt 6:

Das ganze sieht dann so aus.

Bilder

Bild 3 / Schritt 7:

Klont die Rechtecke insoweit bis das ganze so wie in Bild 3 aussieht.

Bilder

Bild 4 / Schritt 8:

Beschriftet und färbt insoweit alles wie in Bild 4:

Schrift: PHOTO = Arial / Fett / Größe: 40 / Farbe: Weiß
Schrift: Portfolia = Arial / Größe: 20 / Farbe: #D1EE7A
Schrift: ENTER = Arial / Größe: 20 / Farbe: Schwarz

Das Rechteck auf dem wir unser „Enter“ drauf stehen haben, färbt Ihr in der
Farbe: #D1EE7A

Bilder

Bild 5 / Schritt 9:

Auf der Ebenenleiste sperrt Ihr „Photo, Portfolie, Enter und das farbige Rechteck“. Alles andere bleibt.

Schritt 10:

Die nicht gesperrten Ebenen markiert Ihr alle und Gruppiert diese.

Tastaturbefehle:

Zum Markieren: „STRG+A“
Zum Gruppieren: „STRG+G“

Schritt 11:

Wir Importieren nun das Bild auf unsere Leinwand, welches wir Maskieren möchten über:

Datei / Importieren…. (sucht dann in eurem Verzeichnis euer Bild aus und bestätigt es mit „OK“)

Schritt 12:

Das von uns Importierte Bild sollte nun vor unseren Rechtecken erscheinen. Stellt diese aber in der Ebene unter unsere gruppierten Rechtecke, so dass sich unser Bild auf der Leinwand hinter den Rechtecken befindet. Siehe dazu Bild 6.

Bilder

Bild 6 / Schritt 13:

Das ganze sollte dann so aussehen wie in Bild 6.

Schritt 14:

Jetzt kommen wir zum Maskieren. Wir Klicken unsere gruppierten Rechtecke und unseren Importierten Bild an und Maskieren diese über:

Modifizieren / Maske / Als Maske gruppieren…..

Bilder

Bild 7 / Schritt 15:

Das ganze sollte so aussehen. Evtl. ist es möglich, dass das Bild jetzt dunkler erscheint. Die Änderung nehmen wir in Schritt 16 vor. Sollte aber alles wie in der „Vorschau“ aussehen, kann Schritt 16 übersprungen werden.

Bilder

Bild 8 / Schritt 16:

Auf unserer Ebene links sehen wir unser Bild und rechts davon die Maske. Um unser Bild heller zu bekommen, klicken wir die „MASKE“ an nicht das Bild und ändern unten in der Eigenschaft die Farbfüllung auf „Weiß“

Schritt 17:

Geben noch unserem „Bild“ einen Filter. Klickt das „Bild“ auf der Ebene an und gebt Ihm einen Schlagschatten über:

Filter / Schatten und Glühen / Schlagschatten. Die Werte übernehmt Ihr einfach.

Dass war’s. Ich hoffe ich konnte es so gut wie möglich erklären und hoffe, euch nicht gelangweilt zu haben.

BisZumNächstenMal

cenka

Bilder


DVD-Werbung

Passend zum Inhalt empfehlen wir: Bootstrap für modernes Webdesign

Ob Smartphone, Tablet oder PC – Größe spielt keine Rolle mehr! Mit Bootstrap schmiegen sich Content und Design wie von Geisterhand an jedes Format. Lerne in 12 Lektionen und 2,5 Stunden Video-Training, wie dir das beliebte Framework Bootstrap den Weg zur responsiven Website erleichtert. Dein Trainer Sascha Rudolph bleibt dabei nicht nur an der Bedienoberfläche, sondern entwirft mit dir gemeinsam Struktur und Inhalt einer Beispiel-Seite. Mobile First, leicht gemacht:

  • Funktionen, Komponenten, Möglichkeiten: Bootstrap kennenlernen und bedienen
  • In der Praxis: Am Live-Beispiel von der Basis bis zur responsiven Website
  • Zum Mitmachen und Nachvollziehen inklusive der Arbeitsdateien

Was auch immer das Display zu bieten hat – deine Websites reagieren! Mach dich fit in Bootstrap für mehr Dynamik und Flexibilität!

Erhältlich im Shop ... oder in der Kreativ-Flatrate

Kommentare
Portrait von Gilmore
  • 04.05.2012- 10:50

Echt klasse, einfach und verständlich erklärt =)

Portrait von Art_of_Creation
  • 10.05.2011- 12:51

Einfach klasse dieses Tutorial
super erklärt und hat alles auf anhieb geklappt :) danke dafür

Portrait von prowebber
  • 16.02.2011- 14:52

Sieht gut aus und ist verständlich erklärt. Danke für die Anleitung!

Portrait von suhl123
  • 08.02.2011- 17:16

Hat mir sehr geholfen,vielen Dank

Portrait von groove
  • 30.01.2011- 20:59

Besten Dank für den effizienten Weg!

Portrait von gelber_wastl
  • 03.12.2010- 22:03

Herzlichen Dank für das Tutorial!

Portrait von photoheini
  • 10.10.2010- 13:57

Super Tutorial, leicht nachzuvollziehen. Danke!

Alternative Portrait

-versteckt-(Autor hat Seite verlassen)

  • 16.03.2010- 18:37

Sehr gutes TUT. Habe schon lange nach dieser Idee gesucht ;-)

Portrait von joey90
  • 15.02.2010- 22:11

Super gemacht, leicht nachzuvollziehen! Danke

Portrait von palacinka
  • 11.02.2010- 20:49

dank dir für das tut! :)

Portrait von Mrs_Ripper
  • 26.01.2010- 16:22

Dankeschön, das sieht echt super aus!

Portrait von smabaer
  • 10.01.2010- 00:53

Top-Idee! Werde ich für meine HP übernehmen!

Portrait von Susan99
  • 03.12.2009- 12:29

Dankeschön! Beschreibung konnte ich gut gebrauchen!

LG Susan

Portrait von raven_chrissy
  • 04.11.2009- 19:12

spitze, damit muß ich mich auch mal befassen, dankeschön

Alternative Portrait

-versteckt-(Autor hat Seite verlassen)

  • 05.10.2009- 19:58

sehr gut erklärt - aber bei mir funktioniert das mit dem importieren nicht - kann mir wer sagen wie das geht ?

Portrait von topmanager
  • 02.10.2009- 15:52

hab ich schon lange gesucht,
sehr gut gemacht

Portrait von Brushie
  • 15.09.2009- 12:05

Super Beschreibung, kann man als Anfänger Schritt für Schritt durcharbeiten!

Portrait von Sonnenblume77
  • 19.08.2009- 14:25

super, hat wirklich Spass gemacht und ich konnte als absoluter Aanfänger mit FW super folgen. Vielen Dank!

Portrait von Denjomc
  • 23.07.2009- 14:02

Echt klasse Danke fange gerade mit FW an vielen vielen Dank für diese gute Anleitung

Portrait von Chefkoch81
  • 09.07.2009- 20:00

Genialer Effekt! Bin beeindruckt ... und wieder einen Schritt weiter was meine Grundlagen angeht. Vielen Dank!



Achtung: Du kannst den Inhalt erst nach dem Login kommentieren.
x
×
×