Volledige versie bekijken : Special Effects Experiment - SFX
mknol
%Europe/Berlin %948 %2010, 23:45
Het is tijd voor iets nieuws! Vanaf nu zul je regelmatig een experiment vinden op FlashFocus waar je zelf aan mee kunt doen. Inmiddels kennen we de battles en de competities. Experimenten zijn battles die blijven bestaan. Er is dus geen einddatum en de poll blijft lopen.
Als je specifieke vragen hebt over het experiment of over hoe je bepaalde onderdelen moet toepassen willen we graag dat je een nieuw forum topic start, bijvoorbeeld met [experiment: titel] in het onderwerp, zodat het voor iedereen duidelijk is.
Wij starten met een thema waaraan jij helemaal los kan gaan: Special Effects!
Special Effects Experiment - SFX
Special Effect - SFX. Maak een coole filter, vet effect of iets anders zolang het maar met SFX te maken heeft. Dit kan en mag je scripten of animeren. Om je een beetje opweg te helpen voor inspiratie kan je een kijkje nemen op demoscene (http://www.demoscene.tv/) of Flight404 (http://vimeo.com/7578615). Daarbij heeft onze Neuro speciaal voor dit experiment een tutorial/voorbeeld gemaakt, deze kun je hier bekijken (http://www.flashfocus.nl/forum/blog.php?b=40).
Inleveren
Plaats een link naar je inzending in een nieuwe post hier! [:)]
Dus
Maak een vet effect of coole filter.
Post je source code.
Iedereen veel succes en vooral veel plezier met experimenteren!! [:)]
Ea.Z
%Europe/Berlin %733 %2010, 18:36
Ik heb een weekje geleden ook geprutst met iets gelijkaardig als het voorbeeld van Neuro.
http://labs.nocreativity.com/particles/one/
http://labs.nocreativity.com/particles/two/
Meer info en source staat hier:
http://nocreativity.com/blog/particle-power
Een leuk effectje dat ik ooit gemaakt heb is voor een imageviewer. Vond het wel leuk om dit eens te doen
http://labs.nocreativity.com/imagefx/
(duw op spatie om de snelheid van het effect te togglen tussen snel en traag)
Ik vind dit soort experimenteren HEERLIJK :D
cornedor
%Europe/Berlin %902 %2010, 22:39
ik wil soort gelijk gebruiken als achtergrond voor nieuwe website als het snel genoeg gaat, moet dat nog even testen: http://beta.corne.info/ (In haXe)
EDIT: Te zwaar voor browser
mknol
%Europe/Berlin %950 %2010, 23:48
Wow dat is wel impressive als het zo groot is, cornedor. Alleen niet echt bruikbaar als achtergrond, cpu staat op 50% :)
cornedor
%Europe/Berlin %903 %2010, 22:40
ah ok, moet ik toch iets anders verzinnen ga even verder rommelen.
EDIT: Heb er wat op verzonnen je kunt nu aan het begin kiezen of je hoge of lage kwaliteit heb bij hoge kwaliteit zijn er 20000 particles en bij lage 2000.
Ea.Z
%Europe/Berlin %211 %2010, 06:05
Hoe bewerk je je bitmapdata?
loopen door al je pixels en updaten met setPixel?
Of alle waarden opslaan in 1 vector, en die vector commiten via setPixels?
cornedor
%Europe/Berlin %732 %2010, 18:35
met een for(part...particles){...bmd.setPixel(part.x, part.y,} // particles = vector
http://beta.corne.info/Main.hx
http://beta.corne.info/Particle.hx
Ea.Z
%Europe/Berlin %446 %2010, 11:42
Tips om nog sneller te loopen:
Gebruik een linked list ipv een for loop.
//linked list voorbeeld
//particle class
package{
public class Particle{
public var next:Particle;
//andere properties
}
}
//maak in je main class een globale particle aan. Dit is je eerste particle van deze list
private var list:Particle;
//lijst met particles aanmaken (eenmalige for loop)
private function setupParticles():void{
var prev:Particle = list = new Particle(); // de eerste particle opzetten
var i:uint;
while (++i <= 20000){
var p:Particle = new Particle();
//particle shit opzetten
prev.next = p;
prev = p;
}
}
// nu heb je een linked list van particles, en daar kun je iets sneller door loopen. Dat doe je als volgt:
var p:Particle = list; //eerste particle ophalen
while ((p = p.next) != null){
//doe stuff met je particle!
}
Je gebruikt setPixel. Dat is op zich ook een trage operatie. En gezien je deze per particle eens doet maak je die vertraging ± 20000 keer groter ( op zo'n moment besef je dat 1ms echt verschil maakt: 20000 * 0.001s = 2s ;))
Je kunt beter de pixels van je bitmap bewerken in een vector, en die dan volledig wegschrijven naar je bitmap in 1 hap
//globale vector met pixeldata
private var pixels:Vector.<uint>;
//pixels ophalen van je bitmap
pixels = bmd.getPixels(bmd.rect);
//bewerkingen uitvoeren doe je nu op die vector wat gewoon sneller gaat
//daarna updat je de bitmapdata
bmd.lock();
bmd.setVector(bmd.rect,pixels);
bmd.unlock();
Als je hiermee rekening houdt kun je mss een paar frames terug winnen ;)
mknol
%Europe/Berlin %866 %2010, 21:47
Linked lists zijn inderdaad wel wat sneller en ik vind het qua code voor dergelijke dingen nog wel duidelijker ook als je het eenmaal even door hebt.
Ik heb ben zeer geïnspireerd door Neuro aan de gang gegaan met een eigen particle ding. Echt leuk om mee te spelen. Heb vooral geleerd dat ik niet perse een bewegend perlinnoise hoef te gebruiken (wat ik dus eigenlijk altijd deed, vraag me niet waarom). Het berekenen van de perlin is vrij zwaar.
http://projects.stroep.nl/sfx/
Daarbij had ik al eerder wat particle-testjes gedaan, zoals bijvoorbeeld deze:
http://projects.stroep.nl/particles/
De code van deze gebruikt helemaal geen particles (alszijnde objecten), maar berekend rechtstreeks de punten waar ie iets moet setPixelen (heb hier nog geen vector gebruikt)
Neuro
%Europe/Berlin %843 %2010, 21:15
Je kunt beter de pixels van je bitmap bewerken in een vector, en die dan volledig wegschrijven naar je bitmap in 1 hap
//globale vector met pixeldata
private var pixels:Vector.<uint>;
//pixels ophalen van je bitmap
pixels = bmd.getPixels(bmd.rect);
//bewerkingen uitvoeren doe je nu op die vector wat gewoon sneller gaat
//daarna updat je de bitmapdata
bmd.lock();
bmd.setVector(bmd.rect,pixels);
bmd.unlock();
Het probleem zit hem in de bewerkingen uitvoeren op die vector, hoe ga je dat doen? Het kan wel, maar of het sneller gaat zijn betwijfel ik :)
De linked list zal wel iets sneller zijn. :)
allemensen
%Europe/Berlin %961 %2010, 00:04
Waarschijnlijk is setPixel gewoon langzaam omdat het een function call is. Omdat een vector in één function call ipv meerdere gebruikt kan worden maakt het verschil.
Bij de vuurwerk-battle heb ik ook alle functies moeten inlinen, dat scheelde de helft van de framerate (per particle had ik een functieaanroep)
Op zich kan een linked-list waarschijnlijk ook, maar die moet je dan omzetten in een vector naderhand, en dat kost ook weer tijd.
BTW, ziet iemand anders ook de flitsen tijdens de inzendingen in dit topic? Het zal waarschijnlijk aan flash-player op linux liggen :(
cornedor
%Europe/Berlin %988 %2010, 00:43
is inderdaad een bug in de flashplayer van linux.
Neuro
%Europe/Berlin %738 %2010, 18:44
Vandaag dacht ik, wat zou er gebeuren wanneer je de partikles met elkaar zou verbinden met lijntjes
http://www.neuroproductions.be/ff/PerlinNoiseTest.swf
Ik heb me altijd afgevraagd hoe ze zoiets maken, nu weet ik het :D8D
Ea.Z
%Europe/Berlin %499 %2010, 12:59
Ziet er nice uit, Kris! Kan er zo honderden bekijken en het nog altijd spannend vinden :D
fledermaus
%Europe/Berlin %645 %2010, 16:30
mag ik die broncode eens bekijken? 'k vind dat effect wel tof. Of is die code niet beschikbaar ;-)
Neuro
%Europe/Berlin %774 %2010, 19:34
mag ik die broncode eens bekijken? 'k vind dat effect wel tof. Of is die code niet beschikbaar ;-)
source code in bijlage (is niet opgekuist) :)
nuvorm
%Europe/Berlin %601 %2010, 15:26
geen source op het moment, wel een saveable png spritesheet.
http://www.nuvorm.nl/start/index.php?option=com_content&view=category&layout=blog&id=40&Itemid=53
Neuro
%Europe/Berlin %832 %2010, 20:58
netjes nuvom!
Nu ben ik wel benieuwd naar de source code ;)
nuvorm
%Europe/Berlin %505 %2010, 13:07
bij deze de source code dan...
Neuro
%Europe/Berlin %750 %2010, 19:01
nog eens iets geprobeerd :)
http://www.neuroproductions.be/ff/SmokeTransition.swf
Ea.Z
%Europe/Berlin %846 %2010, 21:19
Geil neuro! Echt! Vet effect!
Zou niet direct weten hoe ik aan deze begin :D
Neuro
%Europe/Berlin %609 %2010, 15:37
Zou niet direct weten hoe ik aan deze begin :D
Is makkelijker dan het lijkt ;)
Een beetje uitleg en de source code:
http://www.neuroproductions.be/experiments/particle-transition/
Salvago
%Europe/Berlin %641 %2010, 16:24
Staat wel bakken vol spellingsfouten :D (voornaamste toch wel 'quite' en een typo 'good for me').
En inderdaad, qua werking is het niet eens zo diepgaand, maar het effect mag er zijn. Die blur doet trouwens ook veel goeds, als je 'm af zet is het plots een stuk duidelijker wat er gebeurt.;)
Altijd leuk om dergelijke dingen te zien.
Niet echt een SFX, maar misschien ook grappig: Mijn sig is ook pure coded. Wat perlin noise bitmaps, wat geklooi, en je hebt een oneindig scrollend landschap.
Neuro
%Europe/Berlin %875 %2010, 22:01
Staat wel bakken vol spellingsfouten :D (voornaamste toch wel 'quite' en een typo 'good for me').
:D die 2 heb ik er uitgehaald.
Zelfde effect nog eens geprobeerd, maar in hoge(re) kwaliteit
http://www.neuroproductions.be/generative-art/blowing-up-images/
Salvago
%Europe/Berlin %902 %2010, 22:39
Very nice 'modern art'-tsy stuff. Komt een stuk beter tot z'n recht in hr! ;)
Ea.Z
%Europe/Berlin %553 %2010, 14:17
Kheb er een AIR app rond gebouwd, Neuro, die elke frame van het proces exporteerd (PNG sequence), dus nu kun je HQ renders genereren van eenders welke image. :D
Moet de AIR app wel nog wat afwerken, maar het resultaat is ok ;)
http://shots.nocreativity.com/77f84271f1ce5db8b64399b98667beaf.jpg
http://shots.nocreativity.com/0e6af7b3f0018963be3bf3c4bd494a5b.jpg
http://shots.nocreativity.com/84cc7c76475ae420e0a70ad476d5b8bf.jpg
http://shots.nocreativity.com/7363d6cbb37fb3a5331289ddd950f489.jpg
http://shots.nocreativity.com/1b73230e1659a675c022fc71ece45d1d.jpg
http://shots.nocreativity.com/22caf9d4db9403eb8117445516f931e8.jpg
App komt later ;)
Neuro
%Europe/Berlin %794 %2010, 20:04
Nice,
Ik had er ook aan gedacht, maar had er niet zoveel zin in. Cool dat jij er mee bezig bent :)
Ea.Z
%Europe/Berlin %070 %2010, 02:42
http://www.vimeo.com/12379381
;)
marcvz
%Europe/Berlin %075 %2010, 02:49
Gaaf hoor! Vind het echt een tof effect.
Voor een highres toepassing zoals Ea.Z laat zien kun je jezelf afvragen of je niet beter After Effects kunt gebruiken ipv 14GB! :P aan images te renderen.
Maar vanuit experimenteel oogpunt is het erg tof.
Ik heb zelf eigenlijk nog nooit iets in die richting met flash gedaan.. Begint nu wel te kriebelen.
Salvago
%Europe/Berlin %079 %2010, 02:54
Dat is ook een manier om de middag door te komen...:P
Ziet er overigens wel heel strak uit.
Over het effect zelf: Het pikt wat snel (mij iets te) op in het begin, en gaat dan vrij snel dood. Als het effect kort is merk je het niet zo, maar zoals in je vid wel. Rond de 10 sec zijn de particles al ongeveer in hun eind formatie, en draaien dan allen nog wat sloompjes rond. Misschien kun je een effect speed bias toevoegen om dit wat gelijkmatiger te distribueren. Al lijkt het me sterk dat je dit nog eens gaat renderen :D.
Ea.Z
%Europe/Berlin %378 %2010, 10:05
Lol Marc: Wat je zegt is absoluut de waarheid: Toen ik dit in aan het exporteren was vanuit Premiere vroeg ik me ook af 'had ik dit eigelijk niet direct vanuit AE kunnen bereiken?'
Natuurlijk hebben we hier wel een zelf geprogrammeerde controle, over hoe elke pixel beweegt.
En idd: deze video was vooral om te ontdekken hoeveel seconden video leuk is om naar te kijken. 15seconden lijkt mij zowat alles te zijn wat ik ervan verwacht. Alles daarna is relatief saai.
En: jawel, hier zullen nog versies van uitgerenderd worden :D
Neuro
%Europe/Berlin %529 %2010, 13:42
Echt vet Ronny! Ik heb de video toegevoegd aan men blog post :)
Ea.Z
%Europe/Berlin %640 %2010, 16:22
Thx man! :D
Ik verschiet er eigelijk van dat ik zelf niet op het idee gekomen ben toen ik eerder bezig was met particles.
Het grootste verschil nu is dat we niet particles niet random positioneren (maar mooi in een grid), en dat die particles de kleur van de overeenstemmende pixels in de startfoto hebben...
Maar het effect is zoveel leuker!
Ik vind jouw resultaten trouwens erg vet. Zitten leukere kleuren in. Heb ik te laat beseft toen ik bezig was met deze render te maken. Zal in de loop van de dagen nog een paar versies maken (Generative art is echt een vrijkaart om hetzelfde 1000 keer over te doen en het nog cool te vinden :D )
Neuro
%Europe/Berlin %707 %2010, 17:58
Ik vind jouw resultaten trouwens erg vet. Zitten leukere kleuren in. Heb ik te laat beseft toen ik bezig was met deze render te maken. Zal in de loop van de dagen nog een paar versies maken (Generative art is echt een vrijkaart om hetzelfde 1000 keer over te doen en het nog cool te vinden :D )
Die kleuren zijn niet altijd origineel ;) photoshop -> hue-saturation-contrast-...
Met gereratieve art moet je ook veel afbeeldingen maken en dan de beste er uitkiezen. Gelukkig wordt het, zoals je zegt, niet snel saai. Ik blijf het ook fascinerend vinden. Als ik niet moest werken, was ik ook nog steeds bezig :p
Ea.Z
%Europe/Berlin %924 %2010, 23:11
Die kleuren zijn niet altijd origineel ;) photoshop -> hue-saturation-contrast-...
Cheater! :o :p
Neuro
%Europe/Berlin %948 %2010, 23:46
Cheater! :o :p
bwa, half, ik heb ze vooral op voorhand geprepareerd voor de kleuren
eigenlijk redelijk bizar is ik het nu terug bekijk :D
http://www.neuroproductions.be/ff/startImage.png
=
http://www.neuroproductions.be/uploads/blog/examples/noise_generative_art/generative_art_4.png
Ea.Z
%Europe/Berlin %958 %2010, 23:59
Whoa! Shit!
Cool gast! :D
Kwas ook aan't denken om wat kleuren te schilderen, en dan vanuit daar te starten...
uiteindelijk niet gedaan, omdat de video's toch de begin frame laten zien :D
Bizar idd, maar ziet er echt vet uit :D
mknol
%Europe/Berlin %382 %2010, 10:10
Wow: super koele shit. Het effect + de video is ook geniaal! Binnenkort even kijken of dit nog verder kan evolueren. :D
ps. kan je dit in AE wel doen?
W0utR
%Europe/Berlin %196 %2010, 05:42
Waarschijnlijk de meest domme vraag ooit, maar hoe krijgen jullie in de eerste plaat zo'n bitmap al omgezet naar bassicly 1 particle per pixel?
Je moet toch op een of andere manier elke particle aanmaken en op de juiste plaats krijgen?
var prev:Particle = list = new Particle();
for(var i:uint = 0; i < image.width; i++)
{
for(var j:uint = 0; j < image.height; j++)
{
var p:Particle = new Particle();
p.x = i;
p.y = j;
p.color = colors[i * j];
this.addChild(p);
prev.next = p;
prev = p;
}
}
En als je dan een bitmap van 500x500 hebt is dit al niet te doen
mknol
%Europe/Berlin %373 %2010, 09:58
Nou 'de truc' is dat je Particle class geen sprite is, maar gewoon een object met x en y waardes. Je hoeft deze dus ook niet te addChilden. Vooral omdat het om pixel-dingen gaat, moet je een bitmapdata object maken en daar de getPixel en setPixel functies van gebruiken.
In geval van jouw voorbeeld zou de init zo worden:
ps: let op ik heb je loop omgedraait
var prev:Particle = list = new Particle();
for(var i:uint = 0; i < image.height; i++)
{
for(var j:uint = 0; j < image.width; j++)
{
var p:Particle = new Particle();
p.x = j;
p.y = i;
p.color = bitmap.bitmapData.getPixel(j, i);
prev.next = p;
prev = p;
}
}
W0utR
%Europe/Berlin %557 %2010, 14:22
Aha, dat gaat al iets beter, ik neem aan dat jullie ook een enter frame gebruiken om alles te laten bewegen, nu lukt dat wel, maar alles gaat gewoon in schokjes.
Of hebben jullie hier een andere oplossing voor?
Neuro
%Europe/Berlin %861 %2010, 21:40
dat hangt er wat vanaf wat je doet, en hoeveel particles dat je hebt.
bv 500x500 px = 250 000 particles. Dat is wat veel om per frame te bereken en te renderen.
Dus dan is het normaal dat het wat schokt ;)
W0utR
%Europe/Berlin %908 %2010, 22:47
Ik had het daarna ook geprobeerd met een kleinere afbeelding en toen kreeg ik wel een goed resultaat, nu nog wat spelen met het bewegen van de particles
Ea.Z
%Europe/Berlin %954 %2010, 23:54
Wouter, bekijk anders de source van de HQ versie van Kris eens: Daar kun je zien hoe hij die grote massa pixels frame per frame beweegt. Heeft hij gedaan met timeouts.
Als je echt goede framerates wilt halen ga je met 10 000 particles tevreden moeten zijn ;)
En zelfs dan moet je oppassen hoe complex je de effecten maakt:
http://labs.nocreativity.com/particles/one/?inspired%20by%20Ralph%20Hauwert
(10 000 particles met blur enabled)
http://labs.nocreativity.com/particles/one/noblur/?inspired%20by%20Ralph%20Hauwert
(zelfste setup maar nu zonder blur)
Scheelt al wat in de framerate ;)
Met wat meer optimalisatie kon er zelfs nog wat meer bij :D
sandersnake
%Europe/Berlin %610 %2010, 15:39
Dit topic plus de sessie van Ralph Hauwert tijdens FITC Amsterdam inspireerde me zeer om me eens meer te verdiepen in particles, vectors, bit shifting en bitmap drawing. Check het resultaat hieronder:
http://www.actionscripter.nl/images/particlestorm.jpg (http://www.actionscripter.nl/particlestorm)
nuvorm
%Europe/Berlin %618 %2010, 15:50
very nice !
Neuro
%Europe/Berlin %956 %2010, 23:57
Wat aan het spelen met strange attractors. Niets nieuw natuurlijk, maar wel leuk om je eigen formules te verzinnen
-> http://bit.ly/bYYUGe
http://www.flashfocus.nl/forum/attachment.php?attachmentid=9808&stc=1&d=1279227197
mknol
%Europe/Berlin %838 %2010, 21:07
Ik zag hier nog een gaaf particle effect met 100.000 3d particles.
http://www.flashandmath.com/flashcs4/lightmore/index.html
Erg goed weer, die strange attractors Neuro. Hoe rendert hij precies aan de rechterkant? Trekt hij dan lijnen ofzo tussen bepaalde punten?
Neuro
%Europe/Berlin %848 %2010, 21:22
Hoe rendert hij precies aan de rechterkant? Trekt hij dan lijnen ofzo tussen bepaalde punten?
neen, zijn gewoon punten, maar de bitmap is 50% gescaled en hij zet punten met een erg lage alpha. Dan zet hij per frame een 20000 punten ofzo, zo krijg je die hoge kwaliteit :)
ik zal een van de dagen de source eens posten (heb het hier niet direct bij de hand)
mknol
%Europe/Berlin %911 %2010, 22:53
Ahhh..!! :D Slim gedaan man, het ziet er echt ook super strak + hoge kwaliteit uit.
ishi99
%Europe/Berlin %571 %2010, 14:42
Gaaf effect hoor! Thx!
cornedor
%Europe/Berlin %989 %2010, 00:44
Ik was begonnen aan een game of life, ging na een tijdje niet helemaal goed, resultaat:
CPU (http://mijnbierkrat.nl/Effects/WrongGOL/)/GPU (http://mijnbierkrat.nl/Effects/WrongGOL/?gpu=true)
source: http://mijnbierkrat.nl/Effects/WrongGOL/Main.hx (haXe)
cornedor
%Europe/Berlin %971 %2010, 00:19
En nog een "effect":
http://corne.testingserver.nl/effects/GradientFail.swf
Source: http://corne.testingserver.nl/effects/Main.hx
WernerL
%Europe/Berlin %968 %2010, 23:13
Voor school een screensaver ding in as3 moeten programmeren.
Ik heb er dit van gemaakt :D
http://media.monkeyminds.nl/particles2/
Ja de code voor het bewegen van de particles heb ik zonder schaamte gejat van Neuro. ;)
En die 2 dingen die in een cosinus beweging bewegen slaan nergens op maar ik moest 2 effecten programmeren.
rackdoll
%Europe/Berlin %458 %2011, 11:59
http://blog.rackdoll.nl/?p=717
http://blog.rackdoll.nl/?p=943
http://blog.rackdoll.nl/?p=738
http://blog.rackdoll.nl/?p=575
http://blog.rackdoll.nl/?p=306
zoiets ? :)
Ea.Z
%Europe/Berlin %640 %2011, 16:21
Die laatste doet me denken aan het PS3 home screen :D
Erg vet!
Ben best benieuwd hoe jullie (neuro en jij) dat 3D landschap gemaakt hebben. Kheb de source van neuro al eens vluchtig bekeken maar ik snapte niet meteen hoe het aangepakt werd. Hou je vooral niet in om ff uit te leggen wat er achter de schermen gebeurt :D
rackdoll
%Europe/Berlin %652 %2011, 16:39
In basis komt het neer op het volgende per tick:
- render een perlinnoise bitmap ( 1 pixel hoog, veeel pixels breedt - continues perlinnoise.. of hoe dat ook mag heten )
- loop door de perlin map, translate kleur naar hoogte var.
- teken per pixel een lijntje met specifieke hoogte; de lijnkleur is afhankelijk van de hoogte ( blauw -> groen -> bruin - > wit )... Ik reken dit uit.. Neuro gebruikt hier een lookup image voor...
- teken lijn in uiteindelijke bitmap data object.
- scroll bitmap data object.
- start weer vooraan.
... dat is in essentie de basis.
rackdoll
%Europe/Berlin %655 %2011, 16:43
En nog een "effect":
http://corne.testingserver.nl/effects/GradientFail.swf
Source: http://corne.testingserver.nl/effects/Main.hx
wel grappig...
Mr. Doob heeft een hele tijd geleden toevallig exact hetzelfde gemaakt.... ;)
http://mrdoob.com/lab/actionscript/effects/1k/flaxor.swf (http://mrdoob.com/lab/actionscript/effects/1k/flaxor.swf)
rackdoll
%Europe/Berlin %660 %2011, 16:51
Ik zag in eerste posts bij dit onderwerp wat loops om particles aan te maken.
Dit is mijn particle creatie en rendering loop.
//creatie:
public var head:Particle;
public function create( $amount:uint = 10000):void {
var temp:Vector.<Particle> = new Vector.<Particle>($amount,true);
var loopCount:int = int( temp.length-1);
var endCount:int = loopCount;
while( loopCount ){
temp[loopCount] = new Particle();
if( loopCount < endCount )temp[loopCount].next = temp[loopCount+1];
loopCount--;
}
head = temp[0];
temp = null;
}
//render:
public function render():void {
var current:Particle = head;
while(current){
current.update();
current = current.next;
}
}
voila!
cornedor
%Europe/Berlin %732 %2011, 18:34
:) Die van Mr. Doob had ik nog niet gezien, Verveelde me vandaag op school dus heb dit maar even gemaakt: http://files.corne.info/ff/SoundTo3D/SoundTo3D.swf
Moet nog wel even performance wat verbeteren, ik maak nu van de muziek een 2D bitmapdata en doe dan getPixel, is natuurlijk beetje om :) Verder is nog niet mooi afgewerkt
Corné
mknol
%Europe/Berlin %889 %2011, 22:20
Dit is mijn particle creatie en rendering loop.
Wat een zeer ongebruikelijke manier dat je stiekum toch een tijdelijke Vector gebruikt. Het idee van linked lists is toch juist dat je geen Arrays gebruikt, omdat die te langzaam performen (vooral het erdoorheen loopen dan).
Daarbij valt me ook op je ook 3 keer defineerd hoelang de loop moet zijn. Bij jou is temp.length -1 gelijk aan loopcount en die is weer gelijk aan endCount, terwijl de waarde gewoon $amount is.. ? Die laatste zou ik dan ook gewoon gebruiken.
Je create functie kan dus veel simpeler. Ik heb hier een testclass die laat zien hoe. Misschien kun je er wat mee.
package
{
import flash.display.Sprite;
/**
* @author Mark Knol
*/
public class Main extends Sprite
{
public var head:Particle;
public function Main():void
{
trace("start creating")
create(5);
trace("check some indexes")
trace("head.next.INDEX",head.next.INDEX);
trace("head.next.next.next.INDEX",head.next.next.next.INDEX);
}
public function create(amount:uint = 10000):void
{
var lastPoint:Particle = head = new Particle();
while( --amount > 0)
lastPoint = lastPoint.next = new Particle();
}
}
}
final class Particle
{
public static var I:int;
public const INDEX:int = I++; // auto-increment
public var next:Particle;
public function Particle()
{
trace(INDEX);
}
public function update():void
{
// do something
}
}
Verder zien je experimenten er heel koel uit. Vooral die landscape met het vliegtuig is erg gaaf! :D Blijf dus lekker posten!!
@cornedor; zo ziet er ook lekker uit, werkt al aardig hoor. Beetje kleur kan nog geen kwaad :)
PsK
%Europe/Berlin %996 %2011, 00:54
Agree met mKnol je experimenten zien er cool uit. :D
Je render loop kan ook nog iets sneller. Als je performance kritische loops maakt kan je het beste geen methods aanroepen in je loop, maar je updates inline in de loop uitvoeren. Dit geldt ook voor getters & setters. Je kan dan beter een public var gebruiken in je Particle class. Methods & getters/setters zorgen voor meer bytecode, en meer bytecode voor de Flash Player is meestal langzamer.
Ik heb een klein testje in elkaar geknutseld met de Particle & create method van mKnol.
package
{
import flash.display.Sprite;
import flash.utils.getTimer;
public class ParticleTest extends Sprite
{
private var head :Particle;
public function ParticleTest()
{
create(100000);
render();
}
/** Private methods **/
private function create(amount:int) : void
{
var tail :Particle;
var maxWidth:Number = stage.stageWidth;
var maxHeight:Number = stage.stageHeight;
tail = head = new Particle(Math.random() * 10, Math.random() * 10, Math.random() * maxWidth, Math.random() * maxHeight);
while ( amount-- > 0)
{
tail = tail.next = new Particle(Math.random() * 10, Math.random() * 10, Math.random() * maxWidth, Math.random() * maxHeight);
}
}
private function render() : void
{
var beforeTime:int;
var afterTime:int;
var node:Particle = head;
beforeTime = getTimer();
while (node.next)
{
node.update();
node = node.next;
}
afterTime = getTimer();
trace("duration method: " + (afterTime-beforeTime));
node = head;
beforeTime = getTimer();
while (node.next)
{
node.xPos += node.xVel;
node.yPos += node.yVel;
node = node.next;
}
afterTime = getTimer();
trace("duration: " + (afterTime-beforeTime));
node = head;
beforeTime = getTimer();
while (node.next)
{
node.xp += node.xv;
node.yp += node.yv;
node = node.next;
}
afterTime = getTimer();
trace("duration getters: "+(afterTime-beforeTime));
}
}
}
final class Particle
{
public static var I:int;
public const INDEX:int = I++; // auto-increment
public var next:Particle;
public var xPos:Number;
public var yPos:Number;
public var xVel:Number;
public var yVel:Number;
public function Particle(xPos:Number, yPos:Number, xVel:Number, yVel:Number)
{
this.xPos = xPos;
this.yPos = yPos;
this.xVel = xVel;
this.yVel = yVel;
}
public function update() : void
{
xPos += xVel;
yPos += yVel;
}
public function get xp() : Number
{
return xPos;
}
public function set xp( value:Number ) : void
{
xPos = value;
}
public function get yp() : Number
{
return yPos;
}
public function set yp( value:Number ) : void
{
yPos = value;
}
public function get xv() : Number
{
return xVel;
}
public function get yv() : Number
{
return yVel;
}
}
Resultaat:
duration method: 61
duration: 24
duration getters: 218
Dit is een resultaat van 1test. Ik heb er meer gedaan en de tijden weken af, maar het verschil bleef ongeveer hetzelfde. Zoals je ziet is het gebruik van Getters & Setters het langzaamst, daarna het gebruik van een method en het snelste is inline je particles updaten.
rackdoll
%Europe/Berlin %408 %2011, 10:47
Thru The Scanline ( Installatie voor Blikopener Festival (http://www.blikopener.net), Delft )
http://blog.rackdoll.nl/?p=1084
Neuro
%Europe/Berlin %661 %2011, 16:52
Thru The Scanline ( Installatie voor Blikopener Festival (http://www.blikopener.net), Delft )
http://blog.rackdoll.nl/?p=1084
Ziet er mooi uit!
cornedor
%Europe/Berlin %031 %2011, 01:45
Heb ook een exploding image gemaakt (400*300 = 120 000 particles), deze is in haXe en heb hem zo snel mogenlijk geprobeerd te krijgen.
Heb nog niet met useGPU gecompiled, doe ik mischien later nog.
2e link is swf (+ juiste HTML) met useGPU = true, deze is ook limited op 30 FPS, scheelt wat CPU en loopt zo lekker smooth (mits die de 30 fps haalt)
SWF: http://lab.corne.info/particles/Main.swf
(http://lab.corne.info/particles/Main.swf) SWF (useGPU = true): http://lab.corne.info/particles/image.html
(http://lab.corne.info/particles/image.html) Source: http://pastebin.com/0hs1UdVQ (haXe)
Foto: http://www.flickr.com/photos/dorrestijn/5915500444/sizes/l/in/photostream/
Corné
P.S. Draait in normale player heel stuk sneller dan debugger.
rackdoll
%Europe/Berlin %420 %2011, 11:06
Thnx neuro!
Tis nog niet helemaal af maar tis ene leuk begin
vBulletin® v3.8.1, Copyright ©2000-2012, Jelsoft Enterprises Ltd.