Category Archives: Code

CUBD: can you think in 3D?

Posted on by
Reply

I made a game! I’ve been working on it on and off for about six months, between work and freelance projects, and it’s finally ready enough to be released.

It’s called Cubed, and it’s probably best described as a 3D action-puzzle game – think Bejewelled meets Rubik’s Cube. You have to turn sections of the cube to make groups of three or more cubes of the same colour, then click them to remove them from play.

More cubes appear to fill the gaps over time, and the higher your score goes the faster the cubes appear – then when the main puzzle is full you’ve got five seconds to clear some space before it’s game over.

It’s always hard being objective about your own projects, but I’m pretty pleased with it overall. I find that when I’m testing it I often start actually playing it for real, which I think must be a good sign…

It’s built in Flash using the Away3D library, which is powerful but seriously lacking in documentation; I spent a good few nights trying to work out the difference between project() and unproject() and figuring out how transformation matrices worked, with very little support from the library. Once you do find the right function to call, though, it’s pretty easy to set up cameras, light and textures.

I’m in the process of porting it to iOS, which has mostly been fine – the actual process of exporting it for iOS (after struggling through Apple’s ridiculous Developer Program nonsense) is pretty straightforward. What caused me several late nights, though, was the change from mouse events to touch events.

I don’t know if it’s an artefact of Air for iOS, or Away3D, or the specific interactions I was trying to create – or a combination of all of the above – but I encountered a really frustrating bug. I could touch and drag and lift, and that all worked fine, but when I next touched the screen the MOUSE_DOWN event registered at the place the previous MOUSE_UP event triggered.

This was such a weird bug that it took me a while to realise what was actually happening, and then even longer to try and work a way round it. I ended up dumping MOUSE_DOWN events altogether, and substituting MOUSE_OVER instead – when the user touches the screen the “cursor” jumps to that spot, triggering the event.

This worked fine until I installed the Air 3.5 Beta SDK, which broke MOUSE_LEAVE and MOUSE_UP events, and gave me another sleepless night until I realised the SDK was the problem and went back to 3.2. I’m probably missing out on exciting new functionality, but it just wasn’t worth the hassle of having core functionality broken!

UI-wise, I’ve tried to keep everything really stripped back and simple, focusing on interesting interactions rather than complex gameplay mechanics. One big challenge was working out the user’s intention when turning segments of the cube: there are three possible interactions for any cube, turning in X, Y, or Z, and since input devices only function in 2D I have to set rules about what happens when you move the mouse a certain way.

The game projects your movements into 3D space and tries to guess which way you’re trying to spin the cube. This is guesswork, ultimately, but I think the results are generally pretty consistent, and when I’ve watched people play Cubed they pick it up quickly. In general, the iOS version is even better at this, because it removes the mediation of having to interact with the mouse. There’s something really nice and tactile that makes playing on a touchscreen more immediate and more satisfying.

You can get CUBD for iOS here and the game has its own site here. Enjoy!

Abstraction and Wireframing

Posted on by
3

Before my current incarnation as a UX Architect I was a Flash developer. I spent five years coding all kind of games, sites, and apps, and gradually progressed from simple bits of script to full-on applications and fully abstracted object-oriented code.

My day job now is focused on less technical work like research and wireframes, but I think during those years of coding I learnt some interesting concepts that I’ve carried through to this new role.

I recently wireframed a few simple online art activities for children which involve adding shapes to a canvas, animating a simple figure, making a postcard and so on. None of the activities are very complicated, but as we discussed time estimates and functionality my old developer habits started kicking in.

I found I’ve been thinking about how I’d go about building these apps, which led on to thinking about how that affects the how I wireframe things. As I did so, I found some interesting parallels and insights – so I thought I’d share them here.

Continue reading →

Copy-and-pasting the competition

Posted on by
2

If you’ve ever copy-and-pasted text from a website like the Huffington Post, among others, then you might have spotted the sneaky way it appends some extra text to your selection. For example, you might copy:

This way you’ll never have to choose between your armour and your spoon collection again.

But when you paste, it becomes:

This way you’ll never have to choose between your armour and your spoon collection again.

Read more at: http://www.huffingtonpost.com/

(NB Either it’s not working or they’ve turned it off, so I’ve actually just made that one up as an example…)

Sneaky, eh? I’m sure most normal people just delete any annoying extra text straight away, but hey. It’s done by a little javascript include, which is is a nice idea, but nothing special in itself. But some clever/evil person beavering away in a dark room has thought of a different way to use the script.

Recently lipsum.com, a site generally used by designers to grab a slice of lorem ipsum from has started appending a job advert for designers to any copied text.

Do your layouts deserve better than Lorem Ipsum? Apply as an art director and team up with the best copywriters at Jung von Matt:www.jvm.com/jobs/lipsum 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur leo turpis, rutrum ac tempus in, pellentesque at lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In hac habitasse platea dictumst.

It’s a clever idea in some ways, because these ads are going directly to the people they’re aimed at, skipping jobs sites, recruitment agencies, message boards and everything else. As targeted marketing goes, it’s pretty bang-on.

But, crucially: it’s actually pretty annoying. I don’t know a single designer who would welcome having to remove that extra text every time they copy-and-pasted some dummy text. So while they’re reaching their audience, they’re probably also pissing them off in the process. lipsum.com is hardly the only place on the web to get lorem ipsum from, and if I were a designer I’d be looking for a new source as soon as I saw that first ad.

Targeted advertising can be clever, but there’s a time and a place for ads – and bang in the middle of someone’s workflow is not it.