Archive: process

Designing Cold Sun

An exploration into a strange future; narrative, weather and consciousness.

Cold Sun is a dual-mode adventure game that is affected by real-time weather. In the game you flip between your Existence which is set in the future, and your Dream world which is a one-touch platform game where you must navigate a magnified environment—generated by the real weather data. Matt describes the state of this research project so far.

Some themes we explored for this stage one prototype included:

· Coils. Mortal coils, electric coils, etc.
· Circles as a general theme. Sun, timers, time running out, the globe.
· Colours and it’s variation in weather patterns.
· Dreaminess. Blurry. Disorientation, spirals.

After poring over images we pulled together using Pinterest (a really useful collaborative moodboarding tool we love to use) we started to generate some of our own visuals.

Spiral experimentations.

Wind denotations.

A cold sun.

We then started to explore how using these visual ideas could work as a title for the game.

A playful option for Cold Sun.

Cold Sun using ‘weather front’ sign.

We arrived at a really atmospheric graphic that we could use for a title screen, some Dream mode disorientating circular gameplay, and more.

Final Cold Sun title screen.

Dream mode gameplay.

Mudlark creates games, from small mobile and desktop games through to real-world experiences based on your heartbeat or games the size of London. Game design and playful thinking are central to Mudlark’s creative processes. Take a look a other games we have made.

Month Links: April 2013

I always find the introductory spiel to these Month Links posts to be the hardest bit, so I”m just going to leave it as introductory yadda yadda blah blah etc etc and just get on with the URLs that we”re all here for.

So let”s to start with my absolute favourite thing of April, and one of my favourite things so far this year: the News Machine, created by Fabrica for issue 86 of COLORS magazine.

News Machine, by Fabrica for COLORS #86.

- The News Machine is a Heath Robinson-esque communications machine that mangles, interprets and republishes tweets – mimicking the information/misinformation prevalent in the 24-hour churn of news and online speculation. It”s Chinese whispers in the Chinese room. Read Dan Hill”s good and typically long post about its genesis.

- More interpretations of “what the heck is going on?” come in the form of ambient beeps as Bitcoin transactions are made. Listen To BitCoin is going to be an incredible Merzbow piece when the crash comes.

- An enjoyable read on the absolutely, horrifically abysmal movie adaptation of Super Mario Bros. (1993), demonstrating Hollywood”s general contempt for audiences” intellect and failure to grasp the difference between game story and movie narrative. Via Dan Williams” tumblr which is full of brilliant things to read. Follow it.

Playful 2013

We interrupt this blog post for a quick word from our sponsors (us).

Tickets for – our annual shindig about games, design, interaction and everything that comes from playing about — and flying off the virtual shelves.

Come along, it”d be absolutely lovely to see you.

- Jenny Odell documented the manufacturing origin of every single item she used/wore in one day. The banality of globalisation is mind-boggling, fascinating and – especially in the light of the horrific Bangladeshi clothes factory collapse – so cheap.

- GDC”s final ever game design challenge was based on “the last game that humanity will ever play“. A pretty bold and borderline-nauseating brief that would send many people under, but Jason Rohrer – creator of Sleep Is Death – designed a game made of titanium and not to be played for another 2,000 years. Then buried it. You should read a quick but .

-  Russell wrote an excellent post – to join his tiny mountain of excellent posts – about what it actually means to work in the Government Digital Service (GDS). The story of GDS is hugely important, and based on a radical ambition to completely reshape how citizens access government services, how civil servants can communicate, and freeing people up to be better at what they do.

Adventure Time.

David O”Reilly“s episode of Adventure Time, “A Glitch Is A Glitch“, was absolutely head-buggeringly superb taking in a variety of animation styles, 3D and 8bit glitch graphics. It keeps popping up on the web, but Cartoon Network are good at whack-a-mole. Keep a watch out for it, but look at these beautiful stills from the episode in the meantime and read the AV Club review.

- At last week”s Do Lectures - an inspiration creative retreat in Wales that I”d love to attend one day – they set a new challenge. Instead of just hosting talks this year, they made attendees Do Something themselves, to make a quick start-up-able idea. John Willshire and chums created Doobox - “an outdoor adventure mission kit for kids aged 6 to 11 yrs” that”s delivered right to your door.

