A Critique of the User Interface and Experience of VSCO

Sophia Chen
NYC Design
Published in
5 min readSep 16, 2018

VSCO is a mobile platform that combines advanced photo-editing and photo journaling features. The app is very minimalist, which provides benefits and drawbacks.

An example of VSCO’s minimalist layout.

The first aspect of the app is the static tab pane at the bottom of every page, with the lightly translucent background, indicates to the user that at any time, they can switch between the 4 different page. The black highlighting on the current page tab and the slightly lighter coloring on the other page tabs is an affordance that guides users as to what they can click.

Symbols in static pane at bottom screen change colors to indicate which page user is currently on.

However, the actual symbols used, as well as the lack of words, provide little poor learnability for a new user. Though the globe like symbol can be expected to be some sort of discover feature, the two overlapping square is a poor indication of where the editing and camera functionalities may lie. On the flip side, though, once a familiar user understands what each button represents, the simplicity does lend itself to memorability. This missing element of affordance in these buttons make it hard for newer users to interact with the platform.

What exactly does the circle and the overlapping square indicate?

One of the two main features of the app is the photo editing capabilities. On ‘studio’ page, the main content are the pictures that the user has loaded in for editing or publishing. On the top left and right, there are two buttons that are shaded similarly to the static tab pane, one of which is a camera image, and the other is the plus sign. These universal symbols make it very clear to any user what they buttons lead to. Yet, one of the main purposes of the studio page is for picture editing, which the interface does not provide many affordances to show where one would go to edit an image.

The first image is how a user would see the “Studio” page when first navigated to. How does one edit the image?

However, even though a major problem of VSCO’s platform is having too simple of a platform, the editing page does a good job of incorporating learnability, memorability, and affordances. One editing the picture, though the symbols still are the main focus, there is small text underneath that indicates what each button edits. This maintains focus on minimalist qualities, yet allows new users to play around with the editing features.

Annotations under the symbols provide valuable information while maintaining minimalism.

The other main feature is photo capturing (ie. flash, grid display, white balance, etc.). However, this feature has poor learnability, since the symbols are non-universal, minuscule, and have no text explaining what each adjustment is. Even when the user clicks a button, the window that pops up doesn’t explain any more about the purpose. It becomes very inefficient to edit images, since the user has to click through several and randomly adjust settings to get a sense of what the image does.

Non-universal symbols and no text annotations.

Overall, VSCO has poor learnability and few affordances, not only due to its simple design, but also because elements of the page are not where most users expect. The photo editing requires several steps to get to making it very inefficient, a user’s list of followers/following is under the ‘discover’ page, and notifications are hidden in the corner.

Follower/following information is located in obscure location.

Though the simplicity greatly hinders the learnability and efficiency of the platform, the minimalist design choices seems to attempt to create a digital museum experience. The extreme minimalism makes the photographs the main focus, rather than the other features. Furthermore, the hidden followers/following and notification pages are made to prevent VSCO from becoming a social media platform.

“We wanted something where when you went to look at a photo, you’d see the photo and you’d see who created it and nothing else.” — Joel Flory, VSCO Founder

The following are some proposed improvements to the interface. The first is to include some way to access a description for the camera adjustment features and app pages (studio, profile, etc.) For instance, having text annotations underneath the symbols, or having a popup text when a user clicks on a button. That way, new users can get an understanding of the new features, but eventually will immediately know which to click on, due to the simplicity of the symbols. This still preserves the minimalist interface and memorability that it lends, yet improves the learnability and adds more affordances.

Proposed redesigns (right) adds text annotation underneath symbols.

The second is to add shorter, more expected navigation to commonly access locations, such as followers. The location users are used to accessing this information would be in the profile page, thus putting it there would allow for a pattern affordance. This also provide better efficiency, since users would not need to go through as many pages searching for where VSCO uniquely puts this feature.

Add easy navigation followers and following in expected locations.

Overall, I support the minimalist brand image VSCO promotes, but by adding subtle affordances and adjusting location of certain feature, the UX would be significantly improved.

--

--