2021
Miguel Rodriguez (me) - Product Development
Joy Southers- CEO/Founder
Claudia Visfoss - Graphic Designer
Product Architecture + UI & UX Design
Principal UX/UI Designer
B-Listed is a mobile and web application that I designed for B-Listed Media, inc. As a the leader of a small team, my job was to help manifest the vision of the founder while synthesizing research and balancing design thinking strategies with a fixed timeline.
Learn the product concept of the founder and create a usable, useful design cross-collaboratively with users and the team.
Product Architecture
UX/UI Design
Style guide generation
User testing
In the founder's words - "the app should allow distributors to search and screen films just as easily as they would browse Netflix or Hulu".
Preliminary research began with visual studies of B-Listed's direct and indirect competitors to identify trends on how layout, typography and color are leveraged to create a consistent content streaming experience.
Most of the pre-product research and empathy data was collected before I joined the team. With that data as a foundation, I began to construct the core IA and wireframes to better understand core user journeys, and establish feedback loops with users and stakeholders.
After 3 iterations and 5 usability interviews per iteration, the layout and content of the wireframes increased in fidelity until stakeholders were satisfied. The decision to go mobile-first as a design best practice was accepted by stakeholders early in the process.
Using the data gathered in earlier phases of the design process, I developed a small-scale design system that was visually exciting, and in-harmony with the brand guidelines.
01
Vibrant, yet purposeful use of color. Appealing to the future-leaning Gen Y & Gen Z target audiences.
02
Typographic hierarchy and contrast make important information stand out
03
Similar component layouts that repeat throughout the product
Proxima Nova was chosen by the brand designer for its neutral, Helvetica-like qualities and it's legibility at small scales.
I expanded the existing color palette to accommodate the needs of the platform’s key functions.
I created and maintained the component library throughout the design and development process, which successfully served as the single source of truth for all team members and ensured visual consistency across the platform.
The final design aims to reduce the friction typically experienced by users navigating complex licensing and distribution processes. Combining these actions into one unified platform, filmmakers and distributors can focus on connecting, transacting, and enjoying their art with greater ease.
A familiar home page, with films showcased based on the user's tastes. This is the jumping off point for all action within the app.
Displays all pertinent film details and allows distributors to send document requests, messages, and schedule screeenings.
The shopping flow sits on an inviting and relaxing background gradient, which is intended to pull the user to the store over and over. Users can navigate through the shop quickly with oversized images, text and smooth transitions.
You can access the mobile prototype here.
B-Listed is set to launch in mid 2022. After launching with an MVP, the team plans to further iterate on the product's design, features, and functionality.
