Effecten

12 min read

Voeg visuele effecten toe om uw ontwerpen te verbeteren. PinePaper bevat 15 ingebouwde effecten variërend van deeltjessystemen tot milieusimulaties.

Beschikbare effecten

Sparkle

Een gloeiend deeltje dat de omtrek van je item volgt en een spoor van vonken achterlaat.

Beste voor: Logos, gemarkeerde tekst, magische thema’s

Eigenschap Omschrijving Standaard
Kleur Sparkle/glow kleur #fbbf24 (goud)
Snelheid Animatie snelheid vermenigvuldiger 1.0
Grootte Deeltjesstraal 2

Blast

Een explosie van deeltjes uit het midden van een item. Standaard Ă©Ă©n schot, of een interval instellen voor het herhalen van bursts.

Beste voor: Onthult, benadrukt, viert

Eigenschap Omschrijving Standaard
Kleur Deeltjeskleur #ef4444 (red)
Straal Explosieafstand 100
Aantal Aantal deeltjes 20
Interval Herhaal interval in seconden (0 = Ă©Ă©n schot) 0
Herhalen Aantal herhalingen (0 = enkel Ă©Ă©n schot) 0

Vuur

Organische vlamvormen met kleurverloop, sinusoĂŻdale golfanimatie en turbulentie. Vlammen voorwarmen automatisch zodat er geen koudestart gat.

Beste voor: Torches, kampvuren, dramatische nadruk

Eigenschap Omschrijving Standaard
Kleur Basiskleur voor automatisch gegenereerd verloop #fbbf24
Kleuren Aangepast verloop stopt array (overschrijft kleur) geel → oranje → rood
Aantal Spawn rate 12
Snelheid Spawn rate multiplier 1.5
Verspreiden Horizontale paaispreiding 0
Grootte Basisvlamgrootte 3
Hoogte Max. stijgingshoogte (0 = auto vanaf itemgrenzen) 0
Deeltjesleven Vlamlevensduur in seconden 1.5
Turbulentie Golfamplitudemultiplicator 1.0
Max. deeltjes Maximale gelijktijdige vlammen 30

Rook

Oplopende rook- of stoomdeeltjes met sinusoĂŻdale horizontale drift. Voorwarmers automatisch voor direct zicht.

Beste voor: Schoorstenen, stoom, atmosferische waas

Eigenschap Omschrijving Standaard
Kleur Rookkleur #888888
Aantal Spawn rate 15
Snelheid Spawn rate multiplier 1.0
Verspreiden Horizontale paaispreiding 0
Grootte Initiële deeltjesstraal 3
Drift Horizontale sinusoĂŻdale driftafstand 8
Hoogte Max. stijgingshoogte (0 = auto) 0
Deeltjesleven Levensduur van deeltjes in seconden 1.5
Groeipercentage Schaalgroei naarmate deeltjes stijgen 0.3
Max. deeltjes Max. gelijktijdige deeltjes 18

Regen

Downward regen strepen met configureerbare wind hoek en drop size.

Beste voor: Weerscènes, stemming, milieuachtergronden

Eigenschap Omschrijving Standaard
Kleur Regendruppelkleur #93c5fd (lichtblauw)
Aantal Spawn rate factor 15
Snelheid Fall speed multiplier 2.0
Hoek Windhoek (bij horizontale drift) 0
Verspreiden Horizontale paaispreidingsfactor 1.0
Grootte Raindrop lengte en breedte multiplier 1.0

Sneeuw

Langzaam vallende sneeuwvlokken met zachte horizontale drift en rotatie.

Beste voor: Winterscènes, vakantiethema’s, zachte sfeer

Eigenschap Omschrijving Standaard
Kleur Sneeuwvlokkleur #e2e8f0 (lichtgrijs)
Aantal Spawn rate factor 10
Snelheid Fall speed multiplier 0.5
Verspreiden Horizontale paaispreidingsfactor 1.5
Deeltjesleven Flake levensduur in seconden 4.0

Confetti

