Published on | Prototyping: From UX to Front End — Medium Signe Roswall

A thought-experiment on designing for potential experiences

A month or so ago I redesigned the danish Mobile Tickets app by DOT and someone on Reddit asked me to do the same with the danish travel planner app called Rejseplanen (translation: The Travel Plan).

The Travel Plan is a journey and destination finder app for all public transportation, buses, trains and metro (in Denmark). It looks like this:

Screenshots: homepage (far left) inputting a start position (middle) and the results (right)

However, I didn’t really find any immediate or high risk errors in the structure, usability or the design. I looked through the ratings and it has a score of 4.1 on Play Store and 4+ on App Store with no major concerns expressed in the reviews (which was the case with Mobile Tickets app.)

The Travel Plan app might actually even be perfectly decent. It does what it’s supposed to do; it helps you find your journey A–B. Simple and practical.

After having asked a few of my friends who confirmed this, I figured; maybe people are simply satisfied with the app just doing what it does: finding their journeys. They don’t seem to be expecting more from it, and why indeed should they? You wouldn’t expect more from a calculator either, would you?

And if the app is perfectly fine, why, then, was I still looking at it?

Let’s rewind a month or so

I was on my way back to the train station after a job interview, which I’d actually used the Travel Plan app to find which train I needed to take.

I passed a park on the way, The King’s Garden in Copenhagen. As a quickly-in-quickly-out type of person I’d normally have paraded right past it.

But the weather was actually nice, for once. And then I did something I can’t remember ever doing before; I suddenly turned right instead of continuing straight ahead towards the station and went into the park. I ventured off that paved track guiding me to where I was meant to be; life, work, obligations. Always moving forward to the beat of the ticking clock.

This is where I sat down when I visited the park, by this spring with a boy with a…swan? Image from http://www.gamle-dage.dk/

And as I sat there on the bench in the park enjoying the rare rays of sunlight, I realised how I’ve never been in that park before without a specific purpose or it being specifically planned. Last time I was there was maybe two years ago to see a concert with Oh Land. Since then I’ve maybe walked right past that park, what, 50 times? A hundred?

As random or insignificant as it may have felt then, somewhere inside my brain a little light turned on. I got curious about it; exploration and its part in human nature and history.

I thought about how we’ve spread across an entire globe despite not having buses, trains or metros at all, way back in the past. That’s not a very practical or logical thing to do — but it’s somehow in our nature. Those who study psychology and physiology will tell you movement is essential to our neurological development. Our brains literally evolved while we were on the move, migrating over several thousands of years.

“We are powerful and natural explorers” — John Medina (his 12th Brain Rule from the book ‘Brain Rules’)

Travelling beyond A-B and doing nothing

This experience inspired the idea for a redesign of the Travel Plan app, after all. But this time it wouldn’t be focused on usability alone. Because true, travelling from A–B is undeniably the most effective strategy (and I’m not arguing in favour of removing or changing that feature.) In traveling directly from A–B, we save time, the most valuable thing we have.

But is it fun?

And is saving time even worth our time, if what we do with it is just to work more or do stuff we feel like we should do?

Exploration seemed the natural opposite to a destination, without replacing traveling A–B entirely, but enhancing it instead. I felt spiritually guided by this simple drawing Jenny Odell created for her article “how to do nothing”:

I was really inspired by Jenny Odell’s article “how to do nothing”, in which she also writes about labyrinths.

So what will people be exploring — what’s worth the time (and effort) the users would put into it?

I realise, this isn’t only a thought experiment on evolving an app and its design and I apologise if I’ve accidentally lured you here on false pretence (just kidding — — I’m not sorry at all about it.)

There’s actually a very specific reasoning behind it.

I wouldn’t try to get people to explore just anything. The point isn’t sending them off into some “Try Rock Climbing!” death trap in which they might end up feeling positively miserable about themselves. I don’t want to indirectly tell people they’re lazy or insufficient, making them feel obligated to fill their Instagrams and Facebooks with experiences to try and prove me wrong. I think enough of that exists already.

If anything, I’d consciously avoid those lifestyle- and tourist traps or businesses selling experiences (the “should-do’s”) choosing instead non-commercial attractions which offer the very unique experience of not expecting anything in return.

