Introduction

Roxio, a leading provider of digital media software, needed a modern mobile app called MediaPLAY to serve as a comprehensive hub for personal photos and videos. The goal was to expand their product line and enter the cloud market.

The Challenge

The client provided basic wireframes and requested bold visuals inspired by UIs from Porsche, Lexus, Sony's PlayStation, Adobe Lightroom, and Apple Aperture.

Client's Wireframe

Mood Board

Process

1. Concept Development

Reviewed reference images and created multiple visual options for client review.

Initial Visual Options

2. Drawer Exploration

Developed various styles for a pair of drawers that contained additional content.

Drawer Explorations

3. User Story Comps

Created comps for user stories, including login, search, photo selection, and grouping.

User Story Comps

4. Horizontal and Tablet Versions

Designed horizontal and tablet versions of the UI.

Horizontal UI

Tablet Album View

Tablet Places View

Tablet Gallery View

5. Slicing

Created slices for all pieces in Photoshop and exported them as PNGs.

Slices in Photoshop

6. Testing

Tested the PNG pieces in Android Studio before delivering to developers.

App Build in Android Studio

Results

The project was successfully completed, with all assets delivered to the developers after thorough testing. MediaPLAY was well-received, meeting the client's expectations for bold and modern visuals.