Overview
This is part a complete redesign of X2X's mobile content application. My team was tasked with redesigning the content viewer and collaboration tool to replace the legacy application.
Role
As the Lead Product Designer for this project, I was responsible for everything from initial research, persona creation, storyboarding, ideation, wireframing, prototyping and visual design. I worked closely with our Product Owner, Product Manager, and Head of Product.
Solution
I created a new iOS design system, including a set of custom icons and components to facilitate rapid prototyping of new tools for PIX's mobile environment. I focused on redesigning the mobile experience based on both quantitative (google analytics user data) and qualitative (interviews, surveys and usability studies) research gathered.
Playback, content organization and collaboration tools were completely redesigned based on this user data, as well as application of modern best UX practices.
Playback, content organization and collaboration tools were completely redesigned based on this user data, as well as application of modern best UX practices.
I am currently rebuilding the case study for this project. In the meantime, as a preview and placeholder, I have included the technical deck I made for v1.
I would be happy to discuss the design process for this project over a call.
I would be happy to discuss the design process for this project over a call.
TECHNICAL PRESENTATION DECK __________________________________________________________________________________________________________________
In movie production there are a few common aspect ratios for videos. According to our analytics, the two most common are: 16:9 and 2:1
I used these aspect ratios as references while designing this player
I used these aspect ratios as references while designing this player
During research, specifically usability testing and interviews with users, I found that the iPhone 'home bar' (specifically the swipe gesture that toggles app switching) often interfered with the transport bar (timeline for scrubbing through videos). I decided to steer away from the common consumer video player design and move the transport bar above the main toolbar.
I also made sure to place the UI grid a safe distance above the home bar, but not so high as to push the timeline out of reach.
More testing confirmed that there was significantly less interference with the home bar with the new design
I also made sure to place the UI grid a safe distance above the home bar, but not so high as to push the timeline out of reach.
More testing confirmed that there was significantly less interference with the home bar with the new design
Earlier design with transport bar at bottom
Later design with transport bar above controls
