Vizro Records Mobile App

UI | UX | Prototyping

Mock up image Vizro Mobile App blue horizontal ruler line with sparkles at ends

Goal: Exercise teamwork using the Waterfall methodology. The project's main objective was to create a high-fidelity mobile prototype for a fictional company client. We were to demonstrate proper Waterfall methodology practices, work on clear communication with team members, and produce the client's deliverables within the allotted timeframe.

Timeline

  • Jul — Aug 2022

Software

  • Figma, TeamGantt

Designs

Team & Project Overview

  • Each member was assigned a role from our instructor based on our preferences:

  • 1) Kayla and Michael — UI/UX Designers
  • 2) Sherwood — Project Manager
  • 3) Renzrick — Graphic Designer
  • 4) Sharif — Web Developer

  • The main requested deliverables were the following projects:

  • 1) Gantt chart timeline and Work breakdown structure (WBS)
  • 2) High-fidelity mobile app prototype
  • 3) Website landing page mock-up and email template
  • 4) Report and presentation

Brainstorm & Research

Our team created a mind map to brainstorm the app's contents. We supplemented the mind map with competitive research of other record labels and concluded there was a market opportunity for record label apps. To entice new users and promote Vizro artists, the app showcased a built-in music playlist for the artists, like Spotify or Apple Music.

WBS and Gantt Chart

A WBS was created on Figma to visualize the project's workflow, rough milestones, and ensure all tasks detailed were necessary for the deliverables. The WBS was then used as a guide for the Gantt Chart and its dependencies within TeamGantt.

Work breakdown structure for Vizro Record's requested deliverables

UI/UX Designers at Work

Michael and I created a site map on Figma to refine the number of required screens, as well as a visual for our team members to input their feedback. We collaborated on a user flow to imagine the ideal paths users would take on the app. The user flow was used to divide the wireframing and screen mockups process between the UI/UX designers:

  • Kayla's tasks:

  • 1) Sign in/Sign up process
  • 2) Account settings
  • 3) Search bar function
  • 4) Music section (incl. saving favourites & streaming music UI overlay)
  • 5) Mobile app prototyping

  • Michael's tasks:

  • 1) Home screen
  • 2) Category dashboard
  • 3) Merchandise section and payment process
Mobile Prototype
Vizro Records' med-fi wireframes of the sign-up process Vizro Records' hi-fi prototype of the sign-up process

Change Control & Communication

Halfway through the project, the client requested a brochure as an added deliverable. We had a team discussion on the change on how we'd manage the increased workload, referencing the Gantt Chart. We replied to the client with an adjusted counteroffer to reflect the extra time required, along with additional charges considering the expedited nature of the request. The client agreed, and we concluded Sherwood to take on the brochure design. The WBS and Gantt chart timeline were modified to reflect the added deliverable.

See all projects ➜

Say hello!

blue horizontal ruler line with sparkles at ends

Let's collaborate and create something amazing together!

Let's Chat!