Scott Polach’s “Applause Encouraged” (photo: Scrott Polach) also from Jenny Odell’s article. In the experiment a Greeter seated people 45 minutes before a sunset, reminding them not to take pictures or leave during the “event”. When the sunset was over everyone clapped and refreshments were offered.

Non-commercial-what?

Ms. Jenny Odell enjoys her rose garden in Oakland, California — the place which inspired her article. And I had the opportunity to enjoy the Danish weather at it’s finest in a The King’s Garden park, which inspired this article.

What these two places have in common is they’re non-commercial environments in which the architecture and space simply allows us — or even inspires us to just be or explore, without expecting something from us. This could just as well have been at a museum or a beach, the options are many.

As Jenny Odell argues in her article “how to do nothing”:

“A public, non-commercial space demands nothing from you in order for you to enter, nor for you to stay; the most obvious difference between public space and other spaces is that you don’t have to buy anything, or pretend to want to buy something, to be there. Consider an actual city park in contrast to a faux-public space like Universal CityWalk, which one passes through upon leaving the Universal Studios theme park.” — Jenny Odell, ‘how to do nothing’

Because just as we may have difficulty defending doing nothing in a space which is clearly expecting you to do something (you wouldn’t go to the Gym to sit and read a book, would you?) perhaps we can’t defend exploration or just “being” in an environment which isn’t architecturally fit to it.

What inspires exploration more than an environment with no directions, with no ticking clocks? With unpaved paths and unexplored corners?

Left: Labyrinth in Sibley Volcanic Reserve, Berkeley, CA (unknown photographer) from “how to do nothing” by Jenny Odell and Right: Gothergade: the street right next to the King’s Garden in Copenhagen, Denmark (photo from Wikimedia by Patrick Nouhailler)

So when asking what’s worth worth the time and effort the users would put into exploring these non-commercial spaces, the answer is simple: Nothing.

“Doing nothing” is worth it.

Safe to say, I can’t recommend Jenny Odells article enough if you haven’t read it yet: “how to do nothing” by Jenny Odell.

Diving in: Planning what quickly turned out to be quite a comprehensive Personal Project

Enjoying a well-deserved afternoon beer with my two buddies Pen and Paper 📝🍺 Unfortunately, the two turned into mean drunks and I had to fire them in favour of the venerable Mr. Whiteboard

I decided to add an exploration feature “Explore” to The Travel Plan app. (Meh, typing it into the computer just like that makes it look so easy.)

With the exploration feature, the app will try to nudge people to “travel beyond A–B”. To venture off the paved path just for a little while, but without them feeling like their grandma is being swallowed by The Wolf while they’re smelling the flowers. And so, there are a few rules to this dimension:

Completely voluntary, the feature can be turned on or off without trying to guilt or shame people into using it. Just like I load up Skyrim completely out of my own free will / abstinences.
No “commercial” lots or spaces with the intent of getting people to buy something, be someone or do something. Places where the mind and body can be free to simply be and experience. The “Explore” feature will suggest parks, forests, playgrounds, beaches, graveyards and other public spaces, libraries, museums, landmarks, churches and maybe even some non-commercial activities.

As with my Mobile Tickets project, I’d also redesign the existing app to make the project more fun, focusing mostly on the new dimension but also adding a few edits in the original features.

“I got frustrated with an app, so I redesigned in” is my article from May in which I redesigned the DOT Mobile Tickets App.

Planning is key

When doing larger projects, planning is everything. To-do’s are everything.

Somewhere along the road of this project, I found it hard to focus on all the stuff needed to be done. I tried to comprehend the project as a whole, and was losing my mind over it. It wasn’t until I literally chopped it into bits; focusing only on the single to-do at hand, I began moving forwards again.

To-do list:

Plan the extra “Explore” dimension, what’s essential? Brainstorm
Figuring out what the feature would be and how it would work.
Work on the “Find” dimension, optimisations and new UI
Redesigning the UI starting with the search journey form on the homescreen and its inputs; the main feature.
Design the “Explore” dimension and integrate it with “Find”
Designing the UI for the Explore dimension, this also meant revamping the current menu system in order to make room for it.
Create a prototype in Adobe Experience Design
With the prototype, I could easily create examples of a feature or a flow in the app by clicking through it on my phone and recording the screen.
Produce Material for this article feature-by-feature and old/new UI comparisons.

Brainstorming and planning the “Explore” dimension

The venerable Mr. Whiteboard. I bought this 50x70cm Whiteboard from IKEA. This is only one out of many brainstorms.

