Work Process

Stories behind the work
|
Alex Gorischek

Mobile app UX design

→ The Trouble

I like keeping a list of places to go when visiting a new city. Perhaps a friend recommended a museum, or I found a coffee shop on Yelp, or one of my favorite beers is brewed there. I'd typically put these in a checklist on my phone and try to check them off as I went — but I'd have to head over to a mapping app to see whether the place was open and how far away it was, which resulted in an inordinate amount of time staring at my phone. I designed an app called Pyxidi to help me out.

→ The Idea

What if my phone could take my points of interest and choose the best one to do next? What if it considered where I was, what was open, the time of day, and what I had already done? And what if I could tell it I wanted to do some things more or less than other things? My goal was to create an application that could take a list of points of interest and recommend the single best thing to do next — sort of like a just-in-time schedule. I wanted an "itinerary, but more lax" (as I jotted in my notebook). I knew there were three fundamental actions I could take on any particular location: Get directions, check it off the list, or save it for later. That became the core screen of the app: A single recommendation, and a few relevant actions I could take.

→ The Metaphors

Taking inspiration from the way you "star" locations in Google Maps, I decided to follow a space theme. The recommended place to visit would be my "guiding star." I imagined a whole galaxy of stars — all the locations I wanted to visit. And the other nearby places formed a constellation of sorts. I was the rocket ship flying through all these places, and at the end of the day I could land at my base. The space theme gave me some rich metaphors to work with, especially for the iconography, which kept the app from feeling like "just a checklist."

→ The Structure

Although the core of the experience was the guiding star, there turned out to be an extensive amount of other UI necessary to support it: How do you add and remove places from your list of things to do? How do you organize your destinations of interest into discrete trips? Can you edit the details of a place of interest? What if its business hours aren't listed online, or are incorrect? What if you don't know where you'll be staying at the time to create a trip? A long list of questions turned into a multifaceted app structure necessary to support the core experience. By the time it was fully designed, I could no longer keep all the screens in my head at once! But once it all came together, the experience was exactly what I'd hoped for.

→ The Release... Delay!

The app really doesn't do much without a huge database of places to power it, and I ended up choosing Foursquare for that purpose. Google Maps charged a ton of money for their data, and Yelp didn't let you cache the results. Foursquare offered their data for free, so long as users sign in. This all worked just fine... until I went to publish the app. It turned out that Foursquare's sign in process didn't meet Apple's UX requirements, so I was blocked from releasing! I had to work with the Foursquare dev team to resolve this issue and get some new UI into the app before I could get it into users' hands.

→ The Feedback

Beta testers and initial users enjoyed the app, calling it “lovingly made” and complimenting the "beautiful and easy-to-use interface.” At the same time, it wasn't the right fit for everyone: Some folks didn't want to do any planning ahead of time, and instead wanted the app to recommend things based on their interest once they arrived in their destination. I decided not to pursue that route, since Yelp, Google, Foursquare, and others were in much better positions to nail that scenario than I was.

→ The Conclusion

Unfortunately, competing for attention with the other apps in the travel category was near-impossible. Although no other software out there did quite what mine did, it nonetheless got drowned out by ads and features for flight and hotel-booking apps — even though those weren't actually competitors. Despite some sales, I never managed to turn it into a profitable product, and removed it from the App Store. Nonetheless, it remains the centerpiece of my travel planning.

Widget UI design

→ The Trouble

Admittedly, I sometimes have a bit of difficulty determining the right tip at a restaurant, especially when somewhat-less-than-sober. Tipping is a gratuity calculator for iOS that I designed to help out.

→ The Concept

My goal was to create an experience that was as quick and discrete as possible – after all, I didn't want the folks I was out to dinner with to think I was checking social media instead of engaging with them. I realized that something you could use without unlocking your phone would be the fastest, but Apple doesn't technically allow keyboards in widgets, so I had to design the interface carefully.

→ The Style

