Some thoughts about how to construct an ecosystem that tells a story through badge visual design.
A big hello to those arriving here from the Badges MOOC! You may be interested in my other blog posts about Open Badges as well as my presentations. 🙂
“Hi, I’m Doug Belshaw, Badges and Skills Lead for the Mozilla Foundation”
“Oh, so you’re the guy heading up all of the badges work? I really like what I’ve seen so far.”
“Well actually my colleague Sunny Lee is Product Manager for Open Badges, and Carla Casilli is in charge of Webmaker Badges. I evangelise both badge systems in Europe and work on Mozilla’s Web Literacies framework.”
“Cool. I’ve been looking at badges for a while and was wondering how to implement them in my context.”
“I’m really glad you asked because I’m just about to write a blog post on that exact subject.”
I’ve had the above conversation with many people over the last few months. They tend to go beyond this, obviously, but I do need a post to point people towards.
So this is it. 🙂
The first thing to say is that there is no objectively-awesome way to issue badges. What works for one group of people in one context won’t necessarily work in another context. Having said that, there are some general principles which should stand you in good stead.
Second, you’ll find that it’s fairly natural for people to project their worldview into what is, after all, an open and emergent ecosystem. I’ve had people tell me that badges “will inevitably lead to X,” that “you can’t do Y with badges,” and that “Mozilla need to make sure that Z”. The great thing about the Open Badges Infrastructure (OBI) is that it’s a platform for third parties – including you – to innovate and think differently about their organisation is set up to do.
Third, there’s some criteria that are required for Open Badges and some that are optional.
The REQUIRED metadata fields are:
- Badge Title
- Image URL
- Issue Date
The OPTIONAL metadata fields are:
- Evidence URL
- Expiration Date
What follows isn’t the only way to approach badge design – my colleague Carla, for example, sometimes starts with the graphical element – but it’s an approach which has worked well for me over a series of conversations and workshops.
Here it is in the abstract, followed by a worked example:
- Decide on some behaviours, skills or attitudes you want to promote.
- Think of some criteria for a badge which would begin to promote those behaviours, skills or attitudes.
- Consider if the criteria for the badge you’ve come up with can be broken down in more granular ways.
- If (as is likely) you end up with multiple badges, think about multiple (potentially interest-based) pathways through your badge ecosystem. Ask yourself, which badges depend upon other badges? What are the relationships between these badges? (this may help structure that)
- Get someone to design you an awesome-looking graphical badge and use a badge issuing platform such as badg.us, ForAllBadges, WPBadger or BadgeStack to issue badges
This, of course, looks fairly easy but will take a decent amount of time from start to finish if done in a considered and collaborative way. Just to illustrate the point, my colleague Laura Hilliger and I are running a two-part, 5.5-hour workshop in Porto this week where we probably won’t manage to get the participants through all five steps in the time we have available.
Now, an example.
I’m always slightly wary about using examples as they tend to be held up as THE way to do things rather than A way to do it. With that in mind, let’s take as our example Alina who wants to start a new online community for teaching Webmaking skills. How could she use badges to promote the behaviours, skills and attitudes that she wants the community to embody?
- Alina wants to encourage community members to level up in their web skills. She’s seen that Mozilla have started to provide Webmaker badges for that, so she decides to use those for the skills element. She decides to focus her efforts on badges to encourage mentorship and community etiquette.
- New to the concept of badges, Alina thinks that one mentorship badge will be enough. The criteria she comes up with is that once a member has got enough ‘thank you’ upvotes using the forum software then they will automatically be awarded a ‘Mentorship’ badge.
- A couple of days later, Alina talks through her idea for a single Mentorship badge with a member of the community whom she meets at a conference. They raise concerns that such a system would promote people ‘begging’ for upvotes and/or lead to reciprocal backslapping. Alina goes back to the drawing board and begins to come up with a system of badges.
- Reflecting on her own experience as a member of various online communities, Alina realises that there are different forms of mentorship and ways of recognising it. She proposes several different granular badges which aggregate to a larger mentorship badge in different areas of Webmaking. Alina then invites some community members who already show the behaviours, skills and attitudes she is looking for to an virtual workshop. As a result, she tweaks the number of badges and the criteria for each badge. Some badges they decide should be emergent, all should be peer-assessed, and some should expire. They decide that the inclusion of an evidence URL showing how the member earned the badge would be useful.
- Alina announces the badge system to the wider community via a blog post and asks for feedback. She mentions that they haven’t yet come up with the visuals for the badges. A community member with an interest in graphical design volunteers to design the badges. Before long, the first iteration of the badge system is up-and-running using WPBadger, WordPress and BuddyPress.
I hope that helps. Badge ecosystem design is an iterative, emergent process. My main advice would be to make it an open, inclusive process involving the participants formerly known as stakeholders. 🙂
Image CC BY-NC AlbinoFlea
Back in August I posted about how working from home with my new job for the Mozilla Foundation means I needed a dedicated office. It’s just too distracting working in the main house when we’ve got two young children! I’m calling it a ‘shoffice’ as it’s a shed as far as planning regulations go (no-one’s sleeping in there) but an office as far as I’m concerned. 🙂
Since August local architect Mark Starford has been drawing up draft plans from the detailed measurements he took on that sunny day. I’m delighted Mark’s agreed to allow me to share the drawings here (and on Flickr) under a Creative Commons BY-NC-SA license. I’ve also introduced him to the delights of Pinterest via my Architecture & Design board. It’s useful to have a ‘mood board’ as it allows others to see the kinds of things you like by referencing extant things!
Below are the options Hannah, my wife, and I like so far. Mark gave us three options for the path and way down to the office. I’ve included the ‘dogleg’ version. We’re not so keen on the protruding skylight but are definitely in favour of getting as much north-facing light in as possible. Mark informed us that artists tend to favour this kind of light as it’s more constant and avoids the ‘hard light’ that distracts me when I work.
We definitely like the freestanding canopy-style protruding roof to shelter the stairs and we’re also thinking about potentially including an additional way to get down to the decking area. Hannah doesn’t want the decking to be my ‘outside office space’ and I can see her point. We’re also still thinking about the placement and shape of the windows to the west side (we don’t want any on the south side).
You can click on any of the images to enlarge them or the set is here:
If you’re struggling to understand how this works, it might help to know that our garden would be pretty much on a 45-degree slope if it wasn’t for a concrete ‘bunker’ under the patio. Also, the fence to the rear of our property drops down dramatically to a much lower garden level for our neighbours.
The images below may help:
And, finally, we’re absolutely going to invite our neighbours (to the side and the back) to look at the final drawings. We’re trying to make it so they hardly notice it’s there!
(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.
Any feedback is gratefully received!
- You can see previous iterations of my blog on Flickr: 2009-10 / 2010-11 / early-mid 2012 /
- More Metro-inspired design
- I love the theme Colin Wright has at flashpack.co. It’s called Focus ($20) but it’s Tumblr-only, unfortunately!
One of my favourite games for the PlayStation 3 is Burnout Paradise. Apart from the racing and being able to take down cars in spectacular ways, one of the reasons I love it is because it’s a non-linear game.
What do I mean by that?
I mean that after a (very) lightweight introduction, the whole map is open to the player. You’re guided through the mechanics of the game as you play it, and you can choose what you want to do next. If you just want to drive around, that’s fine. In fact, there’s ‘challenges’ to complete (smashing through billboards, etc.) if that’s all you want to do. By driving around you actually discover some of the ‘formal’ challenges like races as well as the auto repair shops.
Every now and again, either through winning races or completing stunt challenges you’ll unlock a new car. But you still have to go and find it and take it down. And there’s also the ‘stealth’ achievements you unlock unexpectedly. It’s a compelling, very rewarding game in its own right, never mind being able to play live online against other human opponents!
Recently, within the Mozilla Learning team we’ve been discussing the non-linearity of badge systems and how interest-based learning can be scaffolded and assessed. Obviously the assessment is ultimately going to lead to Open Badges, but a few of us feel that we can’t merely replicate the existing structures found in formal education. There’s not much point in using badges if the learning design still talks about a ‘101’ class or uses a Beginner/Intermediate/Advanced approach.
The question has come up, as it always does, about pre-requisites. There’s no getting away that some learning is built upon prior knowledge, the argument goes. That’s certainly true, but there’s ways of motivating the learner to want to undertake that prior learning. That way is by appealing to their interests.
As with anything new, the easiest way to get at what we can do is through metaphor. In this case, I think that a video game serve as a very useful model for what we want to do. Start with the player (in this case the learner) and scaffold experiences around them.
Does that make sense?
Ever since 2007 when I started writing it, I’ve shared what I’ve written towards my Ed.D. thesis over at http://dougbelshaw.com/thesis. Today, given that I was a bit too ill to write for sustained periods of time (during the annual leave I took off specifically to do so) I decided to update and tidy it up a bit. It now reflects:
- the design of http://dougbelshaw.com/research
- the latest structure of my thesis
- what I’ve written (c.43,000 words) to date
The design was inspired by this site and pimped with a bit of Media Query viewport: goodness so it looks half-decent on iPads.
Please note that this will be last of these posts for this year. I’ll be back in 2011 [why?]
Offline this week I learned that there’s literally two types of people in the world (Dweck was correct!), that ‘female festive frenzy’ is now a term in general use, and that brandy hot chocolate is almost always better without the chocolate… :-p
- If you go to the ‘Advanced Settings’ for Google search, you can now get readability guidance for each result. You’ll be glad to know that this blog comes up as ‘Basic reading level’. Clear writing FTW!
- Dropbox is now available for Teams. Looks like a good deal for small businesses, although I think they’ve missed a trick by not also targetting education. This would be awesome for educational institutions!
- Google have turned on desktop editor for Google Docs. GigaOM also has the best explanation ever of why I use Apple stuff.
- The GSMA Development Fund has published their mLearning report. Interesting reading! [PDF]
- Malcolm Gladwell discusses the ‘affordances’ of paper and why it’s an accident of history that we consider tech in any way superior to it.
Productivity, Inspiration & Motivation
- Here’s 7 things you should stop doing at work. I’m pretty good at avoiding them, but it’s always worth being reminded!
- Want to leave your soul-crushing day job? Here’s how.
- Jason Fried posted this quotation over at 37 Signals this week. Spot. On.
You probably only have to interrupt someone a couple times a day before they’re unable to work on hard problems at all. (Paul Graham)
- Do you feel like you do ‘fake work’? Here’s how to spot it and deal with it.
- Your job is a platform for what you do. So sayeth Seth Godin (with my blessing, obviously)
Education & Academic
- Really interesting stuff over at SmartMobs about ‘Lévy flights’. Also a useful link to the Cooperation Commons.
[T]here is a class of random walks called Lévy flights, which include occasional long-distance jumps. The distribution of step sizes is described by a power law, which means that there are steps of all sizes and no well-defined “average” step size, at least for one class of Lévy flights. They have been observed in various natural settings, most famously in the search strategy of certain animals when food is scarce. For example, hungry sharks will typically scour back and forth over small areas, but if the search is fruitless, they will intermittently “jump” to new, far-off areas . “People have also [studied] Lévy flights in stock prices, epidemics, and small world networks,” says Ajay Gopinathan, from the University of California, Merced.
- Rueben Puentedura, he of SAMR model fame, has posted three recent presentations he’s given to his blog.
- Jim Groom is running a MOOC on Digital Storytelling.
- Stephen Downes links to Dave Cormier’s videos explaining what MOOCs are (nicely done!)
- UNESCO and EU publications. You’ve got to love them. The former have announced a policy framework around ICT compentency for teachers. Which will be ignored by Gove.
Data, Design & Infographics
- Google have announced their 2010 Zeitgeist of popular searches. What’s even more awesome is that Paul Lewis, a friend of mine helped code it!
- Lifehacker have rounded up their most popular photography tips, tricks and hacks of 2010. Which is very nice of them, really.
- Like retro travel posters? Like superheroes? Then you’ll love these:
- And whilst we’re on the topic of superheroes, this minimalist poster of well-known characters is just fantastic:
- I have issues with the relevance of their data, but MIT don’t half make some pretty visualisations. This one shows the strength of ties between areas of the UK based (I think) on landline phone calls. And who makes those any more?
- With the imminent arrival of Belshaw Junior Mk.2 this zero-to-ten year timelapse is begging to be replicated:
- Everyone’s got to have a business plan. Even a pimp.
- I think this may be the most important Wikileak of them all [context]
- Check out the Top 10 Weird New Animals according to National Geographic. These have all been discovered in 2010. The Sneezing Snub-nosed Monkey looks interesting. Shame the only known example was shot and eaten…
- Why did people stop wearing hats?
In a time of universal deceit, telling the truth becomes a revolutionary act. (George Orwell)
In the depth of winter, I finally learned that within me there lay an invincible summer. (Albert Camus)
The people who matter will recognise who you are. (Alan Cohen)
Creativity is inventing, experimenting, growing, taking risks, breaking rules, making mistakes, and having fun. (Mary Lou Cook)
The test of a first-rate intelligence is the ability to hold two opposed ideas in the mind at the same time, and still retain the ability to function. One should, for example, be able to see that things are hopeless and yet be determined to make them otherwise. (F. Scott Fitzgerald)
(more quotations at my quotabl.es page)
Main image CC BY auspices
Offline this week I learned to fly direct and take only carry-on luggage where possible, that the UK is ridiculously underprepared for snow compared to other European countries, and that thrash metal isn’t as bad as you’d think… :-p
Continue reading “Things I Learned This Week – #49” »
Offline this week I learned to buy more bags of winter grit than I think I need, to do exercise even when it’s too slippery to go running outside, and that a bad seated posture can give you headaches. 😮
Continue reading “Things I Learned This Week – #48” »
Offline this week I learned that large beanbags offer the most comfortable typing position ever, not to drink cheap red wine, and that the seats by the Chinese books in Newcastle City Library are almost always vacant… 😉
Continue reading “Things I Learned This Week – #47” »