Arttracks

Project Overview

The idea behind Arttracks is to provide anyone from an up-and-coming artist, podcaster, Youtuber, or someone who would simply like to convert audio into a streaming visual media format. Video is popular medium consumers are preferring to get their music, news, podcasts, and other sound experiences. The challenge was creating a streamlined, easy-to-follow format for a user to dive in and get started creating video content quickly. 

SOlution

The strategy was to create Arttracks as a web application to help users create videos of their audio content through a step-by-step wizard interface. The user has the choice to upload their own photos and artwork, or choose from visual design templates. The user has immediate access to produce videos and share across social media platforms, networks and devices.

My Role: User Flows, IA, Wireframes, Prototyping

Tools: Axure

Product Site: www.arttracks.com

Discovery & User flows

After discovery discussions and white-boarding sessions with the team, I took the high-level requirements and performed research on the best practices for step-by-step interfaces. Once I had an idea of the best direction to take for user and business needs I drew out user flows for the MVP. The interface needed to be intuitive and showcase natural progress from start to finish within the UI. I worked closely with the lead developer to ensure features could be built within the time constraints of the fast approaching MVP. The web application needed to also have a monetized subscription component so I suggested a plan system where the user could build a video at a mobile resolution for free, and would need to upgrade their plan for higher resolution formats.

The "art track" process would begin with a user progressing through a quick five screen interface to establish a file name, choosing a canvas layout, uploading artwork formats, and choosing a layout for the video. Once a user's project had been created they could manage the entire project: upload audio tracks, manage artwork, and ultimately build their video.

Wireframes

Soon after the owner and I had finalized the high-level paths a user would take, I started creating medium fidelity versions of the site. Since a visual designer was in place for the project, I took to Axure to simultaneously create the wireframes and prototype. I had a very clear vision for the product we needed to create to solve the problems we identified for MVP beta testing.

There are some screenshots of the redesign below illustrating a new user's path to setting up their video project for build. You can view the full prototype below.