I explored names, fonts, and shapes to find a combination that reflected the app's mathematical nature, while mixing in a little bit of generosity and fun. After nixing a few names that were already taken by other software, I settled on "Tipping." And although squares were the more typical shapes used for calculator keys, I went with circular keys since they were reminiscent of coins. I tilted the wordmark just a bit, as a play on the name.

→ The App

Although the primary use for the app was in widget form, I realized I needed to provide a full app experience as well, as not all users would enable the widget. At first I put the controls towards the middle of the screen and added a background full of coin-like circles. I quickly realized, though, that since the goal was to be quick and discrete, it would be much better to use a dark background and put all controls within the reach of one thumb.

→ The Widget... Again

Around the time I was wrapping up development, Apple announced a revamp of their widget UI, where all the colors were inverted and widgets were expected to support multiple heights. This really threw a wrench in things and required me to figure out how to most effectively utilize the new configuration.

→ The Marketing

I kept the marketing imagery and website straightforward, to reflect the simplicity of the app. Composite mockups of dinner settings, with bill and cleared plate included, provided visual context. Keeping with the app's focus on efficiency and its slight cheeky presentation, I tagged it "The ridiculously quick tip calculator." I took out App Store ads for some basic terms like "gratuity", which turned out to garner quite a few impressions and taps.

→ The Feedback

Reviews were generally positive. One reviewer said it was “Simple and clean. Useful for people who hate math”, which I had mixed feelings about, as I don't really want people to hate math. Another reviewer threatened to give it one star because he couldn't figure out how to enable the widget. (I couldn't make this much easier since you have to do it through system UI, but I wrote a help article for it.) Users requested the ability to round up to the nearest whole dollar, as well as to split multiple ways, so I designed options for both of those in a second version — though I kept the splitting interface hidden by default to prevent things from getting too busy.

→ The Conclusion

Tipping apps are a rather crowded software category, but the app was nonetheless purchased more than a thousand times. I eventually took the application off the store, and some weeks later received a bittersweet message from a user saying: "Went to suggest the app to a friend today as I use it pretty regularly, but to my horror found development has ceased.” I shared the disappointment!

Concept Construction

→ The Epiphany

While reading the wonderful book "Code" by Charles Petzold, I came to realize that the concept of computers went far beyond desktop electronic gadgets — A computer was literally any device that could take symbols as input and produce symbols as output. This blew my mind. Web searches turned up computers (specifically, the simplest form of computer, called a logic gate) built of gears and marbles and even crustaceans (seriously). One mechanism I didn't see used was pulleys and gravity. I took this as a challenge, and Pulley Logic Gates was born.

→ The Prototype

The first problem was, of course, not having any pulleys and weights handy. Improvising, I took one of the slats from my bed, some kite string, and a handful of spare nails and bolts, and threw something together. It looked awful, but it worked. Getting the full range of logic gates would just be a matter of configuration...

→ The Construction

...and also finding some decent materials. It turned out there were easily available sets of scientific weights, and I was able to get some string and twist ties that worked well enough for my purposes. But it took me a while to realize that a chess board —with its beautiful, geometric, wooden surface — would be the perfect backing structure. After I put it all together, I video recorded all eight configurations in action with my point-and-shoot camera, then created some conceptual diagrams and explanations to accompany each gate.

→ The Response

I posted the completed video to Vimeo, just under a week after first having the idea. It got a few views, but things were mostly quiet. And then Gizmodo picked it up. That was followed by features on a bunch of other tech blogs, commentary on Reddit, and a stream of mentions on social media. A teacher reached out asking if they could use the setup as an educational tool, so I provided instructions and a materials list, and an engineer even created a full 3D printed replica. To date, it's racked up nearly a quarter million views.

→ The Conclusion

As it turns out, you can get a simple concept communicated to a lot of people on a low budget with a bit of clever presentation. My hope is that these pulleys have helped demystify computers — even just a little — for our next generation of engineers.