Kleurrijke tuimelende rechthoeken met natuurkundige zwaartekracht. Standaard Ă©Ă©n schot, of een interval instellen voor het herhalen van bursts.

Beste voor: Feesten, prestaties, feestthema’s

Eigenschap Omschrijving Standaard
Kleuren Array van confetti kleuren rood, geel, groen, blauw, paars
Aantal Deeltjes per barst 30
Straal Explosiesnelheidsbereik 150
Zwaartekracht Omlaagversnelling 200
Grootte Rechthoekgrootte 6
Verspreiden Spawn area spread 0
Verschuiving X/Y Middenverschuiving 0
Interval Herhaal interval in seconden (0 = Ă©Ă©n schot) 0
Herhalen Aantal herhalingen (0 = enkel Ă©Ă©n schot) 0

Rimpelen

Het uitbreiden van concentrische cirkels die uit het itemcentrum verdwijnen.

Beste voor: Waterdruppels, inslagpunten, sonar/radar

Eigenschap Omschrijving Standaard
Kleur Ringkleur #60a5fa (lichtblauw)
Snelheid Uitbreidingssnelheidsmultiplicator 1.0
Max Straal Maximale ringmaat 150
Aantal ringen Aantal te paaien ringen 3
Breedte van de streep Ringlijnbreedte 2

Gloei

Een pulserende aura achter het voorwerp dat schommelt in schaal.

Beste voor: Hoogtepunten, power-ups, aandacht trekken

Eigenschap Omschrijving Standaard
Kleur Gloeikleur #fbbf24 (goud)
Snelheid Polsfrequentievermenigvuldiger 1.0
Intensiteit Maximale dekking 0.6
Grootte Schaal oscillatiebereik (1.0 → deze waarde) 1.5

Elektriciteit

Flickend gekartelde bliksem bouten rond het item.

Beste voor: Energie, energie, sci-fi thema’s

Eigenschap Omschrijving Standaard
Kleur Boltkleur #67e8f9 (cyaan)
Snelheid Flicker rate multiplier 1.0
Aantal bollen Aantal gelijktijdige bouten 3
Lengte Steeklengte in beeldpunten 60
Flicker rate Flitsfrequentie in Hz 8

Bubbels

Rijzende transparante bubbels met spectaculaire hoogtepunten en zachte horizontale wiebel.

Beste voor: Onderwaterscènes, grillige thema’s, drankjes

Eigenschap Omschrijving Standaard
Kleur Kleur belrand #93c5fd (lichtblauw)
Aantal Spawn rate 6
Snelheid Snelheidsvermenigvuldiger verhogen 1.0
Grootte Bubbelstraal 5
Verspreiden Horizontale paaispreiding 1.0

Stof

Zwevende stofmotetten die zachtjes in de lucht drijven met subtiele beweging.

Beste voor: Atmosferische scènes, ouder/vintage looks, zonnestralen

Eigenschap Omschrijving Standaard
Kleur Stofkleur #d4c5a9 (warme beige)
Aantal Aantal motels 15
Snelheid Snelheidsvermenigvuldiger 1.0
Grootte Grootte 2
Verspreiden Oppervlaktespreiding 1.0

Vuurvliegen

Gloeiende stippen die organisch dwalen met soepel stuurgedrag.

Beste voor: Nachtscènes, magische bossen, omgevingsachtergronden

Eigenschap Omschrijving Standaard
Kleur Firefly gloeikleur #fde68a (warmgeel)
Aantal Aantal vuurvliegen 8
Snelheid Snelheidsvermenigvuldiger 1.0
Grootte Gloeistraal 4

Schokgolf

Een enkele uitdijende ring die naar buiten schiet vanuit het item centrum. One-shot burst effect.

Beste voor: Impactmomenten, power-ups, dramatische onthullingen

Eigenschap Omschrijving Standaard
Kleur Ringkleur #f97316 (oranje)
Straal Max. uitbreidingsstraal 150

Spoor

Een hardnekkig pad van deeltjes die het item volgen terwijl het beweegt.