- In the spirit of Mavis Beacon Teaches Typing and Typing of the Dead, Notch has created Drop – a typing skills-based game. It feels a bit like Superhexagon, and is painfully compelling.


- Teehan Lax labs have created an interactive Google Street View-based timelapse movie. It”s fun and you can pretend that you are NRK1 by making your own.

- Campaigning through retro sports data visualisations of ice hockey, the culmination of a two or three year labour of love, that . John K. Sampson tries to get Reggie Leach inducted into the Hockey Hall of Fame.


- Sims on Instagram

- Obligatory James Bridle things: Quietweet (mutes #, @, URLs) and Dragons (replaces Markets with Dragons in web text).

- to teach behavioural ecology and Game Theory – “to win at some games, cooperation is better than competition.

- No budget, a single blue room and a shedload of LARPing, How We Made Knightmare.

- .

- Soundtrack to April: , , .


Notes from New Adventures

The other week I went to (probably the last) New Adventures in Web Design conference in Nottingham. Met up with some regular freelance faces and some new ones too.

The atmosphere at New Adventures is always a good one—inclusive, friendly, fun. The free bar at the after-party was one of the highlights. I even managed to miss my last train home (something I’m making a habit of). Here’s a short run-down of what went on.

Notes from New Adventures

The Nimble Process
Jason Santa Maria

  • First up was Jason talking about process. A linear process starts to make no sense (something I also noted in this blog post).
  • Jason talked about being scared of launching when he felt something wasn’t quite ready—something I think a lot of us can empathise with.
  • Show your clients MVU (Minimum Viable Understanding) layouts and designs—don’t spend time working up pixel perfect mockups.
  • Encourage clients to participate in the design process and allow them to feel ownership of a design. This will alleviate blockers in the last furlong of a project.
  • To encourage prolific ideas generation he shared a technique with us: use Alphabet 100 to draw the same thing many times. Use this method for logos, for layouts, etc.
  • Since the web is primarily text, start a design with copy and typography first. (We followed a similar route when re-designing the Mudlark website by choosing to focus on content to dictate our layout and design).
  • Jason quoted Dan Mall “Let’s change the phrase ‘designing in the browser’ to ‘deciding in the browser.’”

Appropriate Tension
Tyler Mincey

  • Tyler began with talking about his time at Apple and finding the right amount of ‘push and pull’ with the various inter-disciplinary teams there.
  • He talked about a ‘culture of respectful challenge’—always ask “why”, it encourages critical thinking and learning.
  • Understanding constraints: Innovation is when you move the constraints iteratively, not just designing within them.
  • ‘Good products as communication’: communicate through your work—the care and attention to detail will show through.

The Inertia of Ideas
Michael Heilemann

  • Michael designed the ‘Kubrick’ default WordPress theme. He explained how it was something he did for fun but ended up becoming wildly popular—people even named their dogs after the theme.
  • He talked about his journey from working on things he enjoyed, to working for the open source community, to then being offered a job at Squarespace.
  • Michael worked on an innovative technique that would improve the user experience of a CMS. It was rolled in to the main Squarespace service the day he showed it to the boss.

Responsive Teaching
Tiago Pedras

  • Tiago is a teacher and designer. He shared with us his journey through life up to how he teaches his classes today; which are practical, engaging and employ gamification techniques (involving a gold spray painted coconut.)
  • He encouraged us to share our passion.

Billboards and Novels
Jon Tan

  • Jon talked about the qualities of ‘impact’ and ‘immersion’.
  • He highlighted that the web is about reading. We can really take advantage of this now that we have webfonts and OpenType control.
  • He discovered that good typography induces a good mood (backed up by science!). Dispelling the common notion that it enables us to read quicker.
  • “Fonts are wayfinding apps for emotions”.
  • Jon taked about scan paths. Where does your eye focus when viewing a website. Use colour to highlight something and interup this scan path (and other techniques).

New Adventures in Code
Seb Lee-Delise

  • Seb started with talking about the separation between a ‘designer’ and ‘developer’.
  • Traditionally in educational settings there has been a (literal / spatial) separation between these disciplines. Anything art related would be in a separate campus to the maths and science classes, for example.
  • Between the ‘designer’ and ‘developer’ there is a hybrid emerging. Things seem to be leveling out. (I commented around this subject a while ago on Twitter).
  • Seb calls himself a “Creative Coder”.
  • He acknowledges coding can be a daunting learning curve but, as with most things, it’s very rewarding once you get there.
  • Seb’s talk was really engaging. He’s a funny guy, and his enthusiasm made everyone want to code.
  • He also did some live coding on a Commodore64 (!) and some JS stuff. Seeing this live was a nice way to break down the barrier of some of my code-related reservations.

The Beauty in the Impermanent
Steph Troeth

  • Steph talked about wabi-sabi, musing that we’re indulging in the immortality of things because we ourself are mortal.
  • She referenced James Bridle’s The New Aesthetic.
  • Showed us some examples of ‘low-res’ shoes, examples of digital imperfections out there in the world.
  • Throwaway vs. permanent or impermanent vs. permanent.
  • We get fonder of things over time.
  • How can we make digital things that are allowed to grow old gracefully?

Wayne Tells it Like it is!
Wayne Hemmingway

  • Wayne went on an entertaining, insightful, funny ramble about his life—an inspiring narrative that highlighted integrity and ballsyness.
  • As a board member of the Design Council he highlighted that investing in design will yield the highest return of all sectors.
  • He also said not to rest on the quality of your work—it’s more about what you stand for.

Jessica Hische

  • Jessica’s bubbly up-beat talk rounded the day off nicely.
  • As a freelancer, she talked about the importance on working on the stuff we love, which will then feed in to the paid work that occupies the bulk of our time (and pays the bills).
  • Jessica also touched on work-life balance, burnout and cats.

Now I should go catch my train. Wait, what time is it?

The New Mudlark: Look

Mudlark has been in a transitional period these past few months with Charles stepping up as MD and the company moving to a new base in the city of Sheffield. These changes brought in a refocus on what we do, what we offer and how we communicate that through our identity.

I thought I’d write a short blog post touching on points of our journey developing the new Mudlark look. I’ll follow this up with a post covering our approach to the design and development of our new website.

Letting go of the past

Whilst we used the main tagline of ‘making life playable’, our old website confused communications by using a number of other taglines.

“Mudlark is a cross-platform production company. A partnership between a games company, a TV company and a web company.”

“Mudlark deliver commissions, campaigns and applications.”

“Mudlark produce mobile phone games, ARGs, virtual world experiences, television programmes, digital arts adventures and social network narratives.”

“Mudlark work across platforms, online, offline, real world, virtual world, imaginary worlds and simulations.”

“Mudlark develop original IP value in formats, processes and designs as we tell stories and play games.”

A reminder of the old Mudlark website.

A new direction

After many internal discussions we agreed on a set of qualities which formed the basis of a loose brief. These qualities are; dynamic, playfulness, movement, connectedness, cross-platform, forward-thinking, but most of all: clean, clear and concise.

Some rejected logos.

After exhausting some avenues—including an attempt to breathe life into the old orange Mudlark with a bird-inspired Batman-reminiscent motif—I decided to go back to the drawing board, back to basics and keep it simple.

Mudlark Birdie. The chest and wings form an ‘M’.

The letter M of Mudlark in its simplest form can be created by overlaying two triangles. From this geometric starting point I began to flesh out a new mark. The underlying idea seemed to feel right — it was starting to satisfy our earlier notions of how we want to be seen as a company; connectedness, dynamic, cross-platform.

Early iterations were quite flat, not punchy enough. I started introducing combinations of perspective and experimenting with different line weights.

The evolution of the Mudlark triangles.

What we like about the identity

  • Some people don’t see the ‘M’ right away, and so when they do there is the delight of discovery.
  • The mark is simple and works at smaller size and for social network avatars, etc—important for a digital-centric company.
  • The clean, unfussy lines create a sharp, modern look: we know about the future of products, ideas, etc. and execute without fuss.
  • The soft corners and perspective create a sense of movement: we’re an agile company that can adapt quickly.

Mudlark logo as seen on TV, end credit screen for recent Mudlark documentary.


Mudlark logo used as an avatar.


Mudlark document covers featuring the logo and change in colour scheme based on the service.