About the project
The goal was to improve the visual presentation and functionality of photo displays on ad pages in order to enhance user engagement and overall experience.
Define the problem
I noticed some difficulties users experienced when viewing photos on ad pages during User Interviews and using Yandex Metrica Webvisor. This analysis revealed several key issues:
Complexity of scrolling photos: Users could only scroll in one direction, which made navigation less convenient.
Lack of zoom functionality: Users wanted the ability to zoom in and out to explore vehicle details more closely.
Trouble exiting the photo view: Users encountered difficulties when trying to exit the photo viewing mode, leading to frustration.
Set the hypothesis
Implementing improved photo navigation features and zoom will enhance user interaction with the photo gallery. These updates are expected to increase user engagement and result in higher request rates.
Research & discovery
Through Competitor analysis, I have identified that our competitors offer easy navigation features and effective zoom functionality in their photo galleries, creating a seamless user experience. Based on this insight, I have determined several key areas where we can improve our own offering.
These improvements include adding a scroll bar for quick photo navigation, looped photos for continuous replay, and hover zoom functionality on desktop to allow users to explore details more thoroughly. Photos typically open in full-screen mode, with desktop users able to scroll using the keyboard or exit full-screen by pressing the ESC key. Additionally, I recognize the need for a button that enables users to request more photos.
Competitors have also implemented a block containing price, main information, and contact details to facilitate faster communication with sellers. On the desktop, photos are displayed in vertical orientation, while on mobile devices, they are presented horizontally, matching typical scrolling behavior. Moreover, I identified the value in implementing 3D functionality to create a more immersive experience, as well as a "Similar Images" button to help users find related content. I also noticed an ID on each photo and two new buttons in fullscreen mode: "Favourite" to save photos and "Report" to report any content issues.
Brainstorm and analyze ideas
After analyzing user behavior and conducting competitor research, we brainstormed several insights gained from the analysis to improve the photo display experience on our ad pages. We aimed to create a more intuitive and user-friendly experience across both desktop and mobile platforms.
Scrollbar: An added scrollbar allows for convenient and quick scrolling through the photos.
Photo is looped: The photo is looped to continuously replay, keeping users engaged.
Hover on photo (desktop): When you hover over the photo, it offers a zoom feature that responds. Scroll arrows and a magnifying glass have been added to facilitate navigation.
Open selecting photo: Selecting a photo opens it in full-screen mode, providing a more immersive viewing experience.
Button "Ask for all available pictures": At the end of the gallery, there is a button that allows you to request additional photos.
Scrolled using the keyboard (desktop): Users can scroll through the photos using the keyboard in full-screen mode on desktop.
ESC (desktop): Exiting full-screen mode can be accomplished by pressing the ESC key.
Block with price, main Info, button request, and phone numbers: To facilitate quicker communication with the seller, we included a section with essential information such as price, key details, a request button, and phone numbers.
Vertical orientation for full-screen (desktop): The photo layout is in a vertical orientation to display more images, and the thumbnail layout is also vertical for better navigation.
Horizontal orientation for full-screen (mobile): On mobile, photos are presented in a horizontal orientation to align with typical user behavior of scrolling to the right.
Design the solution
We implemented the following features:
Scrollbar for convenient photo navigation
Continuous photo looping
Hover zoom functionality (desktop)
Open selecting photo
Keyboard navigation and ESC functionality (desktop)
Clickable button to request additional photos
Information block with price, key details, request button, and phone numbers
Vertical orientation for photos on desktop, horizontal on mobile
Results
After A/B testing validated the changes, user engagement increased by 2.6 times, and the number of requests rose by approximately 18%.
