Hvordan lage plast knapper i Gimp

Glatt, ren grafikk med utseendet skinnende plast og glass er kjennetegnet av Web 2.0 utseende. Web 2.0-stil knapper kan legge til en fargeklatt og en følelse av dybde til nettsiden din og andre visuelle designprosjekter. Gimp, en kraftig og gratis bilde redigering program, gir deg alle verktøyene du trenger for å enkelt lage glanset plast knapper.

Bruksanvisning

1 Opprett et nytt dokument størrelsen du vil at knappen skal være. For å starte, kan du prøve 200 piksler bred og 100 piksler høye.

2 Opprett et nytt gjennomsiktig lag som heter "Button". Kast bakgrunnslaget i søpla eller skjule den. Klikk på "knappen" lag for å gjøre det aktivt.

3 Klikk på "rektangel Select Tool" i verktøykassen. Sjekk "avrundede hjørner" i dialogen og justere avstanden til ønsket beløp. For en 200-by-100 knapp, prøv en radius på 20.

4 Velg en medium-tonet farge for forgrunnsfargen (ikke for mørk, ikke for lys). Bruk 114, 205, 227 for R, G og B-verdier på henholdsvis, og som vil gi deg en støvete skyggen av robin egg blå.

5 Velg "Fyll med FG Color" fra "Edit" -menyen.

6 Klikk på "Opprett et duplikat lag" -knappen på lagpaletten.

7 Velg "Paths Tool" fra verktøykassen. Lag en firkant rundt den nedre halvdelen av bildet litt større enn den knappen. I tillegg til rektangel hjørne ankerpunkt, inkluderer en forankringspunkt langs den øvre kanten av rektangelet i midten av knappen, dra musen mens du holder venstre museknapp nede for å lage håndtak for justering av kurven av banen. Etter endt rektangel, klikker du på øvre, midtre forankringspunkt og flytte håndtakene til å gjøre en veldig subtil bølge eller kurve for refleksjon. (Se "Ressurser" i denne artikkelen for mer informasjon om å opprette og redigere baner.)

8 Klikk "Utvalg fra Path" på alternativ paletten. Dobbeltsjekk at det øverste laget er det aktive laget. Det er nå et merket område rundt den nedre delen av knappen i den formen du tegnet med baneverktøyet.

9 Hit slettetasten for å slette den nedre halvdelen av knappbildet i det øverste laget. Klikk på "Lås alfakanalen" boksen på "Layers" palett å sørge for at de gjennomsiktige delene av dette laget bli gjennomsiktig. Fjern valgboksen ved å velge "Ingen" fra "Velg" -menyen.

10 Velg en bakgrunnsfarge som er en lysere nyanse av forgrunnsfargen. Klikk på bakgrunnsfargekartet i verktøykassen for å få opp fargevalg vinduet. Klikk på forgrunnsfargen i verktøykassa for å kopiere den fargen. Justere verdiene for å skape en lysere farge for den nye forgrunnen farge. Hvis forgrunnsfargen er robin egg blå nevnt tidligere, prøv R, G, B-verdier fra 164, 237, 255 for bakgrunnsfargen.

11 Velg "Blend Tool" fra verktøykassen. Sett "Gradient" til "FG til BG" i "Alternativer" panelet. Fyll det øverste laget med en overgang ved å klikke øverst i bildet og dra ned vertikalt til et punkt omtrent halvveis ned bildet. Gjenta til du får den effekten du ønsker.

12 Flytt det øverste laget ned og til høyre (kun 3 piksler for en 200x100 knappen) for å gi illusjon av en skråkant.

Hint

  • Eksperimenter med påføring av gradienter til både topp- og bunnlagene (låse alfakanalen på den nedre profilen første) for å få forskjellige effekter. Prøv å bruke en litt mørkere nyanse av forgrunnen farge og dra "Blend" verktøy fra midten til bunnen av bunnlaget. Prøv å reversere gradient på det øverste laget ved å dra "Blend" verktøyet fra midten til toppen.
  • Bevar åpenhet når du lagrer bildet for å kontrollere at bildet utover de avrundede hjørnene av knappen er gjennomsiktig. Bruk et format som støtter gjennomsiktighet, slik som PNG eller GIF, slå sammen synlige lag, og lagre bakgrunnsfarge.