Category Archives: UI

The Evolution of WURM UI

WURM is a generative mobile app that I first released at the end of 2010. Unwittingly, it has become an on-going pet project that I still keep tinkering with. Part of the reason is that I keep learning the iOS platform. When I started making the app I knew almost nothing about Objective-c or developing in the OSX environment. In hindsight, it actually seems a miracle that I even got it on the App Store given how little I truly understood about what I was doing. Coding on blind faith was more like it. But it was fun and now, over two years later, I feel pretty comfortable around the iOS. 

The other part of it became the UI. The touch interface was such a novel and exciting canvas that my inner designer couldn’t get enough of it. Still can’t. If I had to guess, the UI probably takes up the biggest chunk of my process because, unlike coding, there’s not a lot of logic to it. It’s very organic and I usually have to “see it to feel it”. That often takes many iterations, and even when I do settle on something, I’m never 100% sure of it. But I ship anyway, knowing that things will inevitably change in the next update. It’s the process itself that I seem to get hooked on. The truth might be there somewhere..

Here’s WURM design timeline to date (iPad version not shown).

Version 1.0: First official version, designed using mostly default controls.

WRM-UI-1_0a   WRM-UI-1_0b

 

Version 1.4: Custom-designed controls; new shuffle button; also purchased my first iPad, which led to a universal UI adaptable in all orientations.

WRM-UI-1.4a   WRM-UI-1.4b

 

Version 1.7: By this point I designed a bigger dashboard for the iPad but the look of UI elements remained the same, so I continued refining.

WRM-UI-1.7a   WRM-UI-1.7b

 

Version 2.0: I had new ideas for the app, which required a significant change in the programming logic, which in turn, forced a new UI overhaul.

WRM-UI-2.0a   WRM-UI-2.0b

 

Version 2.1: I’m the biggest user of my app and by this point I craved something fresh; decided to try a lighter and simplified look.

WRM-UI-2.1a   WRM-UI-2.1b