Design

Desktop or Phone: Infuriating Differences in Popular Services' Features

Desktop or Phone: Infuriating Differences in Popular Services' Features

Try 4 top design professions. Free ➞ In 5 days, you'll get acquainted with illustration, UX/UI, web, and graphic design. Add 4 amazing case studies to your portfolio and decide which direction to take next.

Learn more

Design teams of major brands sometimes make unexpected decisions. They remove important features from mobile versions of websites, while adding nonessential elements to desktop versions, and vice versa. This behavior can negatively impact user experience and lead to decreased engagement. It's important to find a balance between functionality and usability to meet user needs across all devices.

Sometimes there really is a logic to simplifying features. For example, Zoom users may find it inconvenient to draw on a whiteboard from a mobile device, so adding this feature to the mobile version seems unnecessary. However, this is often due to development errors. Let's analyze the desktop and mobile versions of popular services to identify the most annoying aspects.

Yandex Music

The mobile apps and desktop versions use different icons. Icons in the interface help users perceive information more quickly. For example, if you like a song, clicking the heart adds it to your favorites. Effective use of icons improves the user experience and makes interaction with the app more intuitive.

Yandex Music has implemented new creative features, thanks to which the heart in the mobile app has become a symbol not only for likes, but also for other useful features. Now users can use it for the "Shelf" function and for subscribing to podcasts. This requires a more careful approach to the interface, since icons cannot always clearly convey the essence of the actions.

In the mobile application. By the way, I still haven't found the "Add to queue" option on the desktop. Screenshot: "Yandex Music" / Skillbox Media
Also in the mobile app. Screenshot: "Yandex Music" / Skillbox Media
On the desktopScreenshot: "Yandex Music" / Skillbox Media

Differences in design versions usually arise when different teams are working on a project, each with their own idea of ​​​​the user experience. This can lead to inconsistencies in the final product and make it difficult to create a unified and consistent interface. To avoid such situations, it's important to establish effective communication between teams and set clear design standards to ensure consistency and a high-quality user experience.

To improve user experience, it's necessary to standardize icons for both the desktop and mobile versions. This will ensure a consistent interface and allow users to quickly navigate the application. It's also important to develop unique icons for different options to make interactions intuitive and speed up the process. This approach will not only improve convenience but also make interaction with the product more efficient.

Telegram

Circle recording is not available in the desktop version. The mobile version allows you to quickly create circles, which significantly saves time and diversifies your channel content. However, this feature is not supported in the Windows desktop version and the web version, which limits user capabilities.

This can only be done in the mobile app. Screenshot: Skillbox Media

Telegram decided that the video calling feature on the desktop version is not in demand among users. But why is that? Many PC users have cameras that can be used for video calls. This may be due to the fact that text messaging and voice calls are more common on computers. It's also worth considering that using video calls on a desktop may be less convenient than on mobile devices. However, for some users, the ability to make video calls on a computer would be useful.

Ozon

After visiting a marketplace, one word comes to mind: noise. This noise includes both physical sounds and the myriad of information that surrounds shoppers. A multitude of products, varying prices, and active advertising create an atmosphere in which it's easy to get lost. On marketplaces, it's important to be able to navigate to find what you need and avoid unnecessary chaos. Noise is not only an audio component but also a constant competition for the user's attention. Therefore, it's important not only to understand how marketplaces function but also to understand their mechanisms in order to effectively find the right offers and find great deals.

The labels are red, green, blue, orange — in short, eye-catching. Screenshot: Ozon / Skillbox Media
On the desktopScreenshot: Ozon / Skillbox Media

On the website, product images look more harmonious, as large photos break up the bright labels. However, this does not completely eliminate the perception problem. The implementation of general requirements for product images could significantly improve the situation. For example, Yandex Market provides similar information, but does so in a more calm and aesthetically pleasing format. Optimizing the visual content on your website can make it more appealing and improve user experience.

Like Yandex Market - white background everywhere. Screenshot: Ozon / Skillbox Media

Different shopping cart icons in online stores can cause confusion among users. Some product pages feature two add-to-cart buttons: one offering delivery in 30 minutes, the other for today. While this approach may seem counterintuitive, it's worth paying attention to the cart icons used in the mobile app and website. Different icon designs can impact perception and usability, which ultimately impacts user experience and conversion. Optimizing your cart icons for different platforms can improve navigation and increase customer satisfaction.

On desktop Screenshot: Ozon / Skillbox Media
In the mobile appScreenshot: Ozon / Skillbox Media

