Responsive

New look

You might have noticed the website switched themes. The new theme is responsive and uses HTML5 & CSS3. For more information about the new theme, check out the project page. In case you've never seen the old theme, you can check out the project page of the old theme or compare them with the image above. (click on the image for the full layouts)

I also tweaked the embed_media module I created with for the old theme. The module is actually a filter that allows users to post a simple url, e.g. a YouTube video, that is automatically converted to a embedded video or slideshow. For the embedding I used iframes, which are responsive and have a 16:9 aspect ratio. At the moment the module supports the following urls: YouTube (youtube.com & youtu.be), YouTube playlists, Vimeo, Daily Motion Flickr and Google Maps. I didn't add this module to the Drupal repository and I'm not really planning to, but if you're interested and think I should add it let me know.

Anyway, in my...

This website

The new theme of this website has been built from scratch. The theme is created with HTML5 and CSS3, it also incorporates the responsive web design principle.

I created three main views and a few transitions. The main views are shown below; one for desktops and big resolution tablets (a), one for screens with a lower resolution (b) and one for mobile devices (c). If you want to view the transition phases, just resize your browser.

First I created a basic HTML file and wrote the corresponding CSS. Then I adjusted the CSS to incorporate the responsive web design. Once the offline design was finished, I started converting the HTML to the Drupal template files. After fine tuning the CSS I started testing the design on the live website. The result is what you can see right now.

Website Kirola Sports

This is the first responsive website I've built as a student worker at mediaworqs. The website was developed for Kirola Sports, a FIFA licensed player agency founded by Stijn Haeldermans.

For this project Bob and I created a theme based on the Omega Framework. The framework combines the Omega theme with several useful modules, like the Delta module. This combination should allow easy configuration of a 12-column grid, but we encountered several restrictions that made some parts of the design overly complex.

Another thing I noticed, the framework adds a lot of stuff that we don't need. I know that it's normal you don't use every part of the framework, but in my opinion the extra burden on the site performance isn't worth it, for this site and probably also for future sites.

As a conclusion I don't think I would ever use the framework again, by choice. However the result is good and you can find some screenshots below.