JavaScript library for the creation of SVG patterns.
https://github.com/riccardoscalco/texturesHTML snippets for creating Web documents.
https://github.com/nextbitlabs/RapidoPython module for finite regular Markov chains.
https://github.com/riccardoscalco/PykovCrayon.css is a list of css variables linking color names to hex values.
https://github.com/riccardoscalco/crayonD3.js module for the creation of dot grid maps.
https://github.com/riccardoscalco/gridmap
The present essay describes how to create a triangle model in glTF format. We will focus on the production of a buffer binary file with custom geometry and the description of buffer data by means of bufferViews and accessors.
https://open.nextbit.it/posts/a-gltf-triangle.html
I wanted to play a bit with the fragment shader of the WebGL Hello World essay, the challenge was to subdivide the canvas in quarters and then switch the top-left quarter with the bottom-right, and the top-right quarter with the bottom-left...
https://beta.observablehq.com/@riccardoscalco/switch-space-quarters-iteratively
The following code shows a basic webgl program where attributes, uniforms and varyings are used. The initialisation is separated from the rendering by the definition of dedicated init functions and a drawScene function...
https://beta.observablehq.com/@riccardoscalco/webgl-hello-world
On the following I experimented with the coordinate space of a GLSL fragment. I asked myself how to warp the space and, easily enough, it is just matter of function composition...
https://beta.observablehq.com/@riccardoscalco/warp-glsl-coordinate-space
Gradient noise, known also as Perlin noise, is based on the definition of random vectors on the lattice, instead of random numbers as with value noise. On the following, I tried to clean up the code needed to draw noise in a GLSL shader...
https://beta.observablehq.com/@riccardoscalco/value-and-gradient-noise-in-glsl
Bilinear interpolation on one and two dimension has been implemented within a GLSL fragment, see function interpolate and comment/uncomment code in order to see how interpolation of scaled variables change the visible result...
https://beta.observablehq.com/@riccardoscalco/smoother-bilinear-interpolation
I want to explore here how bicubic interpolation works, i.e. the math behind it, highlighting the degrees of freedom the method provides. I provide a GLSL implementation, as long as the function for a matrix of random values in...
https://beta.observablehq.com/@riccardoscalco/glsl-bicubic-interpolation
A geometric figure is constructible with the only use of ruler and compass if its segments are constructible. A segment of length a is constructible if the number a is constructible...
https://beta.observablehq.com/@riccardoscalco/ruler-and-compass-construction-of-a-pentagon
One thing I find interesting about shaders is the fact that images are generated by functions. Given a function f(x,y) you can easily see its shape, the image, but given the image is not obvious what is the function capable to generate that image...
https://beta.observablehq.com/@riccardoscalco/draw-regular-polygons-by-means-of-functions
Date
September 2015 and September 2016
Description
User interface for the monitoring of real time spatial data collected during the endurance trails Tor des Geants. Runners positions along the elevation profile are calculated from times registered at the checkpoints and the runner mean velocity.
Credits
Concept and front-end development by R. Scalco. Project realized in collaboration with P. Griselli.
Tecnology
Javascript, SVG, D3.js.
Date
April - December 2017
Description
User interface for data quality analysis of rich datasets. Information completeness is visualised highlithing where data is missing.
Credits
Concept by R. Scalco. Created at Nextbit.
External
Tecnology
Javascript, Redux.js, Riot.js, Electron, SVG, D3.js.
Date
April - September 2018
Description
Versatile user interface for anomalies discovery in operational business processes. With a focus on data visualization and collaborative functions, the highly interactive dashboard facilitates the visual exploration of process information and the discovery of process anomalies.
Credits
Concept by R. Scalco in collaboration with the team in Nextbit, front-end development by R. Scalco. Created at Nextbit.
External
Tecnology
Javascript, Vue.js, Vuex.js, SVG, D3.js.
Date
January - March 2015
Description
We researched a method to define the most influential twitter users on a specific topic. Briefly, tweets are processed in order to create a regular Markov chain. The steady state distribution of the chain defines a metric on the set of twitter users, which can be used to retrieve an ordered list of users. The rules applied on the network definition have the target to highlight the user visibility on the discussion, we indeed preferred to focus on events that clearly determine a connection among users that is also visible to other users. Being based on mentions and retweets, the metodology is effective also on discovering influential users on the short period, therefore it offers an analytical tool suitable for discussions on specific events along with a time variable list of influential users. The mathematical methods are based on the paper Equilibrium distribution from distributed computing, and we used Pykov for the manipulation of finite regular Markov chains.
Credits
The project has been requested by the editorial company Zadig and it falls under the tellme project. The project has been developed in collaboration with S. Cima (Tuxtax).
Tecnology
Python, Pykov, Javascript, SVG, D3.js.
Date
October - December 2015
Description
Prototype of a immersive user interface over a vast amount of textual information. The galaxy like spatial scattering of entities is based on a gaussian distribution on the y axis.
Credits
Concept by R. Scalco and P. Ciuccarelli, front-end development by R. Scalco. Created at CGnal.
Tecnology
Javascript, SVG, D3.js.
Date
November 2017 - March 2018
Description
The user interface is designed around the visualisation of equivalence classes derived from the dataset, user interactions with the visual representation offer a way to filter and explore the underlying data.
Credits
Concept by R. Scalco in collaboration with the team in Nextbit, front-end development by R. Scalco. Created at Nextbit.
External
Tecnology
Javascript, Riot.js, Redux.js, SVG, D3.js.
Date
September 2017
Description
Development of a prototype graphical interface for the exploration of time dependent data and anomaly detection analysis.
Credits
Concept by Density Design, front-end development by R. Scalco and Density Design.
Tecnology
Javascript, Riot.js, Redux.js, SVG, D3.js.
Date
April 2014
Description
Visual representation of Network Meta Analysis data inspired by atomic orbitals. Direct and undirect comparisons of clinical trials are visualized taking into occount population size, variance and the derived probabilities. The proposal has been presented at The Mario Negri Institute for pharmacological research, in affiliation with the editorial company Zadig.
Credits
Graphical representation by R. Scalco and S. Cima (Tuxtax).
Tecnology
SVG.
Date
June 2015
Description
Custom data visualisation of air pollution data collected in Italy, the visual represention provides a support for the presentation of the project Viias.
Credits
Concept and front-end development by R. Scalco. Project realized in collaboration with S. Cima and requested by the editorial company Zadig.
External
Tecnology
Javascript, SVG, D3.js.
Date
December 2014
Description
This is one of my first data visualisation projects. The voter turnout, i.e. the percentage of eligible voters who cast a ballot in an election, has been related with the population density of the 1206 municipalities in Piedmont. You can explore the analysis through an interactive visualisation.
Credits
Concept and development by R. Scalco.
Tecnology
Javascript, SVG, D3.js.
Please contact me at riccardo@riccardoscalco.it.
Currently I work as designer and developer at Nextbit, I am not available for new projects.