Virkninger

13 min read

Tilføj visuelle effekter til at forbedre dine designs. PinePaper indeholder 15 indbyggede effekter lige fra partikelsystemer til miljøsimuleringer.

Tilgængelige virkninger

Sparkle

En glødende partikel, der følger omridset af din genstand, efterlader et spor af gnister.

    • Bedste for: * * Logoer, fremhævet tekst, magiske temaer
Ejendom Varebeskrivelse Standard
Farve Sparkle / glød farve #fbbf24 (guld)
Hastighed Multiplikator for animationshastighed 1.0
Størrelse Partikelradius 2

Blast

En eksplosion af partikler fra midten af en genstand. One- shot som standard, eller indstille et interval for gentagelse af sprængninger.

    • Bedste for: * * Henstillinger, fremhævelse, festligheder
Ejendom Varebeskrivelse Standard
Farve Partikelfarve #ef4444 (red)
Radius Eksplosionsspredningsafstand 100
Antal Antal partikler 20
Interval Gentag interval i sekunder (0 = et skud) 0
Gentag Antal gentagelser (0 = kun ét skud) 0

Ild

Organiske flamme former med gradient farve, sinusformede bølge animation, og turbulens. Flammer pre-varm automatisk, så der er ingen Cold-start mellemrum.

    • Bedste for: * * Fyre, lejrbål, dramatisk vægt
Ejendom Varebeskrivelse Standard
Farve Basisfarve for autogenereret gradient #fbbf24
Farver Brugerdefineret gradient stopper array (tilsidesætter farve) gul → orange → rød
Antal Spawn rate 12
Hastighed Spawn rate multiplikator 1.5
Spred Vandret spaltet 0
Størrelse Bundflammestørrelse 3
Højde Maks. stigningshøjde (0 = auto fra punkt grænser) 0
Partikellevetid Flammelevetid på sekunder 1.5
Turbulens Bølgeamplitudemultiplikator 1.0
Maks. partikler Højeste samtidige flammer 30

Røg

Stigende røg eller damppartikler med sinusformet vandret drift. Forvarmer automatisk for øjeblikkelig synlighed.

    • Bedste for: * * Chimneys, damp, atmosfærisk tåge
Ejendom Varebeskrivelse Standard
Farve Røgfarve #888888
Antal Spawn rate 15
Hastighed Spawn rate multiplikator 1.0
Spred Vandret spaltet 0
Størrelse Oprindelig partikelradius 3
Drift Vandret sinusformet drivafstand 8
Højde Maks. højde (0 = auto) 0
Partikellevetid Partikellevetid i sekunder 1.5
Vækstrate Skalavækst som partikel stiger 0.3
Maks. partikler Maksimale samtidige partikler 18

Regn

Nedad regn striber med konfigurerbar vind vinkel og drop størrelse.

    • Bedste for: * * Vejrscener, stemning, miljømæssig baggrund
Ejendom Varebeskrivelse Standard
Farve Regndråbe farve #93c5fd (lyseblå)
Antal Sparehastighedsfaktor 15
Hastighed Faldhastighedsmultiplikator 2.0
Vinkel Vindvinkel (påvirker vandret drift) 0
Spred Vandret spaltet faktor 1.0
Størrelse Regndråbe længde og bredde multiplikator 1.0

Sne

Langsomt faldende snefnug med blid vandret drift og rotation.

    • Bedste for: * * Vinter scener, ferie temaer, blid atmosfære
Ejendom Varebeskrivelse Standard
Farve Snefnug farve #e2e8f0 (lys grå)
Antal Sparehastighedsfaktor 10
Hastighed Faldhastighedsmultiplikator 0.5
Spred Vandret spaltet faktor 1.5
Partikellevetid Flakes levetid på få sekunder 4.0

Confetti

Farverige tumbling rektangler med fysikbaseret tyngdekraft. One- shot som standard, eller indstille et interval for gentagelse af sprængninger.

    • Bedste for: * * Fejringer, resultater, partitemaer
