Reasons: inspiring creative technologists

matthew.payne

reasons to

Two members of our Creative Technology team recently ventured down to LSO St Luke’s for the Reasons To Be Creative London Conference. ‘Reasons’ aims to educate and inspire with talks from the world’s best coders and designers. Here, our developers have described what stood out for them at the conference, and why it caught their attention.

Jaswinder Virdee, Developer
It was a day designed to inspire. First on the billing was one of the most technical talks and my personal favourite, Harry Roberts of CSSWizardry fame. He took us through the world of templating and using SASS methods to help streamline workflow.

Roberts talked about ‘theming’ and ‘customisation’. Theming refers to areas of a site with predefined looks which developers have assigned to be altered in appearance (such as Jeremy Keith’s site here). Customisation is when a site can be altered to a users’ taste. We often see customisation on social media – here’s what Twitter offers for example. Roberts talked us through a number of techniques for both, with pros and cons – but I’d like to highlight one in particular, inspired by well-known Twitter developer Necolas.

If you view the source of any Twitter Profile you’ll see a load of CSS outputted – like CSSWizardry’s in the image below. What you can see here, indicated by the ‘u-‘ are “utility classes”. They make all your customisations in the Twitter design section come to life.

Customisations

With this method, once the user of a customised site has defined a colour for his or her borders in the design area, the code is outputted here (for instance you can see that CSSWizardry uses #F43059 for his borders on Twitter in the image above).

What’s brilliant about this technique is that it’s really quick for the user to make changes to their design and it gets around any potential caching issues. Next time you go to Twitter’s design section and change the look of your profile, you can see how smoothly the alterations take place – once you’ve landed back on your profile page you can see your changes have already taken affect. A very simple approach that makes the user experience better. You can see all four and half methods discussed at the conference here.

Beth Allchurch, Junior Developer
Stefanie Posavec is a designer with a focus on data-visualisation. You could describe her work as “post-infographic” (depending on your level of aversion to describing things as post-anything). Whatever it is, she’s amazing at communicating the information implicit in datasets in unique ways. Often she does this by representing data in a robustly physical manner, allowing people to actually interact with it. This was the case in at least two of the pieces she presented at the conference.

In her project “Open Data Playground” she created two hopscotch-style games based on open datasets (Cabinet Office Procurement Card expenditures over £500 and Monthly Average Ozone ug/m3) where “both movement and foot positioning were informed by the data”. Users were then able to move through the data, and physically experience the information.

In “Relationship Dance Steps”, completed during the course of her Facebook Art Residency, she took performance as her central theme. Using the idea that people often perform a version of their relationship via their social media communications with one another, she created dance steps for selected couples based on their Facebook interactions and produced a unique dance for each pair. “… [B]y following the notation, a passerby can move through an accurate representation of a couple’s digital movements and interactions in the real world.”

relationship dance steps

Facebook dance steps

Definitely my favourite talk of the conference!