We've been back a couple of weeks now and are all fired up for a fantastic 2012.
Here's a sneak preview at some of the work we're doing this month...
Archives by Topic ¶
Happy New Year
Walking Architecture

In partnership with the Royal Institute of British Architects (RIBA), the Birmingham Architecture Association and the Birmingham Five Counties Architecture Association (BFCAA), Substrakt designed and developed an iPhone application and website to represent Birmingham’s finest architecture.
The objective was to create an application that appealed to both users who are interested in architecture, and the general public who either may have an interest in the buildings that they interact with on a day-to-day basis, or who are visiting and keen to learn more about their surroundings.

Information about buildings is available in list format, or viewable on a map. The app also uses GPS to filter buildings that are near you at the time.
A number of buildings are collated into tours within the app. These are themed, e.g 20th Century tour, and can be individually curated while building information can be tailored for that particular tour. Users can use GPS within the app to help guide them on the tour.
All the data (buildings and tours) for both the website and application is easily managed from a central web based database. The application is built natively using Objective C.
Visit the website to download the app:
http://www.walkingarchitecture.co.uk/

Art Map Wolverhampton
Art Map Wolverhampton is an integral part of Project Dandelion, a public art project that enables new art commissions and projects to take place across secondary schools in Wolverhampton. Supported by Centro, Substrakt were brought on board to work alongside the students to produce a printed map and website showcasing art and culture across the city for visitors and residents.
We began the project by visiting the King’s CE school for workshops with the students. Over the sessions we introduced the students to various stocks, inks and finishes. We took samples to spark debate and presented existing maps to engage in discussions, using the feedback to work towards our design. Within their lessons, the students were producing artwork in response to public art within the city, which we were to incorporate into the map.
During the research the students realised they were keen to produce something that stood out from the other tourist maps; we explored different folds, introduced them to Pantone swatches and looked at various ways of illustrating Wolverhampton in a clean simple form that would translate into print and web.


We collated the students’ research and mapped out places of interest and public art onto a vector-illustrated map. Using tones of grey with fluorescent red and green we ensured a bold contrast, the grey representing the industrial city and brights celebrating the culture and vibrant art scene.

The result was 22k A2 art maps; 24pp printed black, Pantone 803 and 805 onto 130gsm uncoated stock.
The accompanying website is based on the visual style of the printed map, and expands on the initial idea and concept of Art Map Wolverhampton. Using the online version people have more information available to them, such as bus routes, transport type accessibility, links to further information on other websites and easily accessed directions through Google Map.

It's built on Wordpress to manage the content, Google Maps API 3 to generate, style and control the map & locations, and is responsive to the browser size & device being used. This means users on larger screens will see a scaled site, with larger images, larger maps and more info on screen, where as small screens still get to view the site at a scale more appropriate to their display. It also works with mobile, meaning people can take an optimised version of Art Map Wolverhampton with them to the art locations instead of, or as a companion to the printed map. www.artmapwolverhampton.co.uk


Rare games press day
We first worked with Rare games earlier in the year designing vinyls for their new Birmingham office, so when we were approached in September to help out with their press day we were keen to get involved.
October was to see the worldwide release of Kinect Sports: Season Two and Rare were set to hold a press day on 8th September, inviting UK, European and American journalists to preview the game. Rare HQ, Twycross, was to be transformed, each new sport having its own area - stylised with artwork, character cuts outs, lights, bars and even an igloo!

Substrakt worked with Rare producing assets, large-scale prints and vinyls for each individually themed room spread across the site - in the building, marquee and igloo. Some of the deliverables included twelve 5ft character cut outs, large logo wall vinyls, material banners, designed flags and magnetic signs for the golf buggy.

During the installation, Andy and I also got a cheeky play on the darts and baseball, top stuff!

Thanks to Rare for the photos!
Python web developer needed
Substrakt are on the hunt for a creative web developer to join our busy and exciting team.
Initially we are looking to fill a part-time or freelance position, but with an ambition to move to full-time position in the future.
The successful applicant will need to have two or more year’s active developmental experience with Python (2.x). Experience with the Django framework is ideal but not essential. A good understanding of OOP and modern open source web development techniques and technologies (like Apache and SSH) is a must. If you don’t have any Django experience, any knowledge of Ruby on Rails or other MVC based frameworks would be very useful.
Other areas of experience would include:
- HTML5
- CSS
- JavaScript (and AJAX)
- an understanding of accessibility requirements and constraints
- solid experience with databases such as MySQL and PostgreSQL
You will be reporting directly to Substrakt’s Technical Director and part of the wider team containing web design and UX design, graphic design and creative staff.
You will be required to work from Substrakt’s lovely Birmingham office at Fazeley Studios.
The right person for the job will be able to:
- Demonstrate previous experience of working as part of a team
- Work to deadlines and show examples of how they have managed time-sensitive projects
- Demonstrate an ability to contribute to the production of high-standard specification and written material such as wireframes or technical specification
- Show a good standard of client communication skills
- Have experience of the project management tools and methodologies used by agencies
Please send an email to team@substrakt.co.uk with a covering letter, cv and links to your work.
No agencies thank you.
Pointe Blank
Pointe Blank is a collection of original images inspired by the story of Coppélia. In a first-of-its-kind collaborative project for Birmingham Royal Ballet, 27 artists and designers have been invited to produce individual pieces of artwork based upon the tale of toymaker Doctor Coppélius, and his attempts to breathe life into his most prized creation.

