Weeknotes: improved session pages & speaker directories and upcoming iPhone design refresh

We announced our official partnership with Digital Shoreditch this week (which as I am following in the time honoured tradition of posting week-notes on a Monday, is actually last week). This is what we have been busily working on for the past few weeks and it is lovely to see it all coming together now. This marks the first conference we have worked directly with to create a customised mini site similar to our offering for SXSW. If you fancy one of these for your own event please get in touch with us.

In building the new mini-site for Digital Shoreditch we have been streamlining some of the interfaces throughout the site. The most marked difference is probably the speaker directory and the speakers on the session pages.

The speaker directory used to just be a rather dull but functional column'ed list of the speakers at an event. This now works a lot more like our event attendee directory. Here's the old design:

I have expanded out the profile information for speakers, giving room for speaker biographies which we have turned on for RailsConf and Digital Shoreditch. Also new is space for more contextual information relevant to the speaker at the event such as which sessions they are presenting and a follow button for you to instantly follow on Twitter the speakers at an event. In addition to this you can search the speaker directory or filter by topic, for example here are all of the people talking about advertising at Digital Shoreditch. Here's what the new page looks like:

The session pages now have a similar component which replaces the previous speaker information display. I have moved the speaker information to below the session abstract, I feel this gives more prominence to the main purpose of the page and that having expanded speaker details below this provides qualitative context to the session. Here is a comparison of the old and new session page designs.

We have started the mammoth task that is tidying up our topics. We used to have 'opensource', 'Open Source', 'Open-source' and '"Open Source"' topics, now we just have 'Open Source' and all of the other pages redirect to the right place. We have done this to a few other topics, if you see any others that should be combined then please let us know.

Jake has had fun getting stuck into using PhantomJS and Qunit to set us up with some proper automated unit tests for JavaScript, which is fabulous!

Something else awesome that we all came across this week was the superb BeerCamp site! A splendid interactive book-style conference website stretching some darned funky CSS3 to the limits! Their 2011 site was pretty cool too (scroll down). Incidentally BeerCamp is on Lanyrd if you want to mark your interest.

I found this lovely description of design this week. It is targeted at startups and evangelises the need for startups to take design seriously and to have designers on the founding team, I agree with this sentiment. I have a Computer Science and front-end development background and while I am confident in my HTML/CSS abilities, design is something I have only been doing as long as I have been working on Lanyrd. I am learning all the time and have gone from saying I am 'not a designer' to 'I am an inexperienced designer', I can only imagine how much Lanyrd would have benefited if I had had more design experience before we started out on this adventure!

Continuing as an inexperienced designer, I got to play with Adobe Fireworks some more this week. We are doing a little bit of a visual refresh of our iPhone app at the moment. Rather than trying to straighten things up and make them look nice directly in Xcode, this time I decided it would be a lot less painful to try using Fireworks to mock up what I wanted them to look like.

I have been using this approach more and more recently, even on the web where I am happier than a pig in poo messing about with CSS and designing in the browser. I find it changes the way in which I think about design, instead of contemplating class names and inheritance I am able to take a step back and think abstractly about colour, typography, alignment and other creative things.

Here is a sneak peak of the direction I am taking with the iPhone app visual refresh: (Please note: it might not look anything like this by the time I'm finished!)

And here is a video of the paper prototyping process I went through to design the first version of the iPhone app (which incidentally Simon and I designed, built and shipped in 4 weeks having never done iPhone app development before!)

I have made good use of these fabulous layered fireworks templates of iPhone widgets recently and these paper kits for mobile prototyping also look really fun though I have not played with them yet.

A useful trick that you might not know: getting designs of iPhone screens onto the iPhone is a right pickle! So I have been exporting the PNG screens to my Dropbox folder and then using the Dropbox iPhone app to view them on my phone. You can even save them to your camera roll or view them on other test devices if you have them.

The Lanyrd quest for a Graphic and UX Designer (more experienced than me) continues in earnest, we are in the interviewing stage at the moment so if you are dilly–dallying about applying then you better get your CV/Resume and portfolio in quick!