Ejendom Varebeskrivelse Standard
Farver Array af konfetti farver rød, gul, grøn, blå, lilla
Antal Partikler pr. sprængning 30
Radius Eksplosionshastighedsområde 150
Tyngdekraft Nedadrettet acceleration 200
Størrelse Rektangstørrelse 6
Spred Spredt spaltet 0
Offset X / Y Centerforskydning 0
Interval Gentag interval i sekunder (0 = et skud) 0
Gentag Antal gentagelser (0 = kun ét skud) 0

Ripple

Udvider koncentriske cirkler, der falmer ud fra emnet center.

    • Bedste for: * * Vanddråber, anslagspunkter, sonar / radar
Ejendom Varebeskrivelse Standard
Farve Ringfarve #60a5fa (lyseblå)
Hastighed Multiplikator for udvidelseshastighed 1.0
Max Radius Maksimal ringstørrelse 150
Ringtæller Antal ringe til yngel 3
Stroke- bredde Ringlinjebredde 2

Glow

En pulserende aura bag det emne, der svinger i skala.

    • Bedste for: * * Højdepunkter, power-ups, opmærksomhed-tegning
Ejendom Varebeskrivelse Standard
Farve Glødefarve #fbbf24 (guld)
Hastighed Impulsfrekvensmultiplikator 1.0
Intensitet Maksimal uklarhed 0.6
Størrelse Skalasvingningsområde (1.0 → denne værdi) 1.5

Elektriske

Flickering jagged lyn bolte omkring emnet.

    • Bedste for: * * Energi, energi, scifi temaer
Ejendom Varebeskrivelse Standard
Farve Boltfarve #67e8f9 (cyan)
Hastighed Multiplikator af Flickerrente 1.0
Bolttæller Antal simultane bolte 3
Længde Boltlængde i pixels 60
Flickerrente Flickerfrekvens i Hz 8

Bubbles

Stigende gennemsigtige bobler med spektakulære højdepunkter og blid vandrette wobble.

    • Bedste for: * * Undervandsscener, lunefulde temaer, drikkevarer
Ejendom Varebeskrivelse Standard
Farve Bubble fælgfarve #93c5fd (lyseblå)
Antal Spawn rate 6
Hastighed Rise hastighedsmultiplikator 1.0
Størrelse Bubble radius 5
Spred Vandret spaltet 1.0

Støv

Flydende støv møller, der glider forsigtigt i luften med subtil bevægelse.

    • Bedste for: * * Atmosfæriske scener, gamle / vintage look, solstråler
Ejendom Varebeskrivelse Standard
Farve Støvfarve #d4c5a9 (varm beige)
Antal Antal motes 15
Hastighed Drifthastighedsmultiplikator 1.0
Størrelse Mote størrelse 2
Spred Område 1.0

Limefrugter

Lysende prikker, der vandrer organisk med glat styring adfærd.

    • Bedste for: * * Natscener, magiske skove, omgivende baggrund
Ejendom Varebeskrivelse Standard
Farve Imponerende glød farve #fde68a (varm gul)
Antal Antal ildfluer 8
Hastighed Bevægelseshastighedsmultiplikator 1.0
Størrelse Gløderadius 4

Shockwave

En enkelt udvidelse ring, der skyder udad fra emnet center. One- shot sprængeffekt.

    • Bedste for: * * Anslag øjeblikke, powerups, dramatiske afsløringer
Ejendom Varebeskrivelse Standard
Farve Ringfarve #f97316 (orange)
Radius Maks. ekspansionsradius 150

Trail

En vedvarende vej af partikler, der følger elementet, når det bevæger sig.

    • Bedste for: * * Flytte objekter, sti visualisering, komethaler
Ejendom Varebeskrivelse Standard
Farve Sporfarve #fbbf24 (guld)
Hastighed Fadehastighed 1.0
Størrelse Sporpartikelstørrelse 3