The search in the mobile version of the interface is overloaded. In the mobile app, it is located in the top panel, where there are already many indicators and the delivery address. This creates a feeling of crampedness and visual noise, which negatively affects the usability of this element, which is used frequently. Optimizing search in the mobile version can significantly improve user experience, making it more intuitive and accessible.

In the mobile appScreenshot: Ozon / Skillbox Media

When analyzing the desktop version of the page with the blur effect, you can see that the search bar attracts the most attention of users. This highlights the importance of optimizing the visibility of search-related elements to improve user experience and increase conversions. Search bar optimization can include aspects such as its size, color, contrast, and location on the page, which in turn can help increase clicks and improve the site's indexing in search engines.

On the desktop Screenshot: Ozon / Skillbox Media

To improve the text, you need to Focus on its structure and keywords for SEO. Here are some recommendations:

1. Optimize headings and subheadings by adding keywords.
2. Use short and informative paragraphs.
3. Include internal and external links to increase authority.
4. Add meta tags for description and keywords.
5. Make sure the text is easy to read and contains useful information for users.

Don't forget about the importance of content uniqueness, as it affects search visibility. Update information regularly to keep it relevant and in line with the latest trends and user requests.

  • First of all, get rid of two buttons, one of which is also red. They wanted to remove one step in the purchase process, but they confused things even more. It's better to leave one button - "Add to cart" - and offer delivery options there.
  • Standardize the icons. Users spend a lot of time in online stores, so icons reduce cognitive load and eliminate the need to read navigation elements. You can make the search bar on the mobile version easier by moving the airplane icon (ticket sales) and the chat icon, and by moving the search bar lower—closer to the middle, like in Eapteka. Or put it at the bottom of the screen to make it easier to reach with your finger.
In the Eapteka mobile app, searching seems simplified, although, like in Ozon, space is taken up by voice search and barcode scanning. Screenshot: Eapteka / Skillbox Media

LitRes

As a true book lover, I've noticed that searching for literature in the mobile app and on the desktop version of LitRes is a different experience. I often encounter a situation where I can't find a book in the mobile version, even though it's available on the website. This creates certain difficulties, and perhaps there's some unknown reason behind it. It's important to optimize book searches in both formats so that users can easily find the literature they need, regardless of the device they're using.

We continue analyzing the app. The unusual combination of available currencies is striking. Where's the ruble? It's worth noting that this issue doesn't occur on the desktop version of this app. Perhaps you should consider updating the app or its settings to address this issue.

In the mobile appScreenshot: "LitRes" / Skillbox Media

There is no text in audio format. I can take a break from reading and switch to the audio version in the mobile app. However, this feature is not available on the desktop version, so please read the text yourself.

In the mobile app Screenshot: "LitRes" / Skillbox Media
On the desktop. The book is the same, but there is no icon with the option to listen to the book. Screenshot: "LitRes" / Skillbox Media

To improve user experience, it is necessary to add the voice-over icon to the desktop version of the site, which will increase the accessibility of content for people with disabilities. In addition, it is important to unify the icons for bookmarks, since they currently differ in the mobile and desktop versions. This will lead to a more consistent user experience and improve navigation for all users.

Stepik

This is an educational platform that allows users to create their own online courses. On this platform, anyone can easily develop and publish a course, sharing their knowledge and experience with others. The platform provides all the necessary tools for creating high-quality educational content, including the ability to add videos, quizzes, and interactive elements, making the learning process more engaging and effective.

Now you can study not only at your desk, but also on the couch with your phone in hand. It's convenient and comfortable. However, don't relax. On the Stepik platform, it will be necessary to return to a more traditional training format, since the video player in the mobile app does not adapt to the screen size.

On the desktop Screenshot: Stepik / Skillbox Media
In the mobile applicationScreenshot: Stepik / Skillbox Media

To optimize the player's embed code and ensure that the video displays correctly on the screen without scrolling, some settings need to be made. Proper configuration can improve the user experience, especially for educational applications where the main focus is on viewing lectures on mobile devices.

To ensure the video takes up the entire available screen space, set the width and height of the embed code to 100%. This will prevent scroll bars from appearing and ensure a comfortable viewing experience. Also, consider responsive design to ensure the video displays correctly on screens of various sizes.

It is also important to check the player's compatibility with mobile platforms and use HTML5, which will ensure stable operation on most devices. Effective player embed code configuration will not only improve the video's perception but also increase user engagement in the learning process.

Zoom