Over the past few weeks I’ve been working on a rather exciting personal project with Rob Lindsay from Birmingham Royal Ballet. Rob got in contact at the end of April to discuss a collaborative design project he’d been thinking about, so over a good cup of tea we sparked off some ideas. Often people decide a show isn't for them as soon as they read the third word of 'Birmingham Royal Ballet presents...' But sometimes people will take a chance if they already know the plot of the piece. They're not actually coming for the dancing, they're coming for the story. Rob wanted to reach the ballet out to a wider audience, collaborating with other creatives to design something around their recent production, Coppélia. Birmingham Royal Ballet were 100% supportive.
"The appeal of Coppélia for such a project was that it’s got a lively and colourful story, but one that’s not already been told in hundreds of different ways, like Cinderella or The Sleeping Beauty. Even as a ballet, it’s not quite crossed over into the public consciousness in the same way that The Nutcracker or Swan Lake has. So it meant – or at least I’d hope that it meant – that the artists could interpret the story with very few visual preconceptions." - Rob Lindsay, Birmingham Royal Ballet
After a few meetings we’d cracked a concept and entitled our project Pointe Blank. I put together a list of artists and designers I admired or had previously worked with and we wrote the brief. We explored options for a physical exhibition too, an opportunity to bring the creatives together, as opposed to an online presence only. The brief given to the contributors did not require them to present Coppélia as a ballet, only that ideally, they include some reference to Birmingham Royal Ballet. Production images were available, but not initially provided in an attempt to keep the brief as unprescriptive as possible.

We launched the collection at the Hippodrome on Monday 13th June to the artists and invited guests. It was a great evening with my friend Nat tickling the ivories and Lewis being our photographer. David Bintley, the director of Birmingham Royal Ballet did a speech too – it was great to hear his genuine support and excitement over our project. We also launched the collection online that evening and received over 2000 views on the Tuesday alone!

Artwork shown above from Substrakt's Ryan and Claire :)
K4 Architects - A new site for a new site

K4 Architects is a recently established architecture practice newly based just a stones-throw from our Birmingham studio on Fazeley Street. They came to us looking for a new web site to mark the new chapter of their business.
Websites for architects run the gamut from great to poor. They have in the past been dogged with an expectation of hard-to-use form-over-function inaccessible Flash offerings.
The trend for obscure menu systems, dreadful copy and pixel fonts can safely be left behind, but such sites often used beautiful large / full screen background images and custom typefaces - great for showing off the company portfolio. Whilst these only really benefitted the large-screened desktop they often responded to browser sizes (up to a point) better than their HTML-based counterparts. (remember sizeListener.onresize = function() {};Stage.addListener(sizeListener); ?)
We wanted to select the best parts of this status quo and, at the same time, add our own modern take.
Welcome, Responsive Web Design ¶

Image credit: Smashing Magazine
Just over a year ago, Ethan Marcotte published an article on A List Apart on 'Responsive Web Design'. The article draws similarities from Responsive Architecture, a class of architecture or building that demonstrates an ability to alter its form, to continually reflect the environmental conditions that surround it. He observes -
Recently, an emergent discipline called “responsive architecture” has begun asking how physical spaces can respond to the presence of people passing through them. Through a combination of embedded robotics and tensile materials, architects are experimenting with art installations and wall structures that bend, flex, and expand as crowds approach them. Motion sensors can be paired with climate control systems to adjust a room’s temperature and ambient lighting as it fills with people. Companies have already produced “smart glass technology” that can automatically become opaque when a room’s occupants reach a certain density threshold, giving them an additional layer of privacy.
Since then it has become a hot topic, and has forced web-designers to think differently when designing a site. He continues,
In recent years, I’ve been meeting with more companies that request “an iPhone website” as part of their project. It’s an interesting phrase: At face value, of course, it speaks to mobile WebKit’s quality as a browser, as well as a powerful business case for thinking beyond the desktop....But what’s next? An iPad website? An N90 website? Can we really continue to commit to supporting each new user agent with its own bespoke experience? At some point, this starts to feel like a zero sum game. But how can we—and our designs—adapt?
Media Queries ¶

We used a selection of CSS Media queries to detect different browser sizes and capabilities and morph the pages to best suit the situation. This way we avoid creating separate user-agent specific, and an intelligent system that creates a 'one size fits all'.
A matter of style ¶
K4 showed us a copy of Process; A Tomato Project. The book details the abstract of Tomato's concepts, memories and approaches to work in layers of abstract photographs and layered transparency. We used these styles to inform the site's look and feel, using rgba transparencies (degrading gracefully for non css3 browsers of course) and background overlays to build up layers of depth.
Launch Event Invites ¶

