Who did it better? Lime vs City Cycle (Mobile UX exposed)

Lime vs City Cycle - who does it better? Read on to find who meets the grade in the usability stakes and who does not, and why...It probably doesn't seem like it, but I have been around the design and development of digital interfaces for nearly 20 years, I have spent tens of thousands of hours building and troubleshooting them. In that time I have developed a second-sense as to what I know works with usability and aesthetic and what does not.I can usually pick out the cause of a problem instantly with an interface, and recommend an antidote to the problem.It's like typographical kerning, you just get to know. Frustratingly in many cases, the problem is extremely obvious and the fix so simple, but unless it's one of my clients the fix is not going to happen. Freezing the problem in time, taunting me. (It doesn't look right does it?)As part of my 'usability therapy', I thought it would share my view on the website and application interface ecosystem in the Brisbane (and Australian) digital space. To make it interesting, why not compare two similar products or services and see who does it best? Along the way, I will point out good (and bad) practice where I see it.First up, Lime Scooters and City Cycle. These are two services I have used in my time in Brisbane for my own personal transportation. No, they are not the same product, but they share a presence in the personal public transport space.If you are keen, check them out now:

• Lime Scooters
• City Cycle

For this exercise, we'll be looking exclusively at the mobile user experience. [Reminder, become a mobile-first marketer in 2020!]

Metrics for analysis

You've seen our spider graph above, but let's look at what each of these elements means:

Metric	Explanation
Conversion-path interaction count	When atomised, how many discrete user actions does it take to complete the primary conversion pathway?
Positioning / SEO landing page	Is it clear what this company and website are about? Are we starting in the right place?
Mobile optimisation	Are the content and interface designed for mobile?
Navigation / Information Architecture	Does the user have a clear and accessible navigation and content structures?
Search	If necessary, what search capabilities does the website have?
CTA's	Do I know what I can do, and can I easily find these capabilities?
Aesthetics	How well presented is the website? Is it clean and simple to understand

These are (relatively) easy to understand lenses you can use to view any kind of digital interface for deficiencies and improvement.What do we analyse?To keep the scope focused for this article we will look at the registration process as improvements to this user experience increase membership and ultimately revenue.There are other aspects of these systems that are interesting, but they ultimately don't have the same potential for return on investment (if this was a client). This means we exclude: Every day usage, account management, account termination and many other use cases.

Conversion path count

There are multiple conversion pathways for City Cycle. From signing up as a monthly membership to a casual user. For the sake of simplicity for this blog article, let's look at the ability to sign up to membership for each of the services.For our conversion path analysis, there are a few things we consider regarding the conversion complexity or investment the user needs to make, to get themselves over the line:The interactions that you should be paying attention to when breaking down the complexity of the user experience on mobile are:

• The number of times I need to click
• The number of items you need to scan to find your element if contained in a list
• The number of pieces of text you need to scan
• Complicated messages that need to be comprehended
• The scrolling required

The two conversion pathways work as follows:

Lime Scooters	City Cycle
Click to download the app (Easy) Download the app from app store (Easy) Register phone number (Easy) Confirm SMS confirmation code (Easy) Accept user agreement (Easy) Enable location services (Easy) Add payment method (Moderate)	Pinch and zoom - Scan page (Difficult) Select access mechanism (monthly + card type) (Difficult) Enter personal details (15 fields) (Difficult) Confirm your details (and membership details) (Moderate) Payment collection page (disconnected experience) (Difficult)
Key questions are atomised. Bite-sized. Many steps are simple confirmations or one input. This reduced the perceived effort of the task. It's almost impossible to screw up an input.	Less overall steps, but each step is heavy! Validation is completed after the user has submitted the form and is unspecific. Quite frustrating. The pinch and zoom experience is eye-wateringly frustrating.
Interaction count: 15	Interaction count: 67

As you can see there is a considerable difference in their conversion pathways. While City Cycle has fewer screens, there is a considerably higher interaction count to get the process done.The smaller the interaction count the better.Ask yourself:

• Do you weight the collection of fiddly personal details over the value of increasing conversions?
• What is the absolute minimum threshold to conversion for a customer consider themselves 'invested'?*

*Tip: It's usually just payment details.You can collect all the information you need after the fact. Or you can look at customer profile on a behavioral perspective rather than demographically.

Positioning / SEO Landing page

What happens when we load up the very first page from the Google result.Oh dear...It's a bit of a mystery why the City Cycle website isn't responsive. It vastly complicates the user journey to a pinch-and-zoom fiesta! And by fiesta, I mean nightmare.Lime Scooters

• I get a clear indication of what's going on
• It looks like I am in the right place

Installation is pretty simple: City Cycle

• *Gulp*, here we go...
• No text is clearly legible on the default screen
• I presume I'm on the right place, I can see pricing - once I pinch and zoom in

