Yes, we’re excited about Config. In recent years, the level of production and hype around these launches feels eerily close to Apple keynotes — historically seen as moments of pure innovation. And to be fair, Figma earned that stage.

They truly built a product that transformed the day-to-day life of designers. By simplifying workflows and consolidating tools, they shook up an industry long dominated by clunky, fragmented processes. Suddenly, designers didn’t need three tools just to prepare a basic handoff. That was huge.

Figma changed lives — no exaggeration. And not just for designers, but arguably for “thinkers” too (if I may borrow the buzzword). But that’s also where the story begins to lose clarity.

Because, Figma, if I may — developers, content folks, graphic designers, marketers — they’re not really here with you. They’re around you. And their connection to you still runs through product designers.

Figma, You’re Talking to Devs. But Are They Listening?

Figma’s been trying — really trying — to make developers feel like a first-class audience. That statement from 2023 — that Dev Mode would make developers “feel at home” — hasn’t materialized, despite 3 years of emphasis.

Here’s the thing: no developer I know watches your conferences, Figma. They’re not advocating for you to leadership. They’re not asking for Dev Mode. They’re not saying, “Please increase the budget for Figma so I can better inspect your mockups.” If anything, they’re just hoping for a Zeplin-level readout so they can get on with their job.

By this day, the most popular thread on Reddit around dev mode (from developers) is “ Figma Dev Mode is a scam”.

Now it’s interesting to see if Figma Sites would catch up enough attention from developers. The hype is still in the design community — and there are plenty of questions. And it’s again designers, who need to bring the conversation and the questions. But Figma Sites was something that we have been waiting for a long time, and who knows — it might really be the bridge.

Graphic Designers Are Watching — But They’re Not Leaving Illustrator

Graphic designers have been keeping an eye on Figma. They’ve read the posts. They’ve scrolled through your announcements. They’re curious.

But let’s be honest: introducing editable vectors isn’t enough to unseat Illustrator, a tool that’s been around since 1987. You’re trying to pull them away from workflows that are deep, refined, and essential to their craft. And right now, you haven’t given them a reason big enough to make that leap.

Curiosity isn’t conversion.

Content Creators Were Never the Core — But They Got Hooked

There’s also a new cohort Figma has started noticing: content creators. They were never the original audience, but they showed up anyway — building presentations, moodboards, and layouts inside Figma because it was free, and it was ridiculously easy.

Now, with a new paid plan aimed directly at them, Figma’s clearly signaling, We see you. And we’d like you to pay now.

It’s not inherently wrong — but it does raise the question: are you building for creators, or just monetizing their unexpected presence? The direction is interesting. Whether it’s sustainable or empowering remains to be seen.

And with the pace of complexity building up, would they be willing to commit that much?

AI Ambitions — No Revolution (Yet)

Let’s talk about AI.

Last year’s announcements painted a bold future. But so far, the rollout hasn’t matched the ambition. Yes, AI-assisted layer renaming is faster now. And searching by image? Genuinely useful. Translating text? Great. Most of them we were already using as plugins. Now we are not going out of our workflow, and they are truly improved.

But these features still feel more like enhanced shortcuts than a true rethinking of the design process. What I’d love to see is AI getting into the bolder UX possibilities — comparing products, generating design analysis, or auto-documenting based on mockups. Things that would make us a bit afraid — in a good way.

And of course, it’s not something that can happen over night. And that’s okay.

The Ever Evolving Complexity

Even among product designers — the audience that remains Figma’s most devoted — there’s a growing sense that the product is entering a new phase. What was once a clean, intuitive environment tailored for UI work is starting to take on more complexity.

Take something as simple as flattening layers. It used to be a basic action. Now, it auto-converts the image to vector, introducing dozens of editable anchor points that actually makes resizing in some cases impossible. As a product designer, the ability to quickly and predictably resize an image often matters more than the option to fine-tune every vector path.

