Tools: Adobe Illustrator, Adobe Photoshop, Android Studio
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.