raysanweb.com has been online since late 2006. During this time the web has changed a lot, its structure, its design and, obviously, its contents. Since the beginning, the main aim of this webpage has been being like a portfolio to show my work; for that reason I tried to customize it as much as possible and keep away of templates that populate the net.

Since the very first design, I decided to stick to latest technologies, such as CSS, to split as much as possible design from contents; Flash, to provide advanced animated and interactive graphics (but its use has been reduced as much as possible along the versions); and plain HTML coding with Notepad++ to have full control over any single line of code. For the images I’ve used when possible the PNG format to play with transparencies and the JPG format for photos and screenshots.

The web evolution has gone as follows:

raysanweb.com version 1.0

That was the first version of my web; it was in English and Spanish and it makes a big use of flash banners. It was organized in multiple sections accessible by upper tabs. The personal projects section was focused on four personal projects (the biggest ones). Other sections include a series of articles about videogames (in Spanish), some videogames related links and obviously an about section. There was also a news section that was not really useful. Design was quite complex, based on CSS tables; plain colours and shadows.

raysanweb.com version 2.0

The second version of my webpage was a very simplified version of the first one. Flash use was reduced as much as possible. Sections were removed too and projects and articles were directly shown as simple links in the entry page. A grunge style was given with hand-drawn borders in the main top banner and the main section box. The CSS design was kept as a table but really smaller. All the web design was very simplified to focus the viewer just on the important information. The English version of this web page was never finished.

raysanweb.com version 2.5

This third version was very similar to the second one. The design was mainly the same but the big change was giving to the viewer as entry point a set of thirty (yeah! thirty!) flash icons, every one for a project I’ve done in my life. Every icon shows a simple webpage with an explanation of the project and some screenshots or design or downloadable data. Some projects were in construction and some other projects were locked (project I’m currently working on). Probably the most workload has been put in the compilation and presentation of all the information for every project listed. The idea was leave the user play with the icons and see every project. Another significant change has been flash code version; all code has been updated to Action Script 3.0. Another important change has been including a system to view the images in a fancy way (lightbox 2.04). This time English has been selected as the default and exclusive language (that’s the language of my target viewer).

raysanweb.com version 3.0

On this version, all the graphics were redesigned to keep aligned with my new personal card colours and style. Colours have been changed to blue tones and the style has been updated to complete grunge (background, fonts…).

Flash has also been reduced to only two files, the intro and the main icons panel. Panel colours have been desaturated and the icons number has been reduced. The loading method (when icons appear) in the Action Script code has been updated to be faster. Some elements design has also been polished (image borders, image transparency, titles…).

raysanweb.com version 3.5

This is the latest (actual) version of the page. This update supposes a complete redesign of the web, at least in term of internal coding.

The major change has been the completely removal of Flash elements; after four years using Flash for (nearly) everything, I decided to leave that technology and change to JavaScript (jQuery). Change has been quite smooth and jQuery has shown me a new world of possibilities. Really amazing!

Another major change has been the addition of 'socialization' components for my projects and articles; now they can be shared in Facebook, Twitter, Buzz and hundreds of other social pages. Undoubtly, it has been a great step to promote my page and myself.

Here it is a list with the main changes:

-- Flash completely removed and replaced with jQuery functionality.

-- Social icons/menu to allow users sharing contents (Web2.0).

-- Three possible display modes for the main menu (Grid, List, WebGL).

-- LightBox2 lib for image viewing (using Prototype lib, 194Kb) has been replaced by SlimBox2 (based on jQuery, 8Kb)

-- Flash based code for Vimeo embedded videos has been replaced by HTML5 based code.

-- QRCode of current page placed on the banner for easy mobile scanning.

-- RSS Feeds for the user, to keep updated on web changes!