Agile Records, Erskine Design Interview
We are very pleased to introduce Agile Records, the ExpressionEngine 2.0 Example Site created by Erskine Design (they just launched their redesign).
We’re not going to go into a lot of detail about the Example Site yet or provide more screenshots at this point. After all, we want to keep some things a surprise. But we did ask Simon Collison and Greg Wood to give some insight into Agile Records development.
Why a record label?
Colly: It was Jamie Pittock’s idea, and we all agreed. In some senses it comes from a background working on music sites. Back in 2004 I was learning what EE could do way beyond the documentation, simply because I often had to in order to cater for the ridiculous requests of record companies. It was music sites that helped me realise the power of EE. Discographies, relating news items to releases, tour events using future entries, forums for obsessive fans - all that stuff was possible with EE, even with version 1.1.
Greg: We did consider quite a few other concepts for the learning tool, things like an educational institution or something more government/business based, but ultimately a record label was more fun and something a little bit different.
Colly: A record label is an ideal catalyst for learning EE approaches that would be applicable to many other models. It was also fun to invent the half-dozen stupid band names, album titles and cover artwork we supplied with the finished site.
Leslie: I’m inserting myself into this particular question. We (EllisLab) loved the idea of a Record Label because it lends itself well to a diverse audience. It shows that EE can be used at the enterprise level but being a record label meant that we could let Erskine have a grand time with ideas, really personalize it and stay away from the “stuffed shirt” boring design that can typify a “business” website. The idea is easily interpreted for what a person needs it to be - a business website, personal website, something in between, portfolio, etc…. A Record Label would naturally make use of many of EE’s out-of-the-box features which is important to a learning tool.
How did you come up with Agile Records specifically?
Greg: We’re all music obsessives and big fans of independent record stores where prices are handwritten, everywhere is dusty and covered in stickers and posters and the staff are so snobbish that you dare only ask about certain bands. The inspiration for Agile was something like the “Championship Vinyl” store from High Fidelity - a mixture of that and cool UK indie labels like Rough Trade or Creation.
Colly: Greg calls it a “metaphor”. It was important for it to feel authentic, so we actually created personas for the staff, and invented band biographies and so on. Because our “metaphor” was carefully created and felt real, we had a good understanding of how to build a website for it. The name “Agile” is a specific reference to how adept EE is at handling any challenge one might throw at it.
How did you approach the actual design of the site in terms of what would go in it?
Colly: Very meticulously. Old skool EE users like us will always go on about the learning curve for more advanced builds, or the Eureka moment - the time when you suddenly realise just how incredible EE is - how you can go way beyond the manual and build an entire business on it!
As a team we invest a lot of time in process and research. So, we spent a few weeks thinking about the key features of EE - both the nuts and bolts, and also the things we think are utterly cool. There were lots of charts, diagrams, lists and sketches being thrown around the office.
Greg: As advanced users of EE, we all remember the Eureka moment Colly mentioned, and we were passionate about building a site that could go some way to speeding up that learning curve for users, and also show newcomers that its way, way more than just a blog tool or blog-standard CMS.
Colly: We were aware that we couldn’t do anything too ambitious, so we keep the focus on smart use of weblogs (can I say “channels” yet?), categories, statuses, dates and fairly basic relationships. We also didn’t want to give Derek Jones too hard a time building our vision with EE 2.0!
What was your approach to the HTML & CSS for the site knowing that a wide variety people, from standardistas to people brand new to HTML would be viewing it?
Colly: My entire approach was to let Greg build it.
Greg: I like to think that the HTML and CSS is simple enough so beginners can go into the source and learn something about classes, IDs or floats, but also has something to offer more advanced front-end developers; they may finally get their head around CSS positioning or realise more creative ways to use alpha transparent PNG images. It doesn’t do anything particularly amazing, but it’s always nice to think that someone can learn something from what you’ve created.
Colly: I’d encourage anyone to view the source and CSS of the Agile site and look at how Greg labels the HTML and CSS, and orders his styles and makes the CSS work so hard, encouraging lean HTML. Its a window into how we at Erskine build all our sites, and the carefully-honed conventions we use.
We worked very hard to ensure that the Example Site also promotes current best practice and encourages all EE users to wave the web standards flag. Hopefully people will spend time picking it apart and seeing how certain effects are created.
Greg: Although Agile is a tool for learning EE as a leading CMS system, we hope it also opens a few eyes to what is possible with intelligent CSS and visual design.