Like loading up Skyrim (trying not to shove it down anyones throats)

I decided “Explore” should exist both as a separate section in the app and also as a feature which integrates with the main feature, creating an entire experience instead of existing like a dark little corner in the app.

If people “load it up” or turn it on respectively, the feature gives suggestions for places to explore while they’re travelling or planning journeys. My initial inspiration was my own experience, suddenly turning right and going off into the park, as if I’d just become aware it was there for the first time.

Drawing wireframe sketches on my nifty #Wytepad or, as I like to call them “tiny-phone-whiteboards”

From user interviews, I’ve learned nothing good comes from forcing anything down people’s throats, whether it be pop-ups, advertisements or new features — anything they haven’t asked for.

So in order for such a feature to be successful, it needs to be as non-intrusive as possible. It shouldn’t interfere too much with simply using the main feature. Especially not if the user is in a hurry, because then they’ll be less forgiving, if any at all.

The feature can be entirely or only partly turned on any time, not relying on any “user data” at all in it’s most simplest of states (with Weather and Location settings turned off, more on that later.) This is to respect those who do not want the app to constantly “spy” on them, even though it of course wouldn’t release any of the information to any third parties.

Investigating the different types of search Scenarios

I tried to imagine in which different situations and why “Explore” would suggest places as well as how:

Scenario 1: Planning

In this scenario the user is not in a hurry because they’re planning their journey from home or another location. This assumption could be based on location (are they moving?) as well as arrival/departure time of a journey (is it in half an hour or not until tomorrow?).

If in Scenario 1, the user will get their suggestions while they’re planning the journey as the final step and will have the option to add it to the journey itself as an extra card or box they can tap any time for directions:

“Hmm that looks nice!” — the wishful thinking of experience design😂

Scenario 2: On-the-go

So what if a user isn’t sitting at home/at work planning their journey but is actually “out?” Inspired by my own spontaneous park trip, this scenario targets journeys with no suggested places where the destination has been reached or the user is in the area. Based on GPS (if turned on inside the Explores settings) Explore will suggest places nearby.

This is one of the trickier scenarios because we really don’t want to pester people, so I’d have to ask a handful of typical and different users when they’d want suggestions on where to go, 30 minutes maybe 60 minutes after they’ve reached their destination?

This is where the user research would come very much in handy and is also where I felt like I needed it the most. Maybe this feature isn’t limited to match journeys inside the app corresponding with the user’s current location, maybe it’ll also suggest places nearby if you’re just out shopping or on your way back from a friend/family?

Even if the User clicks “No Thanks”, I’d like to take advantage of this and suggest they take a look at their Explore Interests or Settings. This may be a bit annoying if they just didn’t want the suggestion in the first place but hopefully they’ll forgive me.

Scenario 3: “Frantic” a.k.a the “fuck-off-state”

I’m including this scenario because we shouldn’t assume people are always in the mood to play. Ever tried forgetting an appointment and running late? If people are in a hurry they won’t give a damn about parks and exploration, they just want to get there fast.

I’ve named this “frantic” a.ka.a the “fuck-off-state” to underline my point. So how do we find out if a person is frantic?

The arrival or the departure time can maybe help us a bit here. In the hopes of not annoying people who’re in a hurry, the Explore suggestions will be held back if the arrival and departure time is very close to the current time of the search, anything slightly resembling a case where the user was running late. We’d rather want one suggestion less than one too many, else this could easily earn us some very frustrated users.

The New UI: A closer look at the “Explore” section and its settings

I wanted “Explore” to nudge users mainly through curiosity, because curiosity is a very powerful, very human thing. If you think about it; without an instinctual curiosity would our ancestors from Africa have spread all that way across the globe, founding the polycultural world of today? ¯_(ツ)_/¯

The redesigned bottom-menu has the new Explore section with suggested places as Cards which the user can swipe through (just like in Tinder.)

The Explore feature / “main switch” is turned off by default, and can be turned on inside this section to exist in its simplest of stages or “upgraded” with additional settings:

Accessing “Explore” section from the homescreen and turning on the “Explore” feature (without weather/location based suggestions) from the homepage

The Explore feature can be turned on (1st setting) without any other additional settings. In this state Explore will simply suggest random places or base suggestions on user-inputted interests if such exists.

“Smart” suggestions for Planning and On-The-Go Scenarios

