EuRuKo2013 - design

image How we designed the EuRuKo2013 logo

EuRuKo (European Ruby Conference) is an annual conference about Ruby, a programming language upon which is built. Since Euruko 2013 is taking place in Athens, we were more than excited to contribute to the event organisation.

The concept of the logo design

One of the first steps needed was the branding of the event per se. Previous EuRuKo conferences had a unique logo, based on the culture and tradition of the city or country that hosted it, with only one thing in common: Ruby. Although it was clear that the design should strive to keep a continuance, the design brief was relatively open allowing different ideas and concepts. So we were free to bring our ideas on the table. Other contributors - designers could design their proposal for the logo as well, then the EuRuKo2013 committee would choose the best one of the submitted logos.

In the beginning the idea was to handle the ruby as a mineral, not as a programming language, with designing custom polygon letters which would form the word EuRuKo. As we proceeded with the drafts, we did two more minimal approaches using a strong plain typeface with a seperate iconography of a ruby. A symbol that could help the logo to be memorable while could be used for advertising on various media.

image The EuRuKo2013 logo drafts

Among the different possible approaches the one successfully merging the greek scientific spirit with the ruby symbol seemed the most promising. The Antikythera mechanism, an ancient Greek analog computer, considered one of the first computing devices, was the object which could connect the technological dots from the past to the present. It is a form of computer that uses the continuously changeable aspects of physical phenomena to model the problem being solved. It was designed to calculate astronomical positions and it was recovered in 1900 from the Antikythera wreck. The construction has been dated back to the early 1st century BC.

Vasilis Tanos and Alexia Konstantelia, our talented design team, approached the challenge with a simplified technical drawing of the mechanism, rotating behind the letters of the EuRuKo logo. The contrast between the ancient ingenuity and the modern programming language was underlined by the use of light strokes combined with a bold typeface. TS Berfa seemed the perfect fit for the typeface while the logo was kept in a well saturated red with the strong contrast of black and grey.

image How we designed the EuRuKo2013 logo

The concept of the website design

After designing the logo, the time had come to begin with the design and the implementation of the main webpage. After a first approach to the overall look and feel through a simplified teaser page, we settled for a clean approach with well seperated content areas and a easy to use scrollable interface.

Since one of the latest trends in modern web design is use of parallax scrolling effects, we thought about using it in the first section, where the logo would be placed… So we wanted the first section in some kind of 3D floating space. It was also important to provide the users an easy way to navigate to every section and back to the top while we integrated a newsfeed box above the fold, for the visitors to quickly read our news.

Let’s code it

The main site was coded by me and @nemlah in, what else, Ruby. We used middleman, a command-line tool for creating static websites. The site is fully responsive, which means it adapts its content to the device viewport, making it easy to read in a wide range of devices, from a 27-inch iMac to a mobile phone.

Finally, both me and @mkousta added a few more things to the webpage. CSS3 animation is used to rotate the Antikythera mechanism core element clockwise and some of its gears counter-clockwise, in an obscure way, to underline that computer science has roots in the past, even if we sometimes forget it. A JS parallax effect is used in the first section to move the background layers based on mouse movement, underlining that there are many things in programming, waiting for us to explore.

In the end @gfotos ironed out the texts and took the site online.

We are sure EuRuKo2013 will be a true killer event in one of the most interesting cities of Europe (especially in the summer). The whole Skroutz Team will be there, will you?