Mauricio Giraldo

Masters in Human-Computer Interaction

I've been working since 1998 on interaction design projects for a wide range of commercial, academic, private and public institutions while also lecturing in the design department of a top latin-american university. Founded Ping Pong Estudio, an interactive and web development agency where I managed interdisciplinary teams composed of members with technical, marketing and design backgrounds. I am passionate about creating innovative experiences for customers using any available technology. I am particularly interested in mobile or tangible experiences. If you want to know more, please download my resume (PDF 78 KB).

GitHub profile
StackOverflow profile
Blog

The Hand of God

Description
This interactive artwork tracks tweets from across the globe using religious keywords in english and spanish (i.e. god, evil, love, hate, hell, good, bad, devil, pray), and allows the player (god) to punish or reward people, send them to heaven or hell, based on the content of those tweets. It is controlled by hand gestures via the beta version of the LEAP sensor. This project is a commentary on religious beliefs aiming to raise questions about divine agency.

This project was done in the context of Art Hack Day (God_Mode) in 319 Scholes Gallery, Brooklyn.

Category
Speed project / Art-hack
Client
Personal
Date
2013
Technical skills required
Web sockets, Twitter API, HTML, JavaScript

More information
Video of the work in progress
Project code on GitHub

Loomings

Description
Exploration-meditation on photographs of Buenos Aires, Argentina.

This project was done in collaboration with Ana María Montenegro.

Category
Web app / Art-Game
Client
Personal
Date
2012—2013
Technical skills required
HTML5, JavaScript

Stereogranimator

Description
The New York Public Library is home to, among other more prominent collections, the Robert N. Dennis Collection of Stereoscopic Views. As can be read in the about page of the site, this project was inspired by a library patron who created animated GIFs out of the images he found in the collection. He did so with extensive knowledge of Adobe Photoshop. The purpose of the Stereogranimator is to allow anyone with a web browser to create not only animated GIF, but also red-blue anaglyph derivatives. The project makes use of the <canvas> tag via EaselJS. A Flash version was created to support older browsers.

This project was done while working at the New York Public Library Labs.

Category
Image manipulation / Web development
Project as part of
NYPL Labs
Date
2012
Technical skills required
Ruby on rails, ImageMagick, HTML5, Flash, MySQL

bitpix

Description
I grew up playing video games and witnessed the rise of the very early consoles up to the current generation. I wanted to create an iOS app that would replicate the low qualitylook of those platforms. I also was interested in doing some research in image manipulation. The design of the app was made in collaboration with El Monocromo. For sale in the Apple App Store.

Category
Image manipulation / Mobile development
Client
Personal / Ping Pong Estudio / El Monocromo
Date
2012
Technical skills required
Objective-C, Cocoa Touch, ImageMagick

BodyType

Description
A typeface is an environment for someone’s expression: using typefaces we write documents, create posters and subtitle movies. We follow the type creator’s restrictions and design decisions (kerning, spacing, proportion) when using her fonts. Good typefaces are created by highly-skilled people and can take several years to create. Body Type aims to allow anyone to create a highly expressive and personal typeface using only their body and hand gestures.

Body Type is an excercise on freestyle computing and was built using OpenFrameworks, the Microsoft Kinect sensor, OpenNI, FontForge, Potrace, ImageMagick, PHP, TouchOSC and the Apple iPhone.

The project was presented in Collider4 and Collider5series which examine “the impact, implications and inspiration of the phenomenon generally categorized under the umbrella term New Media within the design practice and fine arts.”

This project was done as part of the requirements to complete the Spring 2011 Interactive Art and Computational Design course with Professor Golan Levin in Carnegie Mellon University.

Category
Kinect-based interaction / Typography
Client
Personal / Carnegie Mellon University
Date
2011
Technical skills required
OpenFrameworks, OpenNI, C++, ImageMagick, PHP, OSC, Perl

More information
Blog post describing the project process

