Once upon a time, I claimed that I could do UI design of applications. This was back in the Newton and Palm OS days where the apps didn’t do a whole lot and the developer guides had pretty clear guidelines that everyone followed. For Palm OS, it even had the number of pixels from the edges for buttons which made it quite easy to know exactly where to place objects.
Moving forward 20 years, it is clear to me that I can follow guidelines, but I need help designing an interface. This is where I’ve learned a ton working with professionals that do design. So far I’m being vague about what I mean by design, because I think that there is a clear misunderstanding of what is mobile design (or application design in general).
There are 2 main areas that I see referenced in mobile design. They are User Interface (UI) and User Experience (UX). While they sound very similar and some people treat them the same, they are very, very different. I’ve had the opportunity to work with a very talented individual that makes both look easy and has taught me the differences.
In general terms (at least to me), user experience is how the user navigates through an app, uses the features, and generally interacts with it. User interface is about drawing the pretty pictures, identifying the typefaces for styling, and picking the colors. In working with a designer on our team, I saw how he meticulously mapped out how everything would work in the application by putting together flowcharts of what every button would do, how you got back somewhere, what was the recovery for every error, how it interacted with hardware, what to do while the user was waiting for a network operation to finish, etc. The actual user interface was secondary to the user experience; for the most part we used standard controls, a standard color palette, etc. This type of design really impressed me as our designer identified so many things that are easy to ignore when simply writing an app. (How many apps just display “Error” with a number with no way to recover from it?)
On the flip side, I worked on a project where the designers were user interface designers trying to do both UX and UI design. Their UX design made the app hard to use, didn’t consider different screen sizes, didn’t consider navigation, didn’t consider how to display data that wasn’t in their sample, and was really about how pretty they could make it look. This frustrated me to no end as they wanted all kinds of custom interactions that would require end user training and were hard to use. In addition, they didn’t consider dynamic typefaces which I feel are important in consumer apps as people like me increase the type sizes to make the text easier to read. I pushed back on some of it and made the app work the best I could. I’m definitely not any type of designer, but having been in this business long enough, I know what doesn’t work!
As a user of apps, I find that a good user experience is paramount for me wanting to keep using an app. However, without an appealing visual appearance, I probably won’t enjoy looking at an app. Keeping these ideas in mind makes killer apps. I feel quite lucky to have worked with a designer that has taught me so much about design; I think that seeing how he did the design and how he considered all the interactions will be a huge benefit to me in the future when I work on new apps.
For me, a great example of this is the countdown timer that’s part of core iOS.
While I wasn’t a great defender of the earlier iOS interface, the earlier version of the countdown timer was a much better design than the current version, both from a visual standpoint and from a usability standpoint.
When Jony Ive pushed everything to thin lines and thin fonts he made it difficult to both control and see the current timer. The older timer had bigger buttons and easier to read, thicker letters.
The interesting piece of this is now, I use Siri to set timers and so, don’t interact with the countdown timer as much. Siri didn’t solve the visual problem, it allowed a work around. I still think the timer is ugly and tougher to use and see than it needs to be.