I wrote my own HTML and CSS for dougbelshaw.com back when I was at Mozilla. It was originally a template to be used with Thimble, and a few people ‘forked’ it to use it for their own site.
So, on the train on the way back from Dundee today, I thought I’d do something about it. I knew that I wanted something pretty simple and minimalist, yet with just enough to ‘delight’ visitors. It needed to serve static files, not rely on a database back end (as with WordPress).
I also wanted to link to something I’ve been tinkering around with that allows me to surface my most recent writing. I’d already put that together at dougbelshaw.com/feeds in response to people complaining that they miss my stuff because I post it in different places around the web.
Tomorrow, I’m helping facilitate Story Hack, a kind of book sprint at Gateshead Central Library. It’s part of a series of events funded by Arts Council England called STORY MODE:
Story Mode is a series of events that actively explore the role that Libraries play in their communities via a critical engagement with contemporary creative digital practices and how this activity can enable Libraries to grow in capacity and profile.
It presents new ways of working by presenting experiences and approaches from local, national and international practitioners. Story Mode events will connect Libraries to current engagement practices in contemporary visual, digital and narrative arts.
We’ll be using Sourcefabric’s Booktype platform to collaborate on during the day. Facilitators have been asked to curate relevant Creative Commons-licensed (or public domain) text for remixing, as well as to prepare a short, 15-minute talk about their work.
In terms of the focus of the day, we’ve been given the following prompt:
The advent of collaborative online platforms for journalists, writers and visual artists has had a profoundly disruptive effect upon the nature of traditional media and how we access it. This situation raises more questions than it answers. Questions like: Do digital platforms have the same aura and appeal as physical media? Does the truth matter anymore? Who should we give our attention to and why?
Thankfully, my network is filled with professionally-generous people. The following are just 10 of those whose work I can confidently and openly share with others in relation to the above prompt:
(Email and RSS subscribers will need to click through to see the change)
I’ve felt for a while that I should make this blog better suited to mobile interfaces and, in particular, touchscreen devices. This is known as responsive web design and I’ve been particularly impressed with Microsoft’s ‘Metro’ design language leading to a tiled approach on Windows smartphones. To my eyes it seems streets ahead of Apple’s skeuomorphism.
Yesterday, when I was browsing architecture blogs and came across the Contemporist site, it reminded me of that clean, touchscreen-friendly approach:
I did something I always do when I see blog themes I like: right-clicked to ‘View Source’ as you can tell which blog theme is being used. Judging by the CSS it’s a custom job, meaning I couldn’t simply download the same theme.
That was a shame, but it spurred me on to look for Metro-inspired blog themes. I was looking for something with a tiled, fairly squarish look but that didn’t scream Microsoft. Beautiful though it is, the Subway WordPress theme (from €39) was out of the question. I’d have looked like a Microsoft fanboi:
I also found the MetroStyle theme ($45), which I rejected for having too many boxes at the top:
I downloaded and installed the WP Metro theme (£FREE), but I had trouble making it look decent with my content:
In the end, after considering signing up to a course to get the Anaximander theme, I decided to pay $35 for a WordPress theme entitled Metro:
Like many premium themes it comes with an extremely easy-to-use configuration dashboard in addition to the usual WordPress options. Nevertheless, old habits die hard and I delved into the CSS to tinker about a bit!
I hope you like what you see, and if you want to see the ‘responsiveness’ in action, either resize your browser window or visit this site on a mobile device. It’s only my first attempt – I’ll be tinkering around making improvements here and there over the next few weeks.
I’ve been at the PELeCON conference this week. After her keynote, Keri Facer mentioned in a couple of tweets that the Twitter wall being visible to the audience but not the speaker can be problematic. Everything was positive in Keri’s session, but this isn’t necessarily the case for everyone (see danah boyd example).
So it got me thinking about what I’d like, as a presenter, when doing a keynote. There’s lots of different reasons tweet about a session using the conference hashtag. For example:
To let those who aren’t there know what’s being said
To give a voice to the livestream audience (if applicable)
To provide links to what’s being discussed
For banter/puns/general merrymaking
For agreement, disagreement and questions
…and many more.
Whilst you’re presenting there’s no way you can keep up with the stream in the same way that you (potentially) can when in the audience. But it would be nice to know the gist of what people are saying in the backchannel.
Thinking about it, I casually remarked that some kind of Twitter screen in front of presenters would be useful. And if those tweets that had been retweeted (RT’d) several times could appear bigger, so much the better.
Chris Atherton mentioned this sounded a lot like Wordle and Pat Parslow riffed on the idea talking about the potential for sentiment analysis.
That idea look something like this with traffic light colours for sentiment:
The trouble is, that’s still too much to take in whilst you’re presenting. So, thinking some more, I reckon all that’s needed is the top three most RT’d tweets. Which would look something like this:
I’m off work ill today, having succumbed to the bugs brought by two separate sets of visitors in the last week. Fun.
When I’m ill, which is thankfully an occurrence seemingly less frequent that it used to be whilst I was in the classroom, I see it as an opportunity to ‘step outside of the stream’ and do something slightly different. I’m constrained, obviously, by a need to avoid overly exerting myself but, in a way that my parents didn’t understand when I was a teenager, there are as many and varied things one can do in the digital world as there are in that of the physical.
Today, then, I decided to continue the ongoing saga of the redesign of this blog. Whilst to some the design of their blog is merely a choice between pre-existing themes, to me it’s – perhaps slightly pretentiously – much more than that. Not only is it an opportunity to do some research in the field of webdesign and user experience (which I always enjoy) but it’s an chance to reflect upon my digital identity and the facets I deem important to present to other people.
Whilst Technorati may have taken somewhat of a dive in popularity since the heady days of 2005, it’s nevertheless useful for ascertaining which blogs are the most popular. There is, of course, a problem with equating the most widely-read and visited blogs with effective design and user experience, but I’m going to assume that there must be at least a significant overlap. Those with a large readership are likely to be the most effectively monetised and therefore will have the ability to redesign to improve that monetisation. Or, at least that’s the theory.
After looking at some of the top blogs I came to realise that the functionality of a blog depends massively on the expectations of its audience. Most of the top 50 blogs are about either politics or technology. Whilst I blog about the latter (and occasionally about the former) the type of technology being talked about on the top blogs is the latest and greatest. This is reflected in the shiny shiny nature of the blogs and short, sharp updates. Take Engadget, for example, a blog that I, for one, read every day:
Good practice, is of course, contextual. That is to say that what works in one field doesn’t necessarily work in another. A blog is not a blog is not a blog.
Looking at Technorati’s categories for a better alignment, it was difficult to see a ‘natural fit’ for a blog like this one which ostensibly covers ‘education, technology and productivity’ but also delves occasionally into leadership, design and philosophy.
It turns out that the Technorati’s business directory looked to have the best fit. I should say that my aim in doing all of this is not to slavishly replicate an existing design, monetise this blog or become a dedicated follower of fashion. Instead, I’m looking at what works in practice, not just on the drawing board (and, to be honest, in my head).
Here’s thumbnails of the top 10 (fairly loosely-defined) ‘business’ blogs:
Sidebars on the right
Coloured bar at the top
Easily identified logo
Coloured sections in sidebar for highlighted content
Looking at the top themes is all very well, but in my daily digital digressions I often come across sites which feature elements or an overall design that I find pleasing. I’ve attempted recently to start adding the tags ‘webdesign’ and ‘inspiration’ to my delicious links but it’s early days.
Here’s some sites I’ve come across recently that have pleased and/or inspired me:
TECHi – clean, clear with colour-coded categories and thoughtful typography.
Extrapolating from the above, it would appear that the things that appeal to me most are:
Minimalism (or at least, stripped-down design)
Innovative use of colour
Having come across Cameron Moll’s Good vs. Great(er) Design a couple of months back I felt I needed to go back through it. Awesome does not even begin to describe how good this slidedeck is! Check it out (I’d click on menu to go full-screen):
My favourite parts?
Great design produces an emotional response
“The simplest way to achieve simplicity is through thoughtful reduction” (John Maeda)
Effective design is like good poetry
All of these considerations are why people pay people such as my friend Paul Lewis at Fi to do these things for them. Not me, I’m interested in the nuts and bolts. 😀
Those who follow me on Twitter will have seen that I’m currently redesigning this blog. More on the theory and practice behind that to come, but I wonder if I could ask for 5 seconds of your time?
The first few seconds of visiting a website are crucial for visitors gaining an impression of its content and author. Unfortunately, it’s difficult to gain insights into what visitors think during that period.
Until now, that is.
Using a tool called Clue I’m able to take a snapshot of the new site and submit it for your consideration. The following link is available until midday on Wednesday 13th October 2010 – I’ll share the results. Take a look!
I realised recently that the middle of my Venn diagram is ‘user experience’ (broadly considered)user outcomes. This incorporates what’s known as UX:
User eXperience (UX) is about how a person feels about using a system. User experience highlights the experiential, affective, meaningful and valuable aspects of human-computer interaction (HCI) and product ownership, but it also covers a person’s perceptions of the practical aspects such as utility, ease of use and efficiency of the system. User experience is subjective in nature, because it is about an individual’s performance, feelings and thoughts about the system. User experience is dynamic, because it changes over time as the circumstances change. (Wikipedia)
Since then, I’ve been looking for resources that will help me sharpen my thinking around UX. Here’s five that I’ve come across:
UX booth – a blog ‘by and for the User Experience community’.