Beste voor: Objecten verplaatsen, padvisualisatie, komeetstaarten

Eigenschap Omschrijving Standaard
Kleur Trail kleur #fbbf24 (goud)
Snelheid Vervaagsnelheid 1.0
Grootte Splitsgrootte spoor 3

Schaduweffecten (silhouet-geknipt)

Een nieuwe familie van GPU-gerenderde effecten toegevoegd in v0.5. Anders dan deeltjes effecten, shader effecten zijn continue geanimeerde shaders samengesteld tegen de silhouet van uw item "denk “brand-gevulde tekst” of “molten chroom op een logo.” Drie types schip vandaag:

Warmtekaart

Een gloeiende thermische halo met geanimeerde turbulentie. Leest als vuur bij het vullen van tekst, en als een hete gloed bij het halogen van een vorm.

Beste voor: Teksttitels, energie-effecten, nadruk op aandacht

Eigenschap Omschrijving Standaard
Modus Waar de shader verschijnt: Vul item / Halo around item / Overlay (blend on item) Vul item
Intensiteit Helderheidsvermenigvuldiger (0 1.0
Straal Glow falloff afstand (0,2 0.85
Palet Heet (rood/geel), Cool (blauw/cyaan), Violet Heet
Halovulling Bounds uitbreiding voor buitenhalo (0 0.4
Verschuiving X / Y Verschuift het shaderpatrooncentrum binnen de grenzen (-1 tot 1) 0
Tint Kleurenplukker Breidt het palet in de richting van deze kleur (wit = geen bias) #ffffff

Vloeibaar metaal

Reflectieve chroom vloeiende oppervlak met gebonden strepen en spectaculaire hoogtepunten. Drie metalen paletten: Chrome, Goud, Copper.

Beste voor: Logos, premium-feel highlights, metallic typografie

Gem Rook

Zachte volumetrische rook krans met curling beweging en interne sprankelen. Drie kleurenpaletten: White, Rose, Emerald.

Beste voor: Mystieke sfeer, dromerige achtergronden, magische onthullingen

Animatiekanalen

Elke shader effect heeft twee onafhankelijke animatiekanalen (A en B) die verschillende visuele aspecten. Voor Heatmap is dat Flow (background turbulentie) + Shimmer (high-frequency detail). Voor vloeibaar metaal is het Streaks (drift) + Bands (reflectie oscillatie). Voor Gem Smoke is het Drift (curl direction) + Sparkle (interne accenten).

Elk kanaal toont:

  • Speed* 0Ă— bevriest het kanaal, 1Ă— = vooraf ingestelde standaard, tot 5Ă—
  • Curve Hoe de ruwe tijd verandert:
Kromme Wat het doet
Lineair Steady continu flow (optioneel aanbevolen voor “Flow”-kanalen)
Sinus Glad hartslag
Driehoek Scherpe hartslag
Pols Aan/uit vierkante golf
Makkelijk Langzaam → snel → langzaam
Zaagtand Ramp + reset
Bounce Oscillatie wordt afgebroken
Geluid Willekeurige wandeling

U kunt bochten mengen tussen A en B voor gelaagde beweging .

Stapelende schaduweffecten

U kunt meer dan Ă©Ă©n shader effect toepassen op een enkel item. Heatmap + Gem Smoke op dezelfde afbeelding geeft je een vurige halo met rookwips die er doorheen zweven. Elk effect loopt onafhankelijk met zijn eigen params en kanalen. De Clear Effects-knop verwijdert ze allemaal tegelijk.

Samengestelde modus

De Mode dropdown bepaalt hoe de shader uitgang zich met het item vermengt:

  • Invullen item Standaard voor tekst en vormen.
  • Halo around item Het beste voor ondoorzichtige vormen die een gloed willen.
  • Overlay (vermengen op item) Standaard voor afbeeldingen.

Effecten toepassen

  1. Selecteer een item met het selectiegereedschap (V)
  2. In het Eigenschappenpaneel vindt u Effecten
  3. Klik op Add Effect
  4. Kies een effecttype
  5. Instellingen aanpassen naar wens

Effecten verwijderen

  1. Selecteer het item met het effect
  2. In het Eigenschappenpaneel, vind het effect
  3. Klik op de knop Ă— om het te verwijderen

Meerdere effecten

U kunt meerdere effecten toepassen op hetzelfde item. Ze zullen allemaal tegelijk spelen.

Effecttypes

Categorie Effecten Gedrag
Continu (partikel) Sparkle, Smoke, Fire, Rain, Snow, Ripple, Glow, Electrical, Bubbles, Dust, Fireflies, Trail Uitvoeren tot verwijderd
One-shot Burst Blast, Confetti, Shockwave (zonder interval) EĂ©n keer spelen en verdwijnen
Burst herhalen Blast, Confetti (met interval) Hertriggeren met ingestelde interval
Schaduw (silhouet-geknipt) Warmtekaart, vloeibaar metaal, Gem Smoke Uitvoeren tot verwijderd; meerdere stapels per item

Effect vs. animatie

Functie Animatie Effect
Wat het doet Het item transformeert (verplaatsen, schalen, roteren) Voegt visuele elementen toe rond het item
Voorbeelden Pols, bounce, fade Sparkle trail, deeltjesexplosie
Combineren? EĂ©n per stuk Meerdere per item

Compatibiliteit exporteren

Effect MP4 GIF SVG
Sparkle âś… âś… Statisch
Blast ✅ ✅ ❌
Vuur ✅ ✅ ❌
Rook ✅ ✅ ❌
Regen ✅ ✅ ❌
Sneeuw ✅ ✅ ❌
Confetti ✅ ✅ ❌
Rimpelen ✅ ✅ ❌
Gloei âś… âś… Statisch
Elektriciteit ✅ ✅ ❌
Hittekaart ✅ ✅ ❌
Vloeibaar metaal ✅ ✅ ❌
Gem Rook (schaduw) ✅ ✅ ❌

SVG Beperkingen: Effecten zijn frame-gebaseerde deeltjessystemen en shader-gerenderde oppervlakken . Geen van beide kaarten schoon naar statische SVG. Voor full effect animaties, exporteren als MP4 of GIF.

Tips

Effecttips:

  • Sparkle effecten werken het beste op items met duidelijke contouren
  • Brand- en rookvoorwarm automatisch vlammen verschijnen onmiddellijk zonder opstartvertraging
  • Gebruik blast en confetti spaarzaam voor inslagmomenten
  • Regen en sneeuw werken het beste op grotere items of full-canvas elementen
  • Combineer gloed met blend modes voor dramatische verlichting
  • Pas effectkleuren aan uw ontwerppalet aan

Tips voor het schaduweffect:

  • Voor tekst, Fill item mode produceert een “fire-text” / “smoky-text” look. Voor vormen, probeer Halo rond item. Voor afbeeldingen behoudt Overlay de afbeelding tijdens het kleuren met de shader.
  • Stapel meerdere schaduweffecten op Ă©Ă©n item: warmtekaart op Fill + gem smoke op Halo rond legt een gloeiende kern onder een rokerige halo.
  • Gebruik Offset X/Y om de heldere plek van de warmtekaart naar een hoek te duwen in plaats van naar het midden.
  • De Tint kleur picker bevooroordeelt het palet zonder structuur te verliezen. Hou het wit voor de natuurlijke look van de preset.
  • Channel curves laten je stabiele stroom mengen met strobing detail. Probeer Heatmap met Flow=Linear en Shimmer=Pulse voor een flikkerend kaarseffect.
  • Performance auto-tunes gebaseerd op uw apparaat. Op langzamere machines zal de editor de resolutie voor de framesnelheid stilletjes laten vallen; u kunt een kwaliteitsniveau vergrendelen via de ontwikkelaarconsole (PinePaper.itemAuraSystem.setQualityTier(N)).

Gerelateerd: Animatie