Lab

I list here experiments, ideas, prototypes.

For example, I wanted to learn Node.js so I created a prototype using Socket.

Cube Experiment with Node.js

In this example, the rotation of the cube is happening thanks to data being transmitted via socket.

I deployed the app on a Node.js SmartMachine for free by Joyent. It is a bit slower than on my local machine but only way for you to play with it :)

Currently having problem with this example so taking it down until I can fix it! Soon I hope.

Coming soon

Technologies used

Cube Design

I created a version of my website using a 3D box. In the end, I was not 100% happy with the design.
Moreover, it relies too much on soon to become CSS3 Standardised property, so I left it as a prototype.

This prototype will only work in a Webkit browser because I used the Non Standard -webkit vendor prefix.
I would certainly not recommend doing this for a production site.

View Prototype

Technologies used

  • HTML5
  • CSS3 Transformation, Transition (using Non Standard -webkit vendor prefix)
  • JavaScript, jQuery to rotate the box
  • Tutorial for CSS 3D Transform

Related

You might want to read this article about Proprietary CSS vendor prefix «Every Time You Call a Proprietary Feature CSS3, a Kitten Dies» by Lea Verou published on Alistapart.com

Photo Gallery

I created that gallery as a YUI 3 plugin, when I worked for Maverick Digital Agency. That gallery was used on the Intranet of DHL for one of their event.

View Prototype

Technologies used

  • YUI 3
  • JavaScript

Photo Slide

I created that slide effect as a YUI 3 plugin, when I worked for Maverick Digital Agency. That photo slide was used on the Intranet of DHL for one of their event.

View Prototype

Technologies used

  • YUI 3
  • JavaScript

Blast from the past

CSS Zen Garden – Design 1 and 2 – 2006

I love the CSS Zen Garden website and I used to visit almost every day when I was at University. So I decided to submit 2 designs, there are not the best – as I am not really a designer – but it was a good effort :)

Design 1 has an Harry Potter theme, and Design 2 has a London Tube theme.

View Design 1 View Design 2

Technologies used

  • CSS
  • Photoshop

The only flash site I ever made – 2005

I built this site while I was doing my MSc in Interactive Multimedia at Westminster University.
The assignment was to build a website promoting tourism in New Zealand.

I never was a huge fan of Flash site because they can't be crawled by search engine, Flash is not a web standard. I much prefer HTML 4, XHTML and HTML5 :)

I am not even sure the site works well!

View Flash site

Technologies used

  • Flash
  • Photoshop

Hypothetical intranet web site for Nokia – 2005

I built this site while I was doing my MSc in Interactive Multimedia at Westminster University.
The assignment was to build an hypothetical intranet web site for a company – I chose Nokia.

View Website

Technologies used

  • HTML 4
  • CSS
  • Old fashion JavaScript – no framework!
  • Photoshop

XGenealogy – Final Project – 2004

This website is super old and it explained what I did for my final project for my MSc in Computer Science at Oxford Brookes University.

Please bear in mind that I have not updated the website since I published it in 2004. And it is built using XHTML 1.0

View Website

Technologies in my final project:

  • XML
  • XSLT
  • XSL-FO
  • Java, JAXB