Vancouver International
Film Festival

Mobile App Redesign
Sping 2019

As part of a 2-week design evaluation project, I redesigned the VIFF app by employing usability heuristics, as well as providing an experience more closely resembling VIFF's marketing collateral.

Branding, UX Design, Prototyping

Sketches + Stickies, Figma, ProtoPie

Design Sprints, A/B Testing, Project Management


My team and I conducted a heuristic audit of the mobile app for the Vancouver International Film Festival. Following Nielsen's Heuristics, as well as through a number of user tests, I analyzed and diagnosed usability pitfalls and infractions

During the heuristic analysis, I found that the app's visuals were quite bland; it had a "default template" aesthetic. This was in stark contrast to the vivid colors and the bold typefaces used in VIFF's digital and print marketing collateral (designed by local agency ZAK). I saw this as an opportunity for a visual overhaul of the app, as well as solving the heuristic infractions that came up during our initial audit.

Image from
Image from

However, as project manager, I wanted to ensure that the project was not superficial. I really wanted to communicate the brand of VIFF through the screen and interaction design. For instance, since the festival runs three weeks out of the year, I knew a potential trap would be to raise awareness of VIFF's year-round screenings. I think design is as good as its constraints, and I made it clear at the outset that this is an experience design project, and not a marketing campaign.


We began our design sprint by defining a persona for the VIFF's target audience: an enthusiast interested particularly in independent films, since a lot of her friends are students or makers of film.

We wanted the enthusiast to have motivation to be involved in the VIFF community from the outset, the roadblocks to which were encountered in the usability and joy-of-use issues of both, the iOS app as well as the website.

Subsequently, we affinity mapped our "how might we"s: ideating on ways to relieve the pain points faced by the persona and phrasing them as questions. This exercise helped us drive our process to diverge and possibly present opportunities beyond a quick fix to remedy usability issues, or a superficial facelift of the app.

It became clear to me that a major overhaul of the information architecture was required; we needed an IA that more clearly communicated the membership requirements and put films first. The latter of those was a bit of a surprise: the first screen the user sees is a social network / discussion forum. This felt like a huge disconnect from the aforementioned marketing collateral, which beautifully celebrates films and filmmakers.


I began by sketching and information architecture beside a possible screen design. The IA had to be flat so that the mental model of the app was not lost during interactions.

Design doesn't happen in a vacuum. I researched precedents for such an architecture to get clues on interaction design. I determined the three buckets to be the main activity page, the membership / settings page, and a navigation.

We quickly found apps like Shazam and Snapchat to be applicable interaction models for our solution. Shazam in particular was of interest, since Snapchat's social network aspect made the app too complicated to study for our purposes (from a purely interaction design perspective).

Screenshots from Shazam for iOS
Shazam's use of color was also important to note, since VIFF has a strong styleguide of its own. And the use of type in the marketing collateral was the initial inspiration for the bolder UI design decisions. I wanted to ensure that the experience was driven by type, color, and images. My team assembled a rudimentary styleguide while I wireframed the screens and interactions.


Color Continuity

A major pitfall of the original application was the hidden navigation. I used color to ensure that the user can maintain a sense of continuity between screens and interactions. In addition, having red-green colorblindness helped me ensure that the colors are distinct enough to avoid accessibility issues with most of the audience
Film First

I wanted to ensure from the outset that rather than the current version's emphasis on social integration, the films were paramount to the new experience. The film detail page tones down use of color to promote hero images and videos. However, the retaining the previous screen's color as an accent makes the navigational model easy to grasp.
Brand Forward

The VIFF brand is a valuable cornerstone of the arts community in Vancouver. The communication of this brand on the street is evocative, exciting, and alluring. The digital experience should at least mirror that, and at its best, amplify it. The app is what visitors use to make their way to and through screenings and events. To ensure that every touchpoint is equally serviced is to ensure that overall experience is cohesive and engaging.

© 2024 Sandy Bagga