Facilitating the Browsing of Past Photos
Right now, users see all of their photos laid out in the “Photos” tab, where similar photos take a lot of space and prevent them from finding the ones they need. From my user research, I learned that users don’t necessarily need all those photos there, especially the similar ones. They just want to see the key photos that remind them of what they’ve done and where they’ve been. Only if they are interested do they want to see all the different photos related to that particular moment.
Where Should the Redesign Happen?
My first instinct was to redesign the “Photos” tab, but before diving into a redesign, I asked myself: can this problem be approached elsewhere?
Google Photos enables users to search for particular photos using natural language (e.g. Paris Summer, Dogs, Sunset, etc.). Google Assistant also automatically creates albums for photos taken around the same time and place, and recommends them to users. Should I focus on these functions instead to better help users browse through their memories?
I referred back to what I learned from the user interviews. Most users I talked with spent most of their time browsing through photos in their “Photos” tab. Some do use “search”, but only for searching specific photos. As for the automatically generated albums in the “Assistant” tab, users mentioned that those albums don’t contain all the photos they took. Though the intention of those albums was to automatically include only the best photos for users, users still wanted to know that all the photos they took are there, and would prefer looking into the camera roll in the “Photos” tab.
Therefore, I decided that the “Photos” tab was where the redesign should happen.
Design Alternatives: Grouping and Expanding
One way to help users quickly clean the clutter in their camera roll is to use Machine Learning algorithms to group similar photos and only display the best one on the main grid view. Users can look through the photos, click on a group that interests them, and see all the other photos in the group expanded, so that they can look into them in details.
Is this technically feasible?
Because of my technical background, I would always consider the feasibility of my design even when I don’t have access to the project’s engineers.
Two important questions about this design idea are 1) how to define “similar photos” and group them, and 2) how to define “the best photo” among a group of similar photos.
For the first question, Google Photos is already able to identify similar photos. Its “Assistant” feature automatically generates collages and animations from similar photos. For the second one, Google Photos is now able to automatically create albums and videos, and select unrepeated photos to put in them on its own. I’m not sure if those photos are “the best” ones, but they are definitely carefully picked from the existing photos. In addition, Google Clip does have the feature of automatically recommending a best photo from a video clip. Therefore, though the concept of a best photo is still highly subjective, I believe that the technology of selecting a “best photo” from a group of photos, according to some standards, should be available to Google.
With this idea in mind, I quickly drew out 2 alternatives and thought about the pros and cons.
However, expanding a group on the grid layout means that the entire layout needs to be changed on click. It also means that users would need one more step to get to the photo they want. They would still need to select between similar looking thumbnails in the camera roll.
I then started asking myself: do users really need to see all those similar photos in the camera roll at all?
It seemed to be the convention to have all the photos displayed in the camera roll, at least in the expanded view; but as I referred back to the user needs and my design goal, I realized that this convention could be broken. The primary function of the camera roll is for users to quickly browse through and find/discover what they’re looking for. Users only care about what they’ve done and where they’ve been in the past, and one image would be sufficient for this purpose; how similar images differ from each other only matters when users can see the detailed image.
Therefore, I developed the third alternative.
I quickly drew out a wireframe and showed it to users to validate this idea.
User Feedback: How to Identify the Most Important Moments?
One feedback I received was surprising:
For some users, having all the similar photos displayed in the camera roll actually helps them identify which moments were the most important.
When users are quickly scrolling through the timeline, they’ll stop when they see, for example, that they’ve taken 15 similar photos for one place they visited. That probably means that they spent a lot of time there, or that the place was special. Grouping all 15 photos into one single thumbnail loses that aspect, though it helps users clean up their photo library.
That was something I was not aware of before. Solving one problem might lead to the creation of another. Is there a better way to solve the clutter problem, while still having something to indicate the importance of a group of similar photos?
I quickly thought about 2 alternatives:
I decided that using size to denote the number of photos in a group would be a better choice because size naturally encodes more useful information in a way that people intuitively understand: the larger the size, the more photos the photo group contains, and the more important the group is.
However, this means that we’ll need to slightly change the algorithm of how the photos will be displayed in the “Photos” tab. If I had access to developers, I would definitely consult with them about this change, and balance the value the change brings with the amount of effort we need to put into that change.
According to my own understand of Google Photos’ current grid layout, I started exploring how this change will affect the layout in different situations.
Grouping for Different Grid Layouts
The iOS client of Google Photos has 4 different grid layouts.
Obviously, there’s no point of grouping thumbnails in the Year View, since it doesn’t show all the photos to users. Therefore, I started thinking how I can group thumbnails for the other 3 views, and drew out the respective wireframes.
In Month View and Day View (3), since almost all photos are displayed in fixed-sized squares, I defined 3 different sizes for different numbers of photos grouped together. For Day View (2), since there are at most 2 photos per row, and the photo sizes differ depending on their aspect ratio, width and height, I only defined 2 different sizes to represent the numbers of photos in each group.
As for the actual thresholds for dividing the groups (e.g. whether a group of 7 photos should be of size 1 or size 2), I will need to talk with engineers to discuss the details and experiment with real data. It might also depend on the habits of different users.
How Will the Grouping Change the Way Users Browse/Interact with Photos?
After redesigning the grid layout in the “Photos” tab, what would users see after they click into a Photo Group then? Bringing in the concept of “Photo Groups” means that I need to think more about 1) how users would navigate between photos within those groups, and 2) how the existing interactions with those photos might be affected.
For the first question, I referred back to user needs and put myself in the shoes of a user. Because of my limited time, I made an educated assumption that most of the times, users would only want to see the best photos as they swipe through their photo library. Only for photos that they’re really interested in will they want to see all the other similar ones they’ve taken.
With this assumption in mind, I started thinking about alternatives for the interaction.
At first glance, alternative 2 seems to be the worst choice for comparison between similar photos, because it’s extremely hard for users to keep in mind the photos they want to compare when the positions of thumbnails are constantly changing. However, since I later decided to create a separate mode for comparison, the sole purpose for users to navigate between photos in this page becomes to quickly browse through them. For this purpose, alternative 2 together with alternative 1 becomes the best choice. If I had time, I would bring it to users or other designers to get their input and validate this design decision.
As for how the redesign is going to change the users’ current interactions with photos, I explored all the ways users are able to interact with a photo currently, and thought about whether those interactions are more logical to be applied to a group of similar photos, or a single photo.