Role
Lead Product Designer
Team
Project manager, 2 engineers, Director of Engineering
Platform
Web
Yahoo’s uploader tool provides editorial and advertising teams access to a CDN for hosting assets across the ecosystem. Most commonly these assets are used in Yahoo property content (News, Sports, Finance, etc) as well the company intranet.
The Problem
The tool provided a basic solution for the user. They could upload their assets and transcode their videos but this often required more steps than necessary. Additional tools were necessary to crop images before the upload process. There was also confusion as to how a CDN worked resulting in frequent question fielding by engineers.
Research methods used:
- Survey feedback from power users
- Brainstorm with engineering to discover their pain points and listen to ideas
- Analytics review
Key Findings
Finding #1
Overall user flow needed improvement.
Finding #2
Incorporate internal tool for cropping so users don’t need to prep their image asset externally.
In the case of multiple image uploads, a gallery will provide the opportunity to crop before saving.
Adding a couple options to the Actions made the list too long. I moved them into a drop down to allow for labels and to save space.
Opening the preview modal allows the user to access the other tools/options as well.
Users can choose to crop at this stage.
Finding #3
Add preview and transcode features in the video upload step.
Finding #4
Add an activity stream for troubleshooting user issues
Finding #5
There is general confusion on what a CDN is so we added an FAQ
Updated design elements
Tradeoffs
When the user opens the tool, it loads with the most recent uploads within the entire company. I offered a recommendation to allow for team based directories for privacy and easier file navigation. Since that was not possible due to the current setup and time constraints adjusted designs to add a directory/folder bookmark feature.
Solution
The final prototype incorporated a streamlined user flow, reducing clicks by 40%. Tooltips, error messages and progress animations were added for user feedback. The new features allow the user to crop their images either right after upload or later. The video transcode was enhanced by including a video preview at upload.