Branded Portals - Upload Setup Experience

Branded Portals

Branded Portals is a distribution tool that enables users to create customizable portals and microsites for channels, partners, distributors, sales and vendors while maintaining everything within the brand identity. Share collections of assets (images, videos, documents) with internal or external users via a customizable URL without worrying about file size limitations.

‍Upload Portals is a new feature that allows external contributors or users to upload assets via public page without giving them access to the DAM. DAM admins could configure the settings like assigning categories, setup limitations, and the amount of attributes required.

‍

Problems:

1. Create an upload setting workflow for DAM users to setup an Upload Portal
2. Build an Upload Portal that external contributors are able to upload assets from different devices

For this case study, I am going to address the first one:

How can we create a way to quickly and easily let DAM users (mostly DAM admins) setup an Upload Portal via Branded Portals so that the external contributors can upload assets without having the access to the DAM

‍

Observations:

• Almost all competitors have Drag and Drop functionality upon upload in portals
• Almost no one is using any security checks like Capcha (other than Bynder)
• Metadata capture is something that is not covered by the major competitors – Brandfolder and AEM.
• In some smaller companies, upload portals set up and metadata set up require the involvement of the CSM or development. <- Opportunity to stand out and create effortless metadata configuration process handled by admins.
• Bynder and Brandfolder have the most effortless way of uploading assets, but lacking metadata
• In terms of metadata capture Bynder, Celum, Woodwing and Netx seem to be the most efficient

‍

Competitor Detailed Review:

‍

*The above user research is a joint effort with another team member: Fumie

‍

Persona:

‍

User Journey Map:

Feature Scope:

‍Based on our key findings, what we think may be helpful to solve the problem, are through these features below. And I work closely with developers and product manager to invite them into scoping and alignment process, then we ask our key stakeholders' approval.

‍

User Flow:

Wireframe:

This is the practice that I visualize the whole experience in low effort. It allows all key stakeholders (PMs, developers, product design manager) to agree on where the information will be placed before move onto visual design.

Visual Design:

Setting Modal Iterations

This is the iteration process where I add visual and colours into the upload modals, along with optimizing and simplified information that admin users would need for setup a complete Upload Portals. Through out iterations and feedbacks from review sessions, I am able to identify the best workflow of the setup experience.

Design Section on Page Builder

When designing section in empty and filled states on page builder, the most difficult challenge is how can we design a good start & review experiences without increasing the scope and technical effort? Since staying within the current style as much as possible will prevent inconsistency across the product, I discovered a solution to help users nevigate through the starting point and the review stage.

Feature - Create New Category on Setting Modal

Base on user research, we understand one of the pain points our users have is "not being able to create new category on the fly". This extremely painful specially when admin users have started the upload setup process, they would have to either exist the current setup flow to create one or use an existing category then make changes after setup, which are not ideal for the workflow.

Design System and Component Library:

During my time designing for upload setup experience and other features, I also helped with creating the MediaValet design system when there was no standard design library for designers and developers to use, and lots of currently-using components were storage in various places. While me and other designers are constantly updating latest components and styles, front-end engineers could take advantages of using the centralized library without asking design team.