2D ♥ 3D

Description
2D ♥ 3D is a Kinect-based online multiuser interactive environment. The project is still under development and currently allows multiple web-based users to interact with and augment the physical space of the Kinect participants with virtual objects.

This project was done as part of the requirements to complete the Spring 2011 Interactive Art and Computational Design course with Professor Golan Levin in Carnegie Mellon University.

Category
Kinect-based interaction / Multiuser Experience
Client
Personal / Carnegie Mellon University
Date
2011
Technical skills required
OpenFrameworks, Flash, XMLSockets

More information
Blog post describing the project process

New Faces

Description
New Faces is a project that began in 2009 after I got fed up with Colombia’s online newspapers’ (one site, another site) high emphasis in sports and celebtrity-related news. I decided to take a screenshot of the offending website and remove this information (along with advertising) in order to see what was left.

Clearly sports, advertising and celebrity news have a relatively high importance for this colombian newspaper (at least in its online incarnation). This led me to wonder if this was the same across different countries. I decided to create a Python script that makes use of webkit2png-0.5 to take a screenshot of eleven news websites every night at 8pm. This script has been ran almost every night since November 8, 2009.

After seeing Rutherford Chang’s work with the New York Times where he blacks-out every element in the page except faces (no link available, sorry) I thought it would be an interesting idea to execute this same process in my dataset of more than 3,000 files and 10 GB.

View the Flash interface online in your browser. F for fullscreen (click the interface to give it focus). CAUTION: ~30,000 images files loaded might clog up your browser (although they’re about 2kb each only). Interface is not optimized for low-end computers.

This project was done as part of the requirements to complete the Spring 2011 Interactive Art and Computational Design course with Professor Golan Levin in Carnegie Mellon University.

Category
Data visualization
Client
Personal project / Carnegie Mellon University
Dates
2011
Technical skills required
Processing, Python, OpenCV, Flash, ActionScript

More information
Blog post describing the project process
PDF Presentation (1.5MB)

socially nervous

Description
Social network services[1] enable people to communicate with each other in ways that would be considered science fiction only a few years ago. This enablement has been welcome by people at large, with some criticisms concerning personal privacy and how well (or not) the networks they model reflect real life (offline) relationships. socially nervous is a commentary on how these services have affected our way we perceive these relationships.

The object
An electronic “pet” with movement and audiovisual actuation capabilities. The pet will communicate wirelessly with a host computer which in turn will receive information from the owner’s personal “identities” in two social network services: Facebook and Twitter. Only incoming information to these profiles will be taken into account (information generated by the user’s “friends”).

This information will be manifested physically by the pet’s behavior (movement, sound, light). As information is accumulated by the pet, manifestations become more intense and erratic. As soon as someone touches the pet, it “forgets” any information stored and “sleeps”. The process begins again as soon as physical contact is lost.

Awkwardness
The pet's shape is informed by the awkwardness inherent in the process of virtual socialization. The object could easily be a teddy bear or some other more familiar shape which would make the observer want to interact with it. Instead, I decided to create a non-familiar, even agressive, shape with sharp edges and non-symmetrical shape. An observer would notice an erratically-behaving object wandering about in response to virtual interactions. By touching it, the user "calms" the pet; physical interaction "defeats" virtual interaction.

Behavior states
Any information received by the pet will provoke behaviors in any of these types: physical, visual, auditive. The stimulus is always represented in the 5×7 matrix as an icon followed by the username/alias of the person who provoked it.

A video of the behaviors working (indirect stimulus received via Bluetooth from a computer not in video). Initial/passive message was later changed to “please hug me”:

Part list

I used 3mm laser-cut acrylic for the box (Sketchup 3D file).

A Processing-based visual interface will be developed to manage Facebook and Twitter profile settings.

This project was done as part of the requirements to complete the Fall 2010 Making Things Interact course with Professor Mark Gross in Carnegie Mellon University.

