Mobile Development: Make Better Apps With UX Research

For one of our biggest clients, Polish publishing-house Agora S.A., we have researched, redesigned and redeveloped three mobile apps for iOS and Android in just six months.

To deliver the best user experience possible, we teamed up with UX researchers and designers from Cogision, recognized research agency with over five years of experience.

Together we designed and developed apps that people actually like to use.

Here’s what we did in a nutshell:

  • User Experience Research – we wanted to make sure that what we make is actually what people wanted.
  • Design – we were responsible for delivering stunning, though easy to read design of the apps.
  • Mobile development – we developed three apps, for titles such as Ładny Dom, Świat Motocykli and Logo24, all of them available on Google Play and Apple App Store.
  • All apps were well-received, getting five-star reviews on app stores.

We took the best elements from apps we already knew and used before, we developed an MVP containing what we thought is important and nice-to-have in such application and asked beta users to test it.

Read on to find out how we made it step-by-step, including UX research, design and mobile app development.

 

Start Listening To Your Users Using UX Research

To better understand what we’re about to create, we used UX research.

The best solution, although not the most common one, is to have UX designers hired in your company or to hire them specifically to the project, e.g. as freelancers.

In Whalla Labs we’ve teamed up with great, experienced UX researchers and designers from Cogision, research agency with over 5 years of experience and clients such as IKEA, Amica (bought by Samsung) or Play in their portfolio.

Their insights and work helped our designers and mobile developers to better understand what users really want to use in the news application.

process graph

This is how the whole process looked like:

  1. We have conducted workshops with our client to better understand his challenges and expectations.
  2. We have built a prototype of the app, so we have something to test our ideas on.
  3. We have asked beta users to interact with the prototype to get feedback on its features.
  4. We have changed the prototype accordingly and developed complete apps.

In the next part of this case study I have covered the whole process step-by-step, revealing more details on mobile app research, design, and development.

 

Start With Your Client’s Challenges And Expectations

First of all, it is essential to better understand client’s challenges and expectations.

Prior to app development, conducting workshops with your client will help both of you to understand each other, exchange ideas and discuss possible solutions.

When guys from Agora came to us, we only knew that they want to build mobile apps for their online magazines, to create better user experience for their mobile readers.

At this point we could have copied apps like Feedly, BuzzFeed or Flipboard, but we wanted to dig into it and find out what our client and their readers really want.

 

Conduct Workshops With Your Client

The first thing we did was inviting our clients for a kick-off research. During eight-hours-long workshops we were able to:

  1. Define project’s goals
  2. Evaluate possible solutions
  3. Create personas of apps’ users
  4. Suggests values
  5. Map out social reading trends
  6. Understand how journalists are working

By doing all this we could figure out what kind of content is popular vs what kind of content should be displayed on new apps, what kind of interactions are desired and which other features to include.

We have compared five online magazines to map out values that each-one delivers and asked our client to point those he views as the most important.

value proposition

By comparing those five examples, we chose four key elements we wanted to include in Agora’s new mobile apps:

  • Easy access to the content
  • Commenting
  • Sharing
  • Diversity of content

Amongst other things we’ve learned through the workshops, we gathered enough knowledge to build the first prototype of mobile application.

 

Build A Prototype Of Your App

Having all those informations we’ve gathered during workshops, we were able to build a prototype of an app and include all those features we’ve discussed with our client.

At this point design doesn’t matter, so we focused directly on user experience and implementing key features discovered in kick-off phase.

prototype screens

1. Different personas and users’ needs

We’ve discovered a couple of personas, that we addressed to Agora’s readers.

To allow each-one of them find content that would suit their needs, we have designed onboarding screen with available categories.

This simple feature allows users to customize the news app, to display only the content they are interested about.

 

2. Content categorization

Based on kick-off research we’ve been testing two types of news app: magazine app and aggregate app.

In the first approach, user could choose from all online magazines published by Agora using just one mobile application.

Magazine app, on the other hand, defined categories like interior design, architecture, gadgets, motorization or health, accordingly to the chosen magazine.

 

3. Accessibility of content

Probably one of the most important thing to bare in mind while developing a news app is the accessibility of content.

Users want to get access to their favourite article fast, especially while on-the-go. That’s why we’ve made sure to make discovering, bookmarking and sharing articles as easy as possible.

 

