Hjemmeside » Grafik » 10 gratis skits plugins til webudviklere

    10 gratis skits plugins til webudviklere

    Sketch får en masse trækkraft blandt webdesignere og udviklere. Dette er sandsynligvis fordi det er intuitiv, nem at lære og kommer med mange funktioner, der gør det meget lettere at oprette en hjemmeside prototype. Det kan også skyldes, at denne applikation er udvidelig, dvs. du kan nemt tilføje nye funktioner til applikationen ved hjælp af plugins.

    Her er 10 plugins, der kan hjælpe dig med at øge din produktivitet, når du arbejder med Sketch. Der er forskellige, der spænder fra indholdsgeneratorer, farvepaletvælger, og de kan hjælpe dig med at vise lagmålinger eller automatisk tilføje polstring til et lag.

    1. CSS Buddy

    CSS Buddy giver dig mulighed for at tilføje CSS til dit lag i Sketch-arbejdsområdet. Dybest set kan du anvende bredde, højde, uigennemsigtighed, bokseskygge, grænse og baggrund til laget ved hjælp af CSS.

    Med dette plugin installeret, skal du bare vælge et lag og derefter vælge Ansøg på Udvalgt fra plugin menuen. En dialogboks vil bede dig om at indtaste dit stylesheet. Tilføj CSS indholdet uden CSS klassen og se dit lag tage form.

    2. Materiale Design Farve Palette

    Hvis du følger udviklingen af ​​Material Design, er en fremtrædende ting, du vil bemærke, brugen af ​​karakteristiske farver. Material Design har en fantastisk farvepalet. Nu kan du medbringe det til dit arbejdsområde med Materiale Design Palette Plugin.

    Dette plugin vil generere farvepaletter i sekunder uden at du skal lukke dit arbejdsområde. Vælg Hue, Value eller Swatch for at oprette en farvepalet, der passer til dit projekt.

    3. Skitse notesbog

    Nogle gange skal vi vise, hvad vi gør i en kommentar eller via dokumentation. Hvis du arbejder på projekter med andre designere eller en klients inddragelse, er dette også nødvendigt, så du kan sikre, at resultatet er, hvad alle har til formål.

    Skitse notesbog er et plugin til at dokumentere dit design i Sketch med lethed. Det vil tilføje et ekstra sidebjælke til dit arbejdsområde, som indeholder kommentarer, du tilføjer til et element på dit design. Du kan ændre rækkefølgen, kommentere, slette og veksle kommentarsynlighed.

    4. Day Player

    Før vi bruger ægte billeder i et design bruger vi ofte pladsholderbilleder til at fremskynde designprocessen. Til Sketch kan du bruge Day Player at tilføje tilpassede pladsholdere til et hvilket som helst lag i dit Sketch-arbejdsområde fra 6 placeholder image-tjenester, herunder Placehold.it, LoremPixel og Unsplash. Når du er aktiveret, kan du indstille billedets bredde, højde og andre oplysninger.

    5. Content Generator

    Vi har allerede et plugin til at indsætte pladsholderbilleder, hvad med en for almindeligt indhold? Content Generator hjælper dig med at tilføje dummy data som avatarer, navne, geolocation data og meget mere. Fungerer godt til mockup design og til at reducere hovedpine fra at forsøge at finde ud af, hvordan man genererer data på stedet.

    For at tilføje dummy data skal du blot vælge et lag og derefter vælge Plugin> Generator, og vælg Geo, Persona eller Billeder.

    6. Skitseforanstaltning

    Skitseforanstaltning er et måleinstrument til skitse. Det måler længden eller størrelsen af ​​et lag (eller lag) i dit design. Du får også polstring og margin på et lag såvel som afstanden mellem to lag. Sketch Measure kan også udskrive lagegenskaberne, såsom farve, kant og opacitet. Alle målinger kan hentes via tastaturgenveje.

    7. Dynamisk knap

    Dynamisk knap hjælper dig med at skabe knap med faste paddings nemt. Den justerer automatisk polstring baseret på den værdi, du giver, uanset længden af ​​din tekst. Med plugin'et installeret, kan en tekst konverteres til en struktur med genvej Kommand + J. Den krævede mængde polstring kan derefter stanses ind i tekstlaget (0: 0: 0: 0) (under flexknapgruppe).

    8. Typografisk skala

    Typografisk skala er et plugin for at vende det valgte tekstlag til typografisk skala. For at bruge dette plugin skal du bare vælge tekstlag (enkelt eller flere) eller blandet lag, der indeholder mindst et tekstlag, og vælg derefter Plugin> Typografisk skala og juster værdien på dialogboksen. Resultatet er et sæt af skaleret tekst, der følger reglerne for typografisk skala.

    9. Modulizer

    Med Modulizer Du kan styre paddingerne til knappen, modulet eller områderne på dit design med tastaturgenvejen Shift + Command + M. Du kan kombinere alle dine lag, gruppere det og derefter bruge genvejen til automatisk at justere din polstring baseret på den polstring, du har brug for . Se video demoen for at se dette i aktion.

    10. Blad

    Har du nogensinde tænkt på at konvertere dit design fra skitse til HTML? I så fald skal du nok få Klinge, et Sketch-plugin, der automatisk genererer HTML-filer fra dit design. Det vil konvertere gruppen til div, tekst ind i p og så videre.

    Når du bruger Blade, kan du fortælle pluginet, hvilket DOM-element der skal genereres ved at tilføje et særligt navn til laget, f.eks. [Btn] eller input [text], så Blade ved, hvad det skal gøre. Tjek denne video demo for et indvendigt udseende.

    Nu læs: 12 Nyttige plugins til WordPress Developers