As well as the site we designed some great invites to send to VIPs for their launch event. These minimal invites featured metallic embossed foil in the same accent colour as the site on 540gsm Pristine white Colorplan.
View the site: k4architects.com
Radiu5 - Data Visualisation

Over the last 12 months, Substrakt has noticed a very positive trend in the West Midlands - organisations learning the value of digital data and using it to empower and encourage local people to make the most of the places and spaces around them. Our most recent completed work, the Radiu5 Project, is a great example of how this can work really well as a collaborative and engaging initiative for young people in particular.
Radiu5 is the brainchild of Sampad, a dynamic development agency for South Asian arts based in Birmingham. It has a particular focus on youth arts projects, encouraging young people to grow their skills and experience and further them whilst taking part in cultural education opportunities. Radiu5, a key Sampad project for 2011, saw volunteers collecting digital data which highlighted the creative and arts opportunities available within a five mile radius of mac Birmingham for young people, with the intention of inspiring wider involvement and creating a lasting online archive.
Substrakt's job was to design and build a digital way of showing the data that the young volunteers had collected.
From the start, the project was fun and hectic to work on for all the team. The 30 young adult volunteers had some fantastic ideas of groups of information they wanted to collect, from Birmingham's graffiti art, venues for band rehearsals and affordable places for groups of friends to meet. We worked with them in groups, helping them decide on how they wanted to see this material come together, and importantly, how it can be connected to create an overall story. The Substrakt team coached the volunteers in data collection methods and upload techniques, subject matter brainstorms and feedback sessions at every stage of the design process.
Front-end interaction with the exhibition was via a touchscreen which in turn powered a matrix of large displays. We had to think carefully about using animations that responded to touch, avoiding 'hover' effects. The specification of the displays was still an unknown at the time of design, so we opted to design an interface that intelligently scaled to the dimensions of any given display. This way users were able to play using any type of device. The data points bubbled up on the left of the installation, changing in radius depending on the popularity of the tagged content. Navigating through the bubbles brought similar 'linked' data points into view. Any content (images, video, audio, editorial) that related to the data points then appeared on the right. Content that was geotagged was displayed on a minimap. The whole interface was powered via jQuery & Ajax in order to maintain a smooth immersive experience, avoiding the need for jerky page refreshes.
We focused on ensuring that each visitor got a unique experience from playing with the visualistion, finding data that took them on an informative storytelling journey.
Substrakt trained the volunteer teams to guide young users around the exhibition and encourage users to upload new content of their own. The visualisation was also made available as a website for future use, with the project ending in May 2011.
Creative Enterprise Conference 2011 & BCU projects

I was invited to present at this year's Creative Enterprise Conference 2011, which took place last Wednesday at The Studio, Birmingham.
2011′s Creative Enterprise Conference gathers together higher education academics that specialise in entrepreneurship within the creative industries, from across the UK and beyond, to discuss how the subject is taught and can continue to develop.
The keynote title was 'What it means to be entrepreneurial and innovative in the creative industries and in the current economic climate'. I spoke openly about the challenges and opportunites that Substrakt has faced throughout the last 4 and a half years, and also about my personal and professional development as a reflection of the company's growth. This included discussing my decision and the benefits of studying for a part time MA in Media Enterprise during the early days of Substrakt Limited.

(More details of the conference can be found on the blog http://creativeconference.wordpress.com/)
The conference was organised by Birmingham City University, who we work closely with on several other projects and initiatives. We have aligned ourselves with these projects to help us gain a deeper understanding of our industry both in the UK and Europe and work closely with the University, and other partners, who can help us to stay innovative and ultimately provide a better service to our clients.
European Creativity Vouchers
This is a fantastic scheme that helps businesses find European partners who can work together to improve service offering, access new networks and markets, share knowledge and skills as well as understand how to trade successfully in Europe.
A Substrakt sucess story that came as a result of this programme was a partnership with German based Hoppala. Hoppala specialise in augmented reality for the mobile, and Substrakt have been working closely with Marc from Hoppala to test and develop new applications for some of our clients.
Another case study result was with Dublin based data visualision experts, more on this here: http://substrakt.co.uk/blog/2010/08/09/dublin-data/
Creative Metropoles
http://www.creativemetropoles.eu/
I've been involved in this project for the last couple of years and have really felt like i've been able to feed directly in to the project outcomes from a creative business perspective. This particular project is coming to a close over the summer, but it sounds like there are more opportunities for similar studies afoot.
The two European visits that i've been on as part of the Creative Metropoles were written up on the blog previously:
http://substrakt.co.uk/blog/2010/10/12/amsterdam-picnic-and-other-things/
http://substrakt.co.uk/blog/2009/09/24/helsinki/
Speed Data
BCU approached Substrakt to help run an event that focussed on open data and how public sector can understand and make best use of their datasets. We teamed up with Podnosh to help turn this event into a reality and saw our first successful Speed Data event.
More recently we were involved in an event called 'Making (and saving) money with open data' and Gavin Wray from Podnosh wrote about the event and the results.
We are excited about the Speed Data ethos and are continuing to take this forward with both BCU and Podnosh.