Category
Tangible computing
Client
Personal project / Carnegie Mellon University
Dates
2010
Technical skills required
Wiring, Processing, Twitter API, Facebook API

More information
Project presentation (PDF 2.7MB)
Making things interact Fall 2010 Course Blog

Pagans

Description
iOS (iPhone/iPod Touch) card-based game created as part of personal research interest in mobile platforms. Conceived and built from scratch in Objective-C, this game is now for sale in the Apple App Store.

Category
Game design / Mobile development
Client
Personal / Ping Pong Estudio
Date
2010—2011
Technical skills required
Objective-C, Cocoa Touch

The Thought Factory

Description
I was invited by my colleagues Hernando Barragán and Annelie Franke to collaborate with the Thought Factory, a project that started in their Design Studio 6 course for the second semester 2009. The project was commisioned by the XII Iberoamerican Theatre Festival in Bogotá, one of the most important festivals of its type in the world. The idea was to create a collaborative work that would allow people to interact with the festival.

With this in mind, the Thought Factory was created and its main purpose was to save and classify the thoughts of festival visitors. Thoughts are abstract and intangible notions (we can’t read minds… yet). The Factory was made to make those thoughts somewhat tangible, “saving” them in bottles that can later be opened and their contents made visible as the genius in the lamp.

Each bottle represents an inquiry made by festival organizers. Every hour and a half a new bottle is placed in the filling station. From that moment, and during the next ninety minutes, that bottle will be filled with thoughts from people who type them in the input stations. Thoughts can also be sent as an SMS message via mobile phone.

Since the Festival is for all ages it was necessary to curate these thoughts (basically removing obscenities). Once approved, the message enters the bottle in the filling station. When removed from the filling station, the bottle is labelled and placed with the rest of the full bottles so its thoughts can be read in the viewing station.

At the end of the Festival (in april 4, 2010) there will be sixty bottles full of thoughts that can be read in the project website.

My main tasks were developing the visual interfaces (thought input, thought curating, filling station, bottle visualization), the database that manages thoughts and inquiries and all communication happening between these and the bottles. SMS message service was kindly provided by Contacto SMS.

If you are curious about the tech side of the project: interfaces are made with Adobe Flash which communicate with a MySQL database via PHP and AMFPHP. Filling and viewing stations communicate with the bottles via Wiring using sockets and an RFID tag. ActionScript programming was made in FDT.

Category
Tangible computing / Interaction design
Client
Universidad de los Andes Design Studio
Date
2010
Technical skills required
PHP, MySQL, Flash, Flash Remoting, ActionScript, Wiring

More information
Design Studio 6 website
Description and videos in my blog

The videogame history timeline

Description
For a long time I wanted to do a videogame history timeline. It would combine several of my interests: information visualization, history, time and, of course, videogames. I developed this timeline as a reference tool for a lecture I taught in the Design Department at the Universidad de los Andes (Colombia). The information is stored in Drupal CMS and accessed by the interface via AMFPHP.

Made with the valuable support from Powerflasher GmbH, makers of FDT.

Category
Data visualization
Client
Personal project
Target audience
Anyone interested in videogames and their history
Impact
Thousands of visitors from around the globe. Showcased in several technology and game-oriented blogs.
Dates
2010
Technical skills required
Drupal CMS, PHP, Flash, ActionScript

More information
Blog post describing the project process
Blogs and websites that have taken interest in the project.

Manantial Everest Expedition

Description
This project supported the first colombian expedition to summit at Mount Everest. The expedition was sponsored by Manantial water (a brand owned by Femsa, the country's Coca-Cola bottler). The website served as a means of communication between expeditioners in Nepal and expedition supporters around the globe.

Roles
Creative Director
Lead Designer
Lead Developer

Category
Web based community
Client
Femsa
Dates
2001—2002
Impact
3,000+ registered users interacting with expeditioners
Technical skills required
HTML, PHP, MySQL, Flash, ActionScript