Presentation - Random Number Generators

Presentation - Random Number Generators

Sharing another presentation I made for a seminar during my time at the Univeristy of Passau. This time, the seminar was about The Art of Mathematical Computing, and I thus decided to conduct a survey on Random Number Generators (RNGs).

This survey first attempts to unravel the various definitions of randomness and pseudo-randomness, before detailing the different categories of RNGs, based on physical phenomena or computations. Emphasis is put on Linear- and Non-Linear Feedback Shift Registers (LFSRs and NLFSRs). Finally, the difficulty of objectively testing RNGs is discussed, and various test suites are described.

This study comes with a short paper, an implementation in Python with a descriptive notebook, the presentation itself and its notes.

See the comprensive repository.


Notepal - Architecture

Starting over this blog with an interesting project I was working during my semester in Sweden.

Notepal is a demo system for collaborative real-time editing, based on the Jupiter model [Nichols, David A., et al. "High-latency, low-bandwidth windowing in the Jupiter collaboration system." Proceedings of the 8th annual ACM symposium on User interface and software technology. ACM, 1995. link].

Jupiter is a multimedia virtual world intended to support long-term remote collaboration, and it supports multiple client platforms and high-latency networks.

In this demo, users can connect to our custom server through a web client, and collaboratively create, edit, delete, or move around sticky notes. The server keeps all clients synchronized in a scalable manner, handling the possible collisions and persisting the data and actions.

This project made use of the full JS stack (node.js, express,, connect, modernizr, etc.) and MongoDB.

See the dedicated Github website

WebGL Presentation - Kinect Fusion

WebGL Presentation - Kinect Fusion

During a seminar at Luleå University, we were invited to each present a scientific paper related to ubiquitous computing. I decided to present this paper [Izadi, Shahram, et al. "KinectFusion: real-time 3D reconstruction and interaction using a moving depth camera." Proceedings of the 24th annual ACM symposium on User interface software and technology. ACM, 2011. link] dealing with an interesting project dating from 2011, KinectFusion. The authors from Microsoft describe their method to transform a simple Kinect into a hand-held real-time 3D scanner.

This presentation and its notes cover the whole paper. To stay in the 3D topic (and for the fun), this presentation was made using WebGL (the Kinect 3D model can take some time to load).

See the whole presentation.

Pointillism, depicted

To conclude my series of articles describing the tricks I learned and used for the JS1K Spring-2013 challenge, I will now explain how « Pointillism » (js1k / local) was done, since it received such nice reviews.

I will thus cover the lightweight procedural method used to generate the landscape, and the pointillist-like rendering.

I will assume you've already read my previous articles (Mesh Breeding and especially Painter's Algorithm), since they already deal with the basic notions of 3D generation and rendering.

See the whole article.

Mesh Breeding

Morphose was the first demo I posted for the JS1K Spring-2013 challenge. The idea came when I was trying to apply my simple 3D renderer to different kind of scenes, while my head was buzzing with a resurgent interest in the demoscene. Morphose just sprouted out of this context, almost by accident.
I was trying to tesselate a planet, discovered cube-mapping, and the next moment I was observing the strange offspring a cube and a sphere can generate when mixed. Some tweakings later, I had a new demo for js1k...

Now in this article, I will try to formalize the whole process, covering the meshes generation, the tweening, the tweaking, etc. This demo is quite simple, but I found some results interesting, and I hope you will.

See the whole article.


Pointillism - Demo, Pointillist Spring Landscape

I've updated my portefolio with the last versions of my js1k demos.

I've been able to slightly improve the colors and controls of Loom, while implementing another landscape demo, Pointillism, using almost the same procedural method but a totally different rendering step.

Its visual aspect may not seem as clean as for the Painter's algorithm-based demos, but it gave me the possibility to add more dynamism to the composition.

See the updated portefolio

The Painter's Algorithm

This article is the first of a series aimed to describe and formalize the different methods and tricks used in my demos for the JS1K Spring-2013 challenge. I had much fun participating, and learnt a lot, so I will try to spread my enthousiasm.
The main topics will therefore be 3D procedural generation, rendering, and how to get all this fit in 1024 bytes.

Today, we will deal with « how to easily render a 3D scene in a 2D canvas », presenting one of the simplest method for that: the Painter's Algorithm.

Through a mix of maths and code, we should end with a simple example.

See the whole article.


Morphose - Demo, Mesh Tweening

I had so much fun implementing my minimalist 3D renderer, that I wanted to try to apply it to something else than landscapes.

So I started writing small functions to build various geometries ans then display them, until it came to me that I could make an old-school demo out of that.

Here is the result: the Painter's algo, a cube, a sphere, and a chaotic tweening between both geometries to generate pseudo-random shapes, in 1020 bytes.

To get some feedback, I submitted it on JS1K (actually, I posted it before Loom, as only the last entry per author will compete. And I still have a preference for my landscape demo, which also fits the competition's theme...).

See the demo


Loom - Demo, Landscape generator

A year ago, I translated and personalized a Matlab school-project, about procedural generation and 3D rendering, into a JS demo. It was quite heavy (I was for instance using sylvester.js to handle matrices and vectors), slow and somehow buggy, but at that time I was satisfied with all I learned from doing it, and had other projects to take care of.

Then I discovered the JS1K challenge, and decided that if a new edition should come, I would try to optimize my "landscaper" to submit it.

The new edition finally came. It was a real challenge for me to crush my old and immature demo into 1024 bytes (1023B in fact). In the process, I learnt many mathematical or programming tricks, making it totally worth the efforts.
Moreover, I ended up with a demo not only lighter, but faster and more detailed than the original one! Feedback is most welcome!

See the demo

404-Windy & 404-Acid

Today's demos are actually more experiments gone wrong than real displays, but... well, it was fun to make, and the occasion to apply some of my readings about DOM manipulation or CSS animations / 3D transforms.

See the DOM demo or the CSS one


Beziering - Demo, Bézier tracer

So let's inaugurate the demo section with a small canvas application I made some time ago, after reading some interesting slides made by Steven Wittens, aka Acko.
I just tried to illustrate my own way the graphic method to draw Bézier curves.

See the demo

Let's start again

After forsaking my previous website for such a long time, I decided to shut it down, and build a new one from its ashes. I will do my best to add new entries as regularly as I can, by sharing and describing the experiments I do on my spare time.

While designing this website, I tried to apply some new technologies, playing with CSS3 and HTML5. I'm not quite satisfied with the current result yet, and I'm still working on some improvements, so the experience may change in the coming weeks... Wait & See.

In the same time, I will start pushing online some demos I worked on those past weeks. Articles about the interesting notions I faced while implementing them (3D rendering, procedural generation, Bézier curves, JS minification, DOM traversal, etc) should follow soon.