While this change might benefit certain workflows, for many, it signals a broader shift in design priorities — one that may not always align with the needs of Figma’s core users.

This Isn’t Just a Rant. It’s an Honest Check-In.

I know all of this might come off as edgy — and of course that’s not the whole story.

Figma is still an incredible tool. The speed at which it’s grown, evolved, and innovated is nothing short of extraordinary. I still use it. I still recommend it.

But I also think it’s important to voice the unspoken anxiety many of us are starting to feel. The creeping worry that our favorite tool is morphing into something that feels less familiar, less focused — and harder to love unconditionally.

So this is less of a takedown and more of a check-in. A moment to say: Figma, we see where you’re heading. We admire the ambition. But don’t forget what made us fall in love with you in the first place — clarity, simplicity, and focus.

Even in pre-pandemic times, there was so much space for improvements in almost all airports I have been to.

Do you know that

• Just for one day around 1058 flights are delayed
• Last week 8 562 flights were canceled in just a day (this was written in March 2020)

If you think that this information is only due to the quarantine — take a look at the statistics for 2018:

An estimated 4,494,000 air passengers have experienced a flight delay, cancellation or overbooking between 1st January and 30th June 2018. (source: link)

Maybe we can’t control the flight services, but at least we can improve the experience.

So, we asked solo travelers

How do they organize their holidays and what are their frustrations?

Here are their answers:

And we identified a persona:

From all this, we had to raise the question:

How may we help Nastya make an informed purchase on her flights and take care of her experience at the airports?

We found three solutions to this problem:

• We needed to make an app that compares prices between a variety of companies that provide flying tickets.
• We needed to insert a service that will notify clients when their flight has a delay or is being canceled.
• Help people communicate with each other — by their flight, or at the airport, once they buy a ticket.

We did benchmark research in the field among different traveling companies: Kayak, SkyScanner, Wizzair, KLM, Hopper, Couchsurfing. They all had separated features that worked in the direction of our problem, but none of them had all three solutions together.

and this is how we came to a new app, called:

SkyMate

“We compare cheap flights and think about your experience”