Today, we increasingly conduct meetings directly from our smartphones. However, many users are faced with the problem of the lack of a recording function in the mobile versions of video conferencing applications. This causes dissatisfaction, since the ability to record meetings is an important feature for preserving information and further analysis. Why don't developers include this option in mobile applications? This may be due to data storage limitations or technical difficulties. It is important that developers pay attention to the needs of users and add the recording function to mobile versions to improve the quality and convenience of meetings.

On the desktop Screenshot: Zoom / Skillbox Media
In the mobile appScreenshot: Zoom / Skillbox Media

Chat settings are hidden in the mobile version. Let's consider an analogy. A pedestrian crossing sign is always located next to the crossing itself. This rule ensures correct perception. If the sign is on another street, it refers to a different crossing. Objects located close to each other are perceived as a single whole, which simplifies understanding of information and allows users to quickly navigate in space. Proper placement of interface elements, like road signs, plays a key role in improving the user experience.

Chat settings in the Zoom mobile app are difficult to find, as they are located on the third navigation level. This creates inconvenience for users, especially during meetings when quick access to chat features is essential. Simplifying access to chat settings in the mobile app would significantly improve the user experience and make interaction more efficient.

In the mobile app Screenshot: Zoom / Skillbox Media

Everything works correctly in the desktop version: chat and settings are available.

On the desktopScreenshot: Zoom / Skillbox Media

To improve work efficiency, you can place settings next to the functionality or integrate them directly into the function itself. This will save time and reduce the cognitive load on users, and prevent distractions from the current meeting.

HeadHunter

The mobile app includes a feature that allows you to see the number of responses to a job posting. This surprising feature is not available in the desktop version, making the mobile app more convenient for users who want to quickly track interest in their ads. Using a mobile app to monitor job postings ensures a faster and more efficient candidate search process.

In the mobile app Screenshot: HeadHunter / Skillbox Media
On the desktopScreenshot: HeadHunter / Skillbox Media

To improve the functionality of the desktop version, it is worth considering the possibility of adding a secret option. This will allow users to get new opportunities and improve their experience with the application. The introduction of such a function will not only increase interest in the product but also create a sense of exclusivity. Given the growing competition in the market, introducing unique features can be a decisive factor in attracting and retaining users.

Lamoda

Photo search is available exclusively in the mobile version of the Lamoda online store. The site's minimalist design attracts users with its clean style. The absence of bright colors, subtle lines, and a simple interface allow for comfortable clothing selection without eye strain. The unique function of searching for clothes by photo makes shopping even more convenient, although, unfortunately, it is only available in the mobile application.

In the mobile applicationScreenshot: Lamoda / Skillbox Media

Only the standard search is available in the desktop version, which, of course, limits the user experience. Improving the search functionality on the desktop platform could significantly increase usability and customer satisfaction.

On the desktopScreenshot: Lamoda / Skillbox Media

To improve the user experience on the desktop version of the Lamoda website, you can consider adding a search function by photo. While this feature may not have been prioritized, its convenience and versatility make it highly sought after. Image search allows users to quickly find the products they need, thereby enhancing navigation and increasing the likelihood of making a purchase. Implementing this feature can significantly improve website interaction and meet the needs of a wide audience.

Finally

Large online services regularly test their solutions on users, and they do so repeatedly, using an iterative approach. Therefore, my observations are likely not random errors, and the companies have justifications for each of the points noted. However, there is always a possibility that some aspects may have been overlooked.

Learn more about design by subscribing to our Telegram channel. We share interesting ideas, new trends, and relevant tips to help you in the world of design. Join the community to stay up-to-date with important updates and inspiration for your projects.

Materials on interface design are an essential resource for UX/UI professionals. These materials cover a wide range of topics, including design principles, best practices, and current design trends. Studying various aspects of interface design helps create solutions that are intuitive and engaging for users. It is important to keep up with new approaches and tools to stay competitive in this dynamic field. We recommend that you familiarize yourself with various sources that offer useful tips and examples of successful projects to improve your skills and knowledge in interface design.

  • "Interface": Fundamentals of Designing User-Friendly Systems
  • 8 Interface Design Mistakes That Annoy Users
  • Interface Design: 8 Principles Every UX Designer Should Know
  • Logical Errors in Interfaces
  • "A Mental Hospital is in the Hands of its Inmates." How to design interfaces correctly

Profession Graphic Designer PRO

You will learn how to create corporate identity elements and graphics for business. You will put together a portfolio that reflects your style and confirms your skills as a designer. You can start a career in a studio or as a freelancer.

Find out more