Shader Effects (silhouette- klippet)

En ny familie af GPU- gjorde effekter tilføjet i v0.5. I modsætning til partikeleffekter, er skygger effekter kontinuerlige animerede skygger sammensat mod dit emnes silhuet - tænke “brandfyldt tekst” eller “smeltet krom på et logo”. Tre typer skib i dag:

Heatmap

En glødende termisk glorie med animeret turbulens. Læser som ild, når du fylder tekst, og som en varm glød, når haloing en form.

    • Bedste for: * * Teksttitler, energieffekter, fokus
Ejendom Varebeskrivelse Standard
Tilstand Hvor skygger vises: * * Udfyld element * * / * * Halo omkring punkt * * / * * Overlæg (blanding på element) * * Udfyld element
Intensitet Lysstyrkemultiplikator (0- 1.5) 1.0
Radius Glødelængde (0.2- 1.5) 0.85
Palette Hot (rød / gul), Cool (blå / cyan), Violet Hot
Halo polstring Bounds ekspansion til udendørs halo (0- 1.5) 0.4
Offset X / Y Skifter skygger mønster center inden for grænser (-1 til 1) 0
Tint Farvevælger - biaser paletten mod denne farve (hvid = ingen bias) #ffffff

Flydende metal

Reflekterende krom flydende overflade med bandede striber og specular højdepunkter. Tre metalpaletter: * * Chrome * *, * * Guld * *, * * Kobber * *.

    • Bedste for: * * Logoer, premium- feel højdepunkter, metallisk typografi

Gem Smoke

Soft volumetrisk røgkrans med krøllebevægelse og indre gnister. Tre farvepaletter: * * White * *, * * Rose * *, * * Emerald * *.

    • Bedste for: * * Mystisk atmosfære, drømmende baggrunde, magiske afsløringer

Animationskanaler

Hver skygger effekt har to uafhængige animationskanaler (A og B), der kører forskellige visuelle aspekter. For Heatmap, der er * * Flow * * (baggrund turbulens) + * * Shimmer * * (høj frekvens detalje). For flydende metal er det * * Streaks * * (drift) + * * Bands * * (refleksion svingning). For Gem Smoke er det * * Drift * * (curl retning) + * * Sparkle * * (interne accenter).

Hver kanal udsætter:

      • Hastighed * * - 0 × fryser kanalen, 1 × = forudindstillet standard, op til 5 ×
      • Kurve * * - hvordan rå tid bliver transformeret:
Kurve Hvad det gør
Lineær Steady kontinuerlig strømning (standard - anbefales til “Flow” -type kanaler)
Sine Glat puls
Trekant Skarp puls
Pulse Kvadratbølge
Let Langsomt → hurtigt → langsomt
Sawtooth Ramp + nulstil
Bounce Forfaldne svingninger
Støj Tilfældig gåtur

Du kan blande kurver mellem A og B til layered bevægelse - fx, Heatmap med Flow på Linear og Shimmer på Pulse giver en stabil glød med en strobing detalje.

Stacking Shader- effekter

Du kan anvende mere end én skygger effekt på et enkelt element. Heatmap + Gem Smoke på samme billede giver dig en brændende glorie med røg wisps drivende gennem det. Hver effekt kører uafhængigt med sine egne paramer og kanaler. Knappen Clear Effects fjerner dem alle på én gang.

Kompositmodeller

    • Tilstand * * dropdown afgør hvordan skygger uddata blander sig med elementet:
      • Fyld element * * - skygger vises kun inde i emnets silhuet. Standard for tekst og figurer.
      • Halo omkring punkt * * - skygger vises kun uden for emnets kant. Bedste for uigennemsigtige former, der ønsker en glød.
      • Overlay (blanding på elementet) * * - skygger stylizes emnets eksisterende pixels via formere blanding. Standard for billeder.