We made SkyMate for Android with Sketch and you can test the hi-fidelity prototype with InVision here (no registration needed:

https://projects.invisionapp.com/share/RTX0AQ85G6C#/screens/414947757

How did we use usability tests to improve the app?

Usability tests always give us some insights that we might have missed with lo-fi or paper sketches. After each stage of the process (paper sketch, lo-fi, and hi-fi) we do a usability test, to test the experience. Because we, the designers, are not the users.

Here are some main changes that we implemented with usability tests:

• Choose your flight, instead of “Find your flight by Number” — the user said they wouldn’t do this step of putting their details. So, we let them choose among their booked flights.
• Inserting nearby dates prices instead of the section “best deal, cheapest, fastest” — the user said they already knew that and they need to know more about the price.
• We gave them more details on the flight result. One of the users said they missed that.
• We gave them a “skip button” to skip the intro. The user said they would deinstall the app if they don’t have this option.

iOS conversion

Though the app is designed to be synchronized between the two operating systems — Android and iOS, there are still some slight changes that the iOS version will have:

In the first (left to right) screen:

• The “Skip” button goes to the left.
• The text is centered.
• The buttons have a maximum radius.

Second screen:

• The new change is that the active icon will pop up. It’s not a mandatory for all iOS, but I find it nice.
• Also, the search button goes to the left, to be easier to be accessed.

Third screen (left to right):

• For iOS the back arrow looks different.
• It will be used for swiping the nearby dates and results too.

What’s next?

This whole product is not perfect. It was done in the duration of just one week. A lot of work will be involved to nail it and the next steps are:

• More usability tests
• Develop the “save for later” section
• Flight changes notifications
• Make a strategy for introducing the section “Social” with notifications
• Related illustrations for the “Social” channel
• “Eco-lines”

What did I learn from this?

The most important thing I learned from this project was to keep good communication with the tools (especially when working alone). Even when you have rage, you have to apologize to the tool and get back to work. Time is enough, it's up to you how you will organize it. It may be hard, but it is achievable. And it can be done right.

This project was part of IronHack’s Bootcamp in UX/UI design. The duration was one week and it was an individual work.

It you liked this, you can follow my channel, where I will continue to publish projects and work that I do.
Other channels where I share thoughts and experience:
LinkedIn;
Tumblr;
Three Penny Paintings

Meet Conscious&Present

“If I had only one hour to save the world, I would spend 55 minutes to define the problem and 5 minutes finding the solution” Albert Einstein

This week’s task in IronHack’s UX/UI design Bootcamp was creating a Habit Tracking App. We had to follow habits that people may want to continue or stop doing. Here I will share with you the whole process of the one week work.

Let me take you in the process of creating an app from zero information to a working prototype with thoughtful user flow. In this case study, we will go through each step when starting a new UX/UI project:

1. Conducting a Survey
2. Conducting Interviews
3. Defining a Problem
4. Finding a Solution
5. Creating a Persona
6. Creating a Scenario
7. Creating a Sketch with ‘Crazy 8-s’
8. Creating a Wireframe
9. Creating a Prototype
10. Usability tests

Conducting a survey

In IronHack we are taught and constantly reminded that good design is strongly connected to good research, so here we will pay a big attention to that.

Surveys take a great part in UX design, as they can give us great data about our users and the problem that they may have. Another aspect is that the answers will define the questions you would later ask in the interviews.

Here is how this walk looks like if it was a building:

In my case, I had a specific goal — to better understand people’s habits by asking them general questions on healthy and rather bad habits that they have. I got 94 answers, 70, 6% of which were in the age between 26- 40 years old.

And we got this information:

What they would all define as a bad habit was their time spent online:

From this information, we got into two conclusions:

• We have to further ask questions about how people tend to spend their time on social media; and how do they take care of themselves.
• So far, we got a target group of people who live rather healthy (46% doing sports), but have issues with their social media channels ( 55 % claiming that they want to reduce their social media presence).

Conducting Interviews

Once we have that, we can start defining questions for our interviews. Many people who answered the survey would also give their contact, so we can reach them out for an interview. This is how we did it in this example, fully remote.

After 8 interviews, the most valuable information we got was those statements:

“Since you asked, I am not exactly sure how much time I spend on Facebook, but I assume it’s more than 2 hours, I have to check this out.’’

‘I have tried to deactivate my account, but I always get back. Sometimes when I go for a walk with my dog, I leave my phone at home, just not to use it. But I need my phone, that’s not a solution.”

“I want to have a balanced life. I live pretty healthily — I cook, I do sports, I take walks in nature, I even meditate with my husband. However, I feel like I spend too much time on social media.”

Defining the Problem

From the information that we got from the survey and the interviews,
we can now define the problem more specifically:

• A big percentage of people between the age of 26 and 40 live a physically active life and consider they have many good habits: they cook, do sports often, take walks in nature, communicate with people.
• However, though they consider communication as something healthy, a big percentage of them (51,2%) spend more than 2 hours daily on social media and 55% of them want to reduce it.
• They want to balance their life — but not by cutting completely their communication, but rather manage it better.

They enjoy the service of social media, but they want to balance it and give more space for their healthy habits.

Finding a Solution

To help people with this problem, we found we need to create a mobile app, called Conscious&Present.

The main function of this app is to:

⏱ Keep track and better manage the time people spend on social media online, without taking radical actions like deactivating their accounts.

⚖️ Let those people be more conscious about the balance in their life:
Set up a timer for healthy activities too.

💎 To further encourage them: for each goal achieved, they gain healthy provisions — like sports equipment, e-books, access to meditations, movies, etc.

Starting from a Sketch

With a defined problem and solution, we move to the next important step — creating a “Crazy 8's” sketch — UX/UI designers call this process brainstorming.

(If you don’t know what “Crazy 8’s” is, check this video: https://www.youtube.com/watch?v=UXOLJy0E7Pg)

On the paper sketch, we can define the main functions that we want to implement in the app.

At this stage we just mark up main sections places, nothing looks complete here. What is helpful from this step is that we can define the steps of the user flow.

In our case, the first brainstorming idea was that we need to give our users a good explanation at the start of the flow — to tell them how this app works and what it can give them in the simplest way possible — by swiping.

Defining The Persona

Let’s take a step back and move again to our user.

It would help us significantly if we create a Persona — 
defining the person who would use our app.

For Conscious&Present, this is how it will looks and feels like
(by the information that we have so far):

Tanya Hristova
🌐 Lives in Sofia, Bulgaria

Job: Yoga Teacher
Age: 29-years old

“I have implemented many healthy habits in my routine, but I still need to manage better my time in social media. It distracts me a lot.”

Income: Rather low

🌳 Tanya would take a walk in the park every day.
She likes to be outside and consider herself much more organized when she is not at home.

👤 She would use Facebook every day — to find information from pages that she follows and communicate with her friends.

🔎 However, sometimes she tends to spend more time there than she needs.

📌 She would like to set more time for reading and better organize her time when she is at home.

Scenario

Let’s put Tanya into a scenario:

Tanya has tried to deactivate her Facebook once. She didn’t use it for couple of months. However, she found that she collects important information from there and it keeps her in touch. So, she found that this was not the most effective solution.
She would like to manage her time in a balance to the activities that give health into to her life: walks, dancing, meditation, reading.

Conscious&Present: the App

Let’s take Tanya further and make her found an app called “Conscious&Present”:

1. Intro:

Here, she can see what the app provides: to record her online presence, make her focus and relax, get paid in Health Coins (the relaxing activities are paid ‘extra’).

2. Giving details:

She needs to synchronize her email to the app and give some permissions: phone app usage; location access, calendar events. This is very important in order for the app to function properly. It also gives some transparency and now Tanya knows how this whole app will work.

The agreement condition is that Consciuos&Present will respect her privacy and not give her data.

For the success of this step, she receives a welcome gift of 0.93 health coins. Now Tanya knows that this is the amount of money for approximately 2 hours of Facebook daily goal achieved.

3. Main Page — Social Media

Then, Tanya comes to the main page — where she has two sections ‘Social Media’ and ‘Relax’.

She also has timers for the different social media channels. Since it’s empty, she goes to “Start a new timer” and she can pick up media name. Then a small window opens and she can set the timer. When she reaches the time that she has chosen, the app will give her a reminder. If she stops using the media at that moment — she has reached the goal. However, if she continues to use it for more than 10 minutes after that, she won't receive coins for that goal.

She can also pick to add a plugin to her browser. This way she will know how much time she has left for reaching the goal when browsing.

4. Main Section — Relax

It is quite similar when she goes to the section “Relax”. However, since the phone cannot record whether Tanya has done ‘read’, it can’t give her coins for that activity. That’s why there are coins only for walking, jogging — something that can be tracked. The amount of coins value for walking and jogging is higher than for reaching a goal in social media though.

Still, Tanya can set a timer for reading, so she has a track of her day. And she will know the balance between her social media/relaxing activities.

5. Wallet and Shop

Then, the sweet part — Tanya can check her wallet. She can see her balance and the history of her activity in the wallet. She can also go to the section “Shop”, where she will find shops that accept the health currency. Those shops will be related to sports equipment, e-books, movies, etc.

Prototype

Then, we connect the Sketch wireframes in a prototype with Invision.

Having a prototype, we can start the next step — usability testing.

You can test the prototype yourself here (You don’t need to have a registration in Invision):

https://projects.invisionapp.com/share/RFWT5IW7U32?fbclid=IwAR0Hod40Vxz5_jqfZCtGyLzKlAPmP37JlwcX5BSjQglPYl7XVwRR5JwgP4Q#/screens/413037477

Usability Tests

Usability tests help designers improve what they have missed/ misinterpreted. Or something that the user doesn’t use, or confuse them.

We did 3 usability tests for Conscious&Present.

We found those ‘pain’ points in the interaction:

• The user was confused by the star illustrating the coin.
• There was some misplacement of a few screens.
• 1 user didn’t go to the ‘Relax’ section but liked the Social Media.
• The end of the flow was clear.

Possible Frustrations

In order to have a perfectly functioning app, we should take into consideration that further improvements and user tests will need to be done.
So far we found those possible frustrations that we will need to manage in time:

📌 Business point of view: the idea may be hard to be released.

📌 The section “Relax” may prove to be unuseful.

📌 The ‘Health Coins’ currency may be changed with another currency.

Conclusions

The Process of creating an app from zero to a usable prototype moves constantly from ideating to defining. If we want to create a product that may not only be pleasant and good looking but problem-solving, we should better turn off our ‘designer’ attitude and go more into the shoes of a researcher and a mediator between user’s needs and what the business may want to give to them as a good addictive product. This comes with surveys, interviews, sketching, usability tests and a big amount of empathy. :)

If you have found this article interesting, you can follow my channel where I will continue on posting helpful materials about UX/UI design through the school process of IronHack.
You can also follow me on LinkedIn, Tumblr.

Every UX/UI designer sooner or later is asked to do a redesign of an existing website or app. This may be the interface — with fonts, colors, images, but it can also be the user experience design — what is already missing or poorly done in the current user flow. For this process, we need to understand both the business and user goals, which come from research, analytics, and testing. I will show you how I did that with a Case study on the mobile app Skyscanner.

Heuristic Evaluation with Nielsen’s Principles

First of all, we have to consider certain propositions that we will use in the overall analyzing process. Nielsen Takob’s principles were introduced in the ’90s, but they still super functional. The world’s most successful companies like Apple, Adobe and Google have used them. So, let’s list them:

Visibility of system status

Match between system and the real world

User control and freedom

Consistency and standards

Error prevention

Recognition rather than recall

Flexibility and efficiency of use

Aesthetic and minimalist design

Help users recognize, diagnose and recover from errors

Help and documentation

Using these principles will help us identify usability and utility problems in the overall experience.

The Case Study

The Case

In 2017, the world voted for the seven wonders of the new millennium. More and more people attempt to travel to far destinations for a long time — to explore beauty and magic in the world. Proper planning makes all the difference between a carefree, lucky-go-happy journey and a stressful, hurry trip.

Therefore, now we have a huge variety of trip planners and marketplace generators for online flight bookings. How they deal with the user experience of a certain group is crucial for their success.

For this case study, we will follow these steps:

Firstly, we will identify a preferable target group — by age, time to plan, price-cautiousness, preferable accommodation and experience. Then, we are going to put in comparison 3 big apps and find what makes them different and preferable for that certain auditory. With this selected, we will conduct interviews, testing and analyze the user experience, finding out how we can improve it with a brief redesign.

User Target: Worldtrotter, Backpacker — 18–38 y/o

Our group of people is mainly by millennials, who dreamt to visit at least one of the seven wonders of the world. They are price-cautious and prefer experience where they will meet strangers who will turn into friends. They are not picky — the only preference is the most affordable, adventurous, genuine experience.

Research

Ivasha Hristova (Bulgaria), 21, has just dropped out of her actress’s career and wants to go on a long trip to South America for 2 months and a half. She will visit Chile, Peru, Brazil, and Colombia. For this purpose, she worked and saved money for the whole trip. Still, she has to be money cautious.

Her total budget is 4000$, 1500$ of it is for flight tickets.

She has accommodation with friends in each country, so she doesn’t need to bother about booking and renting a bed.

Her starting point is Sofia and she flies to Barcelona, where she takes a flight to Santiago, Chile.

Benchmarking

In benchmarking we compare business processes and performance metrics to industry bests and best practices from other companies. In this case, we need to compare the mobile versions of 3 apps and choose only one among them that proves to be the most appropriate for our user type.

We have Skyscanner, Trip Advisor, and Hopper. Dimensions typically measured are quality, time and cost.

From this information, we can see that Skyscanner is the most suitable app for our user type: young, adventurous, price-cautious traveler. Since we need only flights from the app, TripAdvisor can be heavier, with all its products. Booking time is best with Hopper, but Skyscanner is not much slower than it. And the most important — the price. Hopper is much more expensive than both Skyscanner and TripAdvisor.

Test 1: Costs

It’s time to test the mobile version of Skyscanner. Here is where we start finding out what is missing, or not done according to the Heuristic Evaluation that we set for this case study.

Skyscanner
We already have some information about Skyscanner, but how does it work?

The main actions that users can attempt in the app are:

find flights, hotels, car rentals; choose a destination; choose dates; choose a flight; get price alerts and sort a filter.

However, on the 3-rd screen, where we choose ‘When do you want to go?’ we find the first flaw — we can choose a date, but we have no idea what the price would be. The user has to click each date to check all of them.

*While I was doing this research the app underwent changes, and this page was redesigned with price signifiers:

Insight 1: Costs

There is still a place for more improvements — for example, you can actually see the exact prices near the dates that you have chosen. We can take this example from Wizzair, where the client is highly conscious of the price.

By swiping to the right/left, you can check the prices for close dates. So, let’s insert the option ‘Show me best deals near these dates’

This will give some visibility, user control, and consistency.

Test 2: Check-in

There was one more issue that we found while testing the platform and it was connected to the most horrifying step of booking — the check-in.

Once you book the ticket, you receive an email with a boarding card from Skyscanner, but this is not enough as you still have to check-in.

When you go again to the app, you don’t have this option with Skyscanner.

You have to go to the official website of the company that provides the flight service. This can be complicated because you may not have a registration with the service company. And you have to search for your ticket by the ticket number.

From our testing, we found that this process can be quite stressful and not completely clear. Especially if you are out of access to a computer.

Insight 2: Check-in

Clients would love to be able to do the whole process in the app they booked their ticket. This, however, will change the general functions of Skyscanner.

Therefore, we can actually insert a middle case, where we add only one page for а check-in button, that sends you to the official webpage that provides your flight. There’s already an option of seeing your upcoming flights. So, this is where we will add the button for checking-in: Trips -> Upcoming ->Take me to Check-In

When you click on that ‘Take me to check-in’ button, you will have to confirm your information (like logging in) with the passenger’s surname and the code from your boarding card that you received on your email.

We saw that the travel companies provide that service, so this will make the transfer from Skyscanner to them smoother.

There will be a helping link with ‘what is the booking code?’, that will explain to you how to find it when in doubt.

Here is the wireframe solution to this, that I did with Figma:

This still needs improvements — the best-case scenario would be if you could do the whole check-in process in Skyscanner. However, synchronizing between the different travel companies is still difficult and will change the goals of the company.

This improvement, however, will help users to be sure that they did the procedure right, they have booked their flight and have the feeling of flow — instead of wondering where they are supposed to go.

With the ten Heuristic Evaluations in mind, the benefits of this redesign are in help and documentation,
visibility of system status, the match between system and the real world.

Outcomes

When we have to do a redesign to an app or website, firstly, we have to target the principles that we want to reach. They can be our guideline when we do research, analyze, test, or look for a solution. We should also mind that we are not the user, that’s why testing with people is essential. And last, but not least — do not miss the wireframes. They can give you great feedback on how your solutions actually look and feel like, whether your job was well done.

This Case study is part of IronHack’s UX/UI design boot camp pre-work.

Taking out the skeleton of the most popular video platform

Wireframes are an essential part of UI and UX design. No matter if you have experience in this field or not — seeing that intellect behind the apps by just simplifying the interface can be thrilling.

To show you how this UI reverse engineering works, I am going to take a giant like YouTube. According to surveys, the platform is an absolute rank winner for most estimated monthly visitors — approximately 1,000,000,000 (Fabruary, 2020). And not surprisingly, there are many updates now and then, that we barely recognize. And we do not recognize them because they are done well — like an invisible hand by a friend.

So, let’s take a look at how YouTube was first thought, without the wide variety of user-generated and corporate media videos. And without its brand red color.

Tools

To dissect the YouTube app I will create mid-fi wireframes with Sketch and then put the prototype in Invision. These two apps work perfectly together — in Sketch, you can create the interface outlook and then connect the wireframes to interact as a prototype in Invision. But before that, I will use my favorite paper and pen — the cheapest and fastest designing tools for a lo-fi sketch. This will help me sufficiently in the process.

User Flow

We are going to focus only on one user flow, this will cover up 5 screens.

A couple of days ago I noticed that the mobile version of Youtube has an upgraded feature that is on the pilot opening page — tag navigation, by a search that you recently opened.

Then, by using this search suggestion, we gonna save a video in a playlist. Something that is super useful to me and I do almost every day. And one of the reasons why I go back to YouTube so often.

Lo-fi Sketch (Paper and Pen)

With the help of paper and pen, I can start scratching my lo-fi prototypes. I am taking a look at the screens that I made and notice what kind of UI elements I have there — icons, buttons, text box, titles, navigation, accordion, sliders, tags. Our user flow starts from the tag navigation on the top and goes to the user’s library.

Mid-fi Prototypes (Sketch)

Then comes the fun part — creating a wireframe with Sketch. I would highly recommend using a wireframe kit — with ready interface elements that you often use, like text box, icons, navigations, hamburger, etc.

They should be strictly black and white and focus on the big layer, not the details.

So, this is how YouTube’s user flow looks like in a mid-fi wireframe:

Test it!

Wireframes are perfect for testing by clients and users. They give cheap, fast and easy feedback that can significantly help designers understand their audience. Thanks to the relationship between Sketch and Invision, you can now try out this YouTube wireframe from here: https://invis.io/D2WB829Y8J5
(you don’t need to register)

Outcomes

Dissecting apps and websites into wireframes is an intriguing process and can give you great knowledge about different user flows — where they start and end, what interface elements are needed and how easy is it to navigate them, or what makes them functional and great. And you may even notice that people love great apps from the inside. 😊

This was an exercise for IronHack’s student pre-work in UI/UX Design Bootcamp.

About Citymapper

Citymapper is a transport app that provides directions for a chosen distance. Like its competitors — Goole Map, Apple Map, Moovit, etc — it gives you the most ultimate ways of reaching your goal: by a car, walking, public transport, bike. It gives you the exact time when your bus/metro/train will come, what time is the next one, how much you have to walk from a station to station. There is even a calculation of how many calories you are burning by walking or biking!

The Problem

However, after interviews with people that use public transport in different countries, there’s a common problem that each one faces — they cannot buy their tickets from the apps. In some cities like Plovdiv (in Bulgaria), this can be the biggest improvement for public transport, as now there are no alternatives for buying tickets.

Another main problem is the wandering for buying tickets. If you have to change lines — a bus, metro, train, no app provides the service of buying one whole ticket for the whole line. Instead, you have to switch different websites if you want to buy your e-tickets (if possible at all).

And nonetheless, who needs a paper ticket in his pocket, when you have your phone there and it can help that?

Human Stories

Nikol Vetin, 25, is a student that lives between two cities in Bulgaria — Plovdiv, where she works, and Sofia, where she studies Cinematography. To go to her University, she needs to take a metro and then a bus. A monthly card is not worth for her. So, she buys tickets. The problem is that

not each stop has a ticket machine, and very often she has to ask the driver to charge her.

Her solution is to buy a daily transport card — which is also the cheapest way. But the problem, again, is buying it. Only the main city stations have pavilions that provide that service.

This whole process is even more old-school in her hometown, Plovdiv.
The only way she can buy a ticket there is to wait for a conductor inside the bus, who walks among the people and taxes them by hand.

There is no ultimate way of being charged in the whole town, where the population is almost 670 000 (Eurostat, 2018).

Nikol admits that it is not uncomfortable for her, but the process is far too old-school:

Students and retirees have to buy their cards each month and there are only two places in the whole city that provide this service.

There was a project for vending machines but in the end, it didn’t work.

Deyan Stoychev, 28, lives in Auckland, New Zealand and works as a Research Assistant at the University of Auckland. He would always use the bus and does not need to buy a ticket, as he is provided with a free local transport card. Anyway, for his current job he needs to travel abroad and sometimes he spends a whole day changing transports in different countries.

None of the apps that he is using, provides e-tickets.

He uses Google Maps and some offline maps, but none of them works with buying tickets. Most of the places he visits have vending machines and paying is not that hard, but when he has to do this several times per day, changing languages, it can be exhausting.

Solutions

Public transport is connected to local urban planning, and this makes it more difficult for apps to connect to the budget. But what should be considered, is that the process of buying a ticket should be as easy as breathing because it’s what everybody uses — from students to retirees, tourists, people with disabilities, etc.

E-ticket is easy, fast, eco-friendly and definitely will bring air in public transport.

A feature that gives you the chance of buying a whole destination ticket (even when changing lines) can be added to the current platform of Citymapper. The best thing is that you won’t switch different apps to collect all of your tickets or buy them from the driver anymore. It will all be in one place, from one single app.

It will not even change the current design. The ticket feature will only expand it.

When you go to the ‘Buy a ticket’ button, it will lead you to a new page, where my prototypes start.

Prototypes

1. There, you would be able to de/select a ticket (if it’s more than one);

2. Тhen you choose a Discount type — Student, Retired, Disabled. It will not ask you for a document in this stage, because this would be really hard to be set up in all different town’s policies. Instead, you can select a discount, and your ticket would be saying that you use this discount. When you are being checked by a conductor, you would have to provide the document for your discount.

3. Then, you have Ticket cost, Discount amount, Total cost, and now you can proceed to payment.

Payment Methods
Usually, a ticket is a sum of less than 5 euro, so it sounds more convenient for users to build a container of money that they can use when buying a single ticket. It will be called My Pocket, and you will be able to charge it with Visa/Mastercard; PayPal; G-Pay.

My Pocket would stay in the menu section, but if you proceed to payment and there is no money there, the app will lead you to charge your pocket.

After charging your pocket, the app will lead you to the facture for payment, from the tickets that you have already selected.

My Tickets
Then, when you see the green confirmation of buying a ticket, you can go to see your tickets.

They will stay in the Menu. When you go to My Tickets, you will have three sections: My Tickets, Active Tickets, History of Tickets. And you will have an option ‘Buy a Ticket’, that will lead you again to choose a destination.

In My Tickets, you will keep your bought tickets. When you go to the bus, you have to check the barcode of your ticket, and when this is done, it becomes an Active Ticket.

When you reach the destination, there you will have a confirmation button. When you confirm it, the ticket goes to Old Tickets. If you don’t confirm it 30 minutes after the destination was reached, the ticket will go automatically to Old Tickets.

And in the end, the app will ask you for your opinion. When you rate it, there will be a button ‘Get me to another destination’, so you can still stay in the app.

Nikol said that she would enjoy if the app suggests some places around her destination — like coffee houses, bakeries, museums, shops, etc. I think this can be a good expansion for another experience.

Outcomes

This UX case shows that real-life stories are the main source of information that a designer should consider when planning an experience.

The design of a single app feature may be connected to whole urban planning — and it can transform the environment that we live in.

And last, but not least (this is addressed to me): don’t make a big deal of prototypes, just do them.