Collect Feedback From Beta Users

As I’ve mentioned at the beginning of this article, after we made a prototype of the app, we asked beta users to test it.

In order to do this, we’ve invited eight people to our office, so we could record how they interact with an app.

 

We’ve been asking them questions about every step they took, why they did it and what they would like it to be.

Invited beta users matched personas we have came up with during our workshops with the client, so we could confront their expectations with real-life human behaviour.

Based on the feedback we’ve gathered from our beta users, we could make several changes to the prototype.

 

1. Users spend a lot of time reading news on mobile

Users who read news on mobile are doing it very often during the day, reading small pieces when they have a break.

It all sums up to quite a lot of time.

Therefore articles should be short, so the reader can read them, e. g. during a lunchbreak at work. User should also have a possibility to easily open the last read article in the place he left it.

 

2. Users like to save articles

Very often users want to just to check up current articles and save those they like to read them later.

Allowing users to bookmark or save their article and to create an easy to reach out to place in app to find all of them is, therefore, important part of a news app.

The faster and easier it is, the better.

 

3. Users consume many types of content

Mobile readers like to read many types of content, using a couple of apps at the same time. They often use them one by one, to read all of the content they like.

In our app, we have included access to many types of content, such as local news, long-form articles, quizzes, and also interactive content like videos.

 

4. Users share content in person rather than publicly

An interesting observation we made during our sessions with beta users was that they prefer sharing content with other users directly rather than publicly.

They more often send a link to the article to a friend, than post it e. g. on Facebook wall.

So as we did include public sharing option, using popular social media channels, we also offered possibility to share articles and videos with friends via direct link.

 

Complete App Development

agora android

Having all of this information in place, such as clients expectations and needs, user research and beta users’ feedback, we could have start with mobile app development.

Finally, we have developed mobile apps for three online magazines, on both iOS and Android.

All apps were designed by our team, aiming to create a beautiful user interface with smooth animations, that won’t distract user from reading content.

Based on user research, we developed Świat Motocykli and Logo24 applications as independent titles, while Ładny Dom is an app that aggregates the content from many Agora’s titles concerning home and garden decoration, architecture and maintenance.

 

Feed and navigation

The main core of application is the feed with articles’ pictures and short descriptions. They allow user to easily navigate through the latest articles, with possibility to bookmark those, who he or she would like to read later.

We made scrolling through feed even more attractive, using simple animation while loading new pictures and articles.

The navigation is the same in all apps and is based on hamburger menu. Here the user can find categories, bookmarked articles and more. He can also swipe right or left to change the category.

 

Bookmarking and offline mode

As mentioned before, user can easily bookmark articles right on feed or directly in the article. It allows user to read articles later, when they have a time to do so. It was one of the most important feedback we’ve received from our beta users and we tried to make it as intuitive as we could.

Another important feature is the possibility to read bookmarked article while in the offline mode. We understand that users may not have a permanent access to the mobile internet, so we provided them with the possibility to read their articles at any time and place.

 

Users’ and client’s feedback

Each application is available to download via Google Play Store and Apple App Store, receiving good reviews and comments from users.

mobile app review

Moreover, our development skills and communication throughout the process got credit from our client, resulting in positive references and client’s satisfaction.

clients review

 

Conclusion

In this case study I’ve focused mostly on user research, which as we believe played a major part in developing vell-received, accessible, clean news application that mobile readers really want to use.

For more information on our development process and full services description, please check out our website.

To sum up, this is how we helped Agora S. A. to redesign and redevelop their mobile news application:

  1. We have conducted workshops with the client, including kick-off research, where we asked stakeholders about their goals, needs and expectations to better understand what we’re about to create.
  2. We have built a prototype of an app that we could test with beta users.
  3. We have invited beta users to our office to record how they interact with the prototype of an app and listen to their feedback.
  4. We have analyzed and compared this feedback with clients needs we have discovered in the first place to build a complete mobile product.

As you can see, we wanted to check everything to make sure that we won’t waste time on developing something that doesn’t meet our client’s expectations and doesn’t solve users problems and needs.

The effect: mobile apps that users like and use for their mobile reading.

And, of course, satisfied client.

 

P. S. Looking for mobile app developers to deliver your mobile product? We have over four years of experience in software development for mobile, web & wearables.

mobile development