The Graphical Web · Exeter, November 2016
WebGL, WebVR and Information visualisations
Revealing how WebVR enables web browsers to display immersive environments, providing new effective ways to represent and interact with data.
FullStackFest (FutureJS) · Barcelona, September 2015
The Road to WebVR
VR is the new El Dorado, the new Gold Rush of technology, and a very palpable and real opportunity to create new amazing immersive experiences. From WebGL and CSS 3D Transforms technologies, to Google Cardboard and new HMDs like the Oculus Rift or the Samsung Gear VR. Learn how to navigate around all the options, and how to get started on this amazing an promising technology that enables browsers to display VR content. We’ll go through the history of VR and WebVR, with examples and lessons learned, and the challenges that we’re facing to make it happen, like rendering techniques, graphical design approaches and user interaction design.
JSConf Budapest · Budapest, May 2015
Getting things done with three.js and WebGL
Get started coding real-time graphics in the browser with WebGL and three.js. Starting from the basic structure of a three.js web app, going through to the main elements of the API with several useful examples, will help you to get a foothold on the exciting world of 3D graphics, now on desktop and mobile. It's not required to have previous knowledge of 3D graphics, linear algebra or linear transforms.
ScotlandJS · Edinburgh, May 2015
What are shaders and what can they do for me?
Shaders! Amazing little things: a few lines in a C-like language and we can get smooth colours pulsating on the screen or a first-person shooter. In WebGL that we have running on our browsers there are vertex and fragment shaders, we are going to take a closer look at the latter.
Fragment shaders are programs which perform a very specific task: to compute a colour. And each program is calculating a pixel, blissfully unaware of any other pixels or programs, so it can run all by himself in its own computer. Picture this: when we have thousands or millions of independent computers running in parallel we can compose an image thousands or millions of times faster.
But is that all we can do with shaders, drawing pictures? Not really! An image, in the end, is just a piece of memory that we choose to read as a picture. But a chunk of memory can be so much more, it can hold any data! And with fragment shaders we can perform many tasks on that data and speed them up incredibly.
Searching big sets of data, doing complex calculations, even synthesising music!
All in your browser!
Resonate · Belgrade, April 2015
Experimenting with today's web technologies
We live in a time and society where music and data are prevalent. We like to experience music in many ways, and one of them is making visible the invisible, intangible nature of music, through digital synesthesia. We use all kinds of representations to understand music and discover new relations with other media. We explore relations of sets of information using computers. We're going to explore what tools and technologies does the web provide to work with music and visual metaphors, and how can we use that knowledge to create interactive music videos.
We'll go step by step through the different ways of creating interactive visual experiences. From the basic techniques used to put pixels on screen to more complex ways of synchronising animations to sound and rhythm, participants will learn how to manage drawing in a 2D context, drawing in a 3D context, connect sound to their images and animations, and create interactive visuals. We'll go through the basics of 2D and 3D APIs, and sound synthesis and analysis.
Participants will learn how to start a project, integrate libraries, use available tools and complete their own vision of a real-time interactive music video.
Awwwards Conference · Barcelona, February 2015
The Web in the age of WebGL
In just three years after its conception, WebGL has emerged as the de facto technology for creating web experiences and it is now supported by all the major browser vendors.
During this presentation, Jaume and Ricardo will talk about the possibilities the technology brings to the table while sharing the process of developing some of their projects, giving a comprehensive overview of their current workflow and toolsets.
The Graphical Web · Winchester, August 2014
Getting started with WebGL and three.js
Today, WebGL is fairly widely supported on most platforms and browsers: Firefox, Chrome, Safari, Opera and even Internet Explorer; on Windows, OSX, Linux and Android.
Learn how to build a project to put 3D content on a browser from scratch. In an almost-live coding session you will learn:
- how to set up a project and understand the struture of a WebGL project
- add a renderer and know what it does and how three.js abstracts that idea
- add a scene, a camera and an object with a default material
- change default materials to shaders and create your own custom shaders
- how to add postprocessing to polish the render result
ScotlandJS · Edinburgh, May 2014
Getting started with three.js and WebGL
An introduction to real-time graphics in the browser using WebGL with three.js. An overview of the structure of a three.js web app, the main elements of the API and some useful examples to get started on the exciting world of 3D graphics, now on desktop and mobile. It's not required to have previous knowledge of 3D graphics, linear algebra or linear transforms.
Resonate · Belgrade, May 2014
Using the web as a creative platform
FutureJS · Barcelona, May 2014
Everybody dance now with Web Audio API
MIRA Lab · Barcelona, November 2013