You can’t go where you don’t know. So when a user plans or saves a journey, Explore will suggest places they’ll either pass or be near through their inputted start location and destination, here called Smart Suggestions:

Smart suggestions will appear only if the user is estimated to be in the planning state or on-the-go scenarios. The goal here is to try to catch people while they’re in the bus, train or on foot, so they’ll have better time for it. The Smart Suggestions could appear in-app as well as a push notification.

Smart Suggestion based on end-destination when planning a Journey

Category Suggestions for inspiration on where to go

The Category Suggestions are “special cards” which appear once a day, suggesting a specific category for example parks, beaches, forests and so on. This may help provide people with some inspiration where to go or nudge them to turn on these additional settings to get better suggestions for a better, overall experience with the Explore feature:

A few examples of the “Category Suggestion” cards appearing once a day. I found the illustrations through my Flaticon account, thanks to the people who created these!

Weather Integration (which also affect suggested Category)

In order to provide the user with relevant suggestions, the app needs one or more weather app integrations so it can compare data, generate an average internal weather forecast and suggest places accordingly (if Suggestions based on weather is turned on). This weather setting affects both the single suggestions as well as Category suggestions (here assuming the person hasn’t “swiped” away the Category Card yet):

Turning on “Suggestions based on Weather” affects the currently shown category

A set of rules could be written based on the weather, one such rule could be the app not suggesting a trip to the beach or a sailing activity if it’s raining or too windy in that specific area. What’s important here, though, is not having too many rules either. Beaches are perfectly visit-able during winter time as well.

Location/GPS Setting which affects the order of Suggestions

If turned on, the Location setting will reorder the Suggestions based on proximity to current location, as in the image above where Brøndby Beach (first beach shown without Location turned on) is ordered after Amager Beachpark since that beach is closer to the GPS location, in this example somewhere in Copenhagen.

One setting to rule them all: User Interests

The user can input their interests for better suggestions. The inputted Interests work like the One Ring to rule them All; an interest will always override another rule such as the location or weather based.

There are so many ways of allowing the user to select their interests, this probably isn’t even the best one

As an example, if a user selects Parks as one of their “interests” (or favourite location, rather) this will “override” when the app would otherwise suggest a beach but instead suggests a park because it’s a user interest.

Recommends and Bookmarks

The app will in general try to intelligently base its suggestions on which journeys the user searches for or routes they favourite, as well as which suggestions or places they either recommend or bookmark (another sneaky built-in feature which will help the app provide the most relevant suggestions.)

Travel Smart, Explore More: Optimisations to the “Find” Dimension

This dimension focuses mainly on finding a journey, fast, easy and intuitive as the main feature of the app which will probably also be the most used. I wanted to evolve the main feature further, creating a seamless experience between the new design but still with some new stuff:

New Calendar Integration for planning events and journeys

Daft Punk Alive 2017: why oh why couldn’t they just get their shiny asses to Denmark 😭