Anvendelse af virkninger

  1. Vælg et element med valgværktøjet (V)
  2. I Egenskaber Panelet, finde * * Virkninger * *
  3. Klik på * * Tilføj effekt * *
  4. Vælg en effekttype
  5. Justér indstillinger som ønsket

Fjernelse af virkninger

  1. Vælg elementet med effekten
  2. I Egenskaber Panel, finde effekten
  3. Klik på * * × * knappen for at fjerne den

Flere effekter

Du kan anvende flere effekter på det samme emne. De vil alle spille samtidigt.

Effekttyper

Kategori Virkninger Opførsel
Kontinuerlig (partikel) Sparkle, Smoke, Fire, Rain, Snow, Ripple, Glow, Electric, Bubbles, Dust, Firefly, Trail Kør indtil fjernet
One- Shot Burst Blast, Confetti, Shockwave (uden interval) Spil én gang og forsvinde
Gentager sprængning Blast, Confetti (med interval) Re- trigger ved set interval
Shader (silhuet-klippet) Heatmap, flydende metal, Gem Smoke Kør indtil fjernet; flere stakke pr. element

Effekt vs. Animation

Funktion Animation Virkning
Hvad det gør Omdanner elementet (flytte, skalere, rotere) Tilføj visuelle elementer omkring elementet
Eksempler Pulse, hoppe, fade Sparkle spor, partikeleksplosion
Kombinere? 1 pr. emne Flere pr. element

Eksportkompatibilitet

Virkning MP4 GIF SVG
Sparkle ✅ ✅ Statisk
Blast ✅ ✅ ❌
Ild ✅ ✅ ❌
Røg ✅ ✅ ❌
Regn ✅ ✅ ❌
Sne ✅ ✅ ❌
Confetti ✅ ✅ ❌
Ripple ✅ ✅ ❌
Glow ✅ ✅ Statisk
Elektriske ✅ ✅ ❌
Heatmap (skygger) ✅ ✅ ❌
Flydende metal (skygger) ✅ ✅ ❌
Gem røg (skygger) ✅ ✅ ❌
    • SVG Begrænsninger: * * Virkninger er rammebaserede partikelsystemer og skygger-rengjorte overflader - hverken kort rent til statisk SVG. For fuld effekt animationer, eksportere som MP4 eller GIF.

Tips

Effekttips:

  • Sparkle effekter fungerer bedst på emner med klare skitser
  • Brand og røg for- varm automatisk - flammer vises øjeblikkeligt uden start forsinkelse
  • Brug blast og confetti sparsomt for slag øjeblikke
  • Regn og sne arbejde bedst på større emner eller full-lærred elementer
  • Kombiner glød med blanding tilstande for dramatisk belysning
  • Match effektfarver til dit design palette

Skydeeffekttips:

  • For tekst, * * Fyld element * * mode producerer en “fire- text” / “smoky- text” look. For figurer, prøv * * Halo omkring punkt * *. For billeder, * * Overlay * * bevarer billedet, mens toning det med skygger.
  • Stack flere skygger effekter på et element: heatmap på * * Fyld * * + perle _ røg på * * Halo omkring * * lag en glødende kerne under en røget halo.
  • Brug * * Offset X / Y * * til at skubbe heatmaps lyse punkt mod et hjørne i stedet for centrum - nyttigt for asymmetrisk “hot edge” udseende.
      • Tint * * farvevælger biaser paletten uden at miste struktur. Hold det hvidt for forudindtagets naturlige udseende.
  • Kanal kurver lader dig blande stabil flow med strobing detaljer. Prøv Heatmap med Flow = Linear og Shimmer = Pulse for en flikkende lys effekt.
  • Performance auto- tunes baseret på din enhed. På langsommere maskiner vil editoren stille og roligt droppe opløsning før frame rate; du kan låse et kvalitetsniveau via udviklerkonsollen (PinePaper.itemAuraSystem.setQualityTier(N)).
    • Relateret: * * [Animationer] (/features/animations)