Profil ansehen
Nachricht schreiben
Als FreundIn hinzufügen

Web 2.0 Button mit Inkscape erstellen

Kreis zeichnen
Starte Inkscape oder öffne mittels Ctrl+N eine neue leere Vorlage. Zum besseren Arbeiten kannst du durch Drücken der Taste 1 oder über Ansicht > Zoomfaktor > Zoomfaktor 1:1 die Ansicht vergrössern....

Formgröße ändern
Jetzt passen wir die Grösse des Dokuments und des Kreises an, zum Beispiel 300 Pixel. Um den XML-Editor kennenzulernen, machen wir es gleich damit – es ist gar nicht schwierig. Du bekommst ihn über...

Farbverlauf zeichnen
Jetzt rufen wir bei immer noch aktiviertem Kreis das Farbverlaufswerkzeug links auf und ziehen einen Farbverlauf von der oberen linken Ecke in die untere rechte des Dokuments. Dupliziere anschließe...

Schatten zeichnen
Jetzt erstellen wir über das Menü Ebene > Ebene hinzufügen ... über der aktuellen Ebene eine neue Ebene und geben ihr den Namen «Schatten». Du wirst bemerken, dass das Dropdown-Feld in der Fusszeil...

Glanz auflegen
Dupliziere den Schatten mit Ctrl+D, schneide ihn mit Ctrl+X aus. Jetzt brauchen wir eine neue Ebene. Diesmal geben wir ihr den Namen «Glanz». Also wieder Ebene > Ebene hinzufügen .... Füge den Krei...

⇒

Übersicht - Web 2.0 Button mit Inkscape erstellen

Nachdem wir in Inkscape mit 2D-Elementen wie Kreisen und Rechtecken arbeiten, müssen wir für einen schönen 3D-Effekt ein bisschen tricksen, um an unser Ziel zu kommen. Um einem Objekt Dreidimensionalität einzuhauchen, brauchen wir aus diesem Grund vor allem Licht- und Schattenffekte. Damit zerfällt unsere Aufgabe in drei Teile bzw. Ebenen. Eine Ebene für die farbige Grundform, eine weitere für den Innenschatten der Grundform und dann natürlich der Licktkegel bzw. die Reflexion der Lichtquelle auf der Oberfläche. Wenn wir diese drei Teile dann wie Folien übereinanderlegen, erhalten wir unseren Glasbutton. Später benötigen wir natürlich noch eine vierte Ebene, um unseren Button auch etwas anzeigen zu lassen. Dazu aber erst später.

weiter mit: Kreis zeichnen ⇒