What is the problem with the City Cycle page?

• There are clumps of information ALL over the place, where do I look?
• Pinch-and-zoom adds a double interaction penalty. It requires a scan of the page, a guess at the likely place I need to zoom.
• I don't know the City Cycle model (at the time)
• I don't see a pathway set up for me to follow (like Lime)

Ask yourself: It is instantly clear on your landing who you are, what you do, and what the user can do on the website?

Mobile optimisation

Clearly, there is a major difference here.The strength of the Lime solution is that every interaction has been atomised. I don't need to scroll to see any information or to click any button, it's all there.City Cycle is clearly not optimised. This would be obviously costing them on the uptake of the service. I would have to question whether the incentivisation for the service is structured appropriately as it would seem like a no-brainer to get this fixed? I don't have an insight into the commercials between Brisbane City Council and JC Decaux (who operate City Cycle). Maybe someone else does?

Navigation / Information Architecture

The information architecture deals with the organisations of the content through the primary navigation, but also with the on-page content structures.City Cycle has the information one would look for, but:

• It's extremely hard to engage without a mobile responsive view.
• There is too much explanatory text.
• Information requires a lot of scrolling and pinch/zooming.

CTA's

Lime Scooters

• The Lime system keeps me focused on the immediate step in front of me.
• There's no fluff information, it's clear what I need to do next.

It's like I am walking through a labyrinth, following a series breadcrumbs. But in this case, I have no idea it exists because I am just looking at what I need to do next. I just take it one step, one action at a time.City Cycle

• The abundance of text and content make it difficult to quickly get a sense of what is going on.
• Off conversion button text. e.g 'validate' for contact form details.

Note - The optional CTA to buy a helmet is useful. But perhaps could be added after the signup has been completed?

Forms

This is one area that is compounded by the lack of responsive behaviour.This is how forms work on City Cycle. First, we zoom in to get a better view and depending on your device, you may be automatically zoomed into the 3rd screen. Robbing you of field context. When I hit a validation problem, I get this: Error: The following characters are forbidden: : ?;:%#&!~|`^*+[\](\){\}$@There is no guidance on what the problem is here. I need to figure it out myself.By comparison, the following screens represent the ENTIRETY of the keyboard input required for Lime. The rest are just confirmation messages. So much simpler!At the end of the day, the question has to be - do you want customers that give you more information about them, or do you want conversions? In this instance , it is conversions!

Aesthetics

Lime Scooter uses a contemporary, clean digital design that is easy to understand and easy on the eyes.City Cycle looks like it was put together as an after through by a developer (who is not a designer).

The Verdict?

I'm not sure this needs saying. Clearly, one initiative is doing digital very right and the other... needs some work.The barrier to engaging the City Cycle eliminates the use case of the average person would casually go through this process on a whim to try out the City Cycle. It's just a massive pain.However, for Lime Scooter, this is precisely how and why I signed up.In so far as the value propositions of the two services, I actually prefer City Cycle, and used it for a solid two years before moving closer to work. It was very cost-effective and predictably convenient. I have used the Lime Scooter a few times, heaps of fun, but the all-or-nothing nature of the accelerator made for a ride that led me to believe people would be hurt using the service - and I didn't believe being able to hit 30 km/h on a pathway in the city was a wise speed limit. I also found that I couldn't predictably rely on being able to get a Lime Scooter - it was more transportation of opportunity.

What would I do differently for City Cycle?

The whole approach to customer experience for CityCycle needs to be replaced, root and branch. I would hazard to say CityCycle isn't doing anything that you couldn't have done 20 years ago.

• Make a mobile application
• Rethink the entire user journey and experience
• Seriously question the information we Actually need to sign someone up. Phone number and credit card should be enough!

This is still really only fixing the basic registration workflow.What if we wanted to make for a more compelling service, that could make at least some use of the current technology available to us?

• Enable a mobile-based checkout system. To physically have the swipe and enter in a code is unnecessary. A mobile app could easily identify the closest bike rack and should allow checking out with a single click, with a bay number displayed - perhaps even with a visual reference to where that bay is on the rack.
• Sharing is caring. Provide the ability to give a free ride to a friend. This could be limited to 1 a month, or to 1 per phone number to avoid abuses. This makes it easier to use the bikes socially and to spread its use.
• Route prediction, if you follow the same route every day it shouldn't be too hard to identify and make proactive suggestions if the bike bays are full (an inconvenience). Depending on where you ride, it may be a semi-regular experience that your bike cannot be checked in because the rack is full, which makes for a very frustrating customer experience.

Would you like 5 easy-to-implement usability ideas?

If you liked our thinking and was interested in what we would do for you, let us have a quick look at your website or application. We'll talk you thought your goals, pain points and highlight what we think would be the most effective set of improvements you could make to your user experience. Register here or drop me a line on [email protected].