With help from an installed Calendar app, either Google, Apple or another installed on the phone, the new Travel Planner app could suggest the user to plan their Calendar event as journeys (see cards above). The user can also set a journey notification/alarm (gif #1) and will also be prompted with the option to “Explore nearby” and find a place to visit in the process (gif #2)

GIF #1: Part 1 of the journey planning process: Adding a “from” position and notification and getting resultsGIF #2: Part 2 of the journey planning process: Selecting a travel plan to save to the journey and getting prompted by Explore

Additional features to consider:

Push Notifications on journey changes
If a train is cancelled, the app will let the traveller know as well as suggest an alternate route.
More focus on voice-ready input fields
The app already currently has a voice button somewhere but I wanted to make it even more visible by including it directly in the inputs.
A complete overhaul for the blind / disabled with focus on getting the app to read aloud. But that’s another project!
Drunk-mode! The homescreen turns into one giant “take me home” button. The app will literally follow you home and might just scold you a little also. Again, another project.

Comparisons: Original and Redesigned UI

Homescreen search formular redesign — now within a thumb’s reach

In the original UI, the most important form is at the very top of the screen, making it hard to reach single-handedly (middle screen in the picture below). The new UI focuses on better ‘click-ability’ with bigger, more visible input fields, icons and more colours (yay!) acting as visual cues.

The original Material Design (black bar at the top) and the Redesigned UI: Filter Search (Left) Homescreen/Search (middle) Journeys (right)

Quick-selecting transport methods

I also created a version of the search form with the option to “quick-select” transportation method(s); afoot, bike, bus, metro, train, which is also under the “more filters” only slightly different. I wanted to give people the option of just searching for a route on a map (if walking/cycling) and/or only traveling with the bus or metro or train.

However, the expanded search form is not compatible with the Calendar Event box, in which case the regular search form is shown. I’d like to split test these two to find out how frequently it’s even used; it may not at all be helpful with the quick-select transportation methods. I’d also need to test the “Afoot” option or label and how people interpret it, whether its understood for only walking or just for walking greater distances than what’s specified in the Filters (the default is 2 km.)

I also split up the date and time inputs so I could re-use the time input view for alarm/notifications also.

In my redesigns of the input views (far right) I placed a numpad image on the screen to make sure I wouldn’t be designing a view which would be useless with the numpad up

Reducing the amount of clicks to as few as possible does not necessarily make good usability. In fact, most users don’t seem too bothered with clicking several times so long as they’re still moving closer to reaching their goal and they sense progress.

Summing up the Redesign

Overall I tried giving the app a fresh, modern design while moving away from the original Material Design which is, in my opinion, too over-used.

A sneaky Mr. Fox seems to have found his way onto my mockups 😸

Side note: No major UI differences planned between IOS/Android

As you may have noticed, my design was created for Android because I’m on an Android phone currently.

Personally, I aim to make an app as intuitive as possible regardless of operating system (or screen size). However, I do realise there may be some minor differences in the ergonomics on Iphones versus Android, the lack of a “back” button at the bottom is one. But I’d want to test it first to determine if any major UI changes needs to be made for IOS at all.

I introduced the bottom menu because it’s still by far the best mobile navigation solution yet in my opinion no matter the device: it’s easily understood, the user instantly gets a sense of their options and the app’s main features. And it’s thumb-friendly, too! 👍

As always, a screenshot of my entire workarea for the prototype in Adobe XD

Try the XD prototype: https://xd.adobe.com/view/df347ed7-a67d-4b53-bd5e-da05310b0a29/

Takeaways

I typed in Takeaway on Pixabay to get some chinese boxes (for the pun), this image was the result. I just had to.

Pursue designing Experiences regardless of estimated value or gain

I’m not saying we should just pursue every idea we get or evolve all apps in the world to each have several features just for the heck of it, because having too many features can also become quite the issue.

I guess what I’m saying is, neither should we not pursue these ideas just because we can’t measure the value or gain from it. Just because we can’t see a problem a feature will solve or don’t believe it’ll make loads of dollars, doesn’t mean it won’t potentially give some personal value or an experience to someone. And though that kind of value can’t be measured in numbers, you won’t be in doubt if you’ve succeeded in giving it.

My point is to not limit our ourselves with data and society’s idea of value, but instead remember to sometimes follow our instincts where they lead us, try another path and learn whatever we can. Even if the feature never sees the light of day.

Final thoughts and conclusion

So the question is not so much which way of travelling is the correct one or how much exploration is the right amount. It’s not whether we should be better at exploring things in order to become better or more fulfilled people, because it’s not my place to preach what’s best (though I’m sure it beats sitting around watching shit TV.)

The question, as I see it; is whether we’re ever faced with the choice. For us designers specifically, it’s if we ever design that choice for people. If we ever design those potential experiences.

If somewhere along that paved path leading back to the train station, we’re made aware there is the possibility of venturing off it, by someone who won’t condemn us for it either. To not always only focus on problem solving and usable or beautiful interfaces, but also remember our own humanity and the experiences we can inspire because of it.

And should we ever find ourselves in the situation of having the choice, if we also remember to every once in a while: explore.

Thank you for reading ✨

Suggested reading material:
“How to do nothing” by Jenny Odell
“Brain Rules” by John Medina
“Designing for Emotion” by Aarron Walter

Signenigma @ Behance — Signe Roswall @ LinkedIn — Website: www.signeroswall.dk

Travelling beyond A–B: Evolving a Travel Planner app (Rejseplanen) 📱✨ was originally published in prototypr on Medium, where people are continuing the conversation by highlighting and responding to this story.

Travelling beyond A–B: Evolving a Travel Planner app (Rejseplanen) ✨

A thought-experiment on designing for potential experiences

Top Stories