ADOBE CONTENT MANAGEMENT


Project purpose: To create a unified content library for use by all Adobe Experience Cloud products.

Target users: Marketing professionals who plan create and or deliver marketing initiatives that require digital assets.

Duration: 6 months, with 50% of my devoted to it.

My Role: Lead designer throughout the project.

Team Members:  Matthew Deutsch: project manager. Youjin Choi: supporting design team member. Ross Phaler, Danielle Robinson, Devon Govett: Engineering. 

Project Advisors: Jordan Kretchmer: executive sponsor. Andreas Kuefer, design management. Lindsay Browne: design systems. Andy Welfle: content strategy.


WEBSITE

Initial designs assumed the the tool would exist only as a single web destination but after speaking to users and stakeholders it was determined that an SDK was necessary for existing solutions to incorporate it into their products and workflows. This required 2 additional expressions for the solution, a modal and rail version where each solution could determine how and when to use each variants.

I began by creating wireframes of how content could be viewed, arranged, added, navigated and searched. Patterns for multi-select and filter pills persisted to the final product.

 
Artboard 2 Copy 196.png

Social Search Wireframe

During the project Adobe acquired Livefyre a company that focused on searching and managing user generated social content, so we aligned efforts with them and incorporated their technology.


Final Design: WEBPage

There are three versions of the solution, a full page view that is accessed from the solution switcher in the black bar as well as a modal and rail version that solutions can incorporate into their existing and future workflows as they see fit. The following screens show some of the final designs for the web version of this content management UI.

Source Switcher

It launched with some external content sources such as Dropbox, more were planned to be added.

List View

This shows list view for a users asset library as well as multiple filters being applied which show up as removable pills.

Artboard 2 Copy 295.png

Filtering

A filters rail is toggleable and any filter selections show up as pills on top of the content.

 

Approval UI

This show a selection of posts that were created in the activity composer and sent to a user for approval.

Dropbox

This shows how users can view their dropbox content from inside the product, users would need to save content from any external source in order to be able to view an edit history or to comment on the asset.

 

Removing all filters.

As multiple filter pills can be applied the UI needed an easy way of removing them all.

Activity Details

This is an asset detail page, a twitter post in this example. I designed versions of this for all social networks as well as for image and video assets.

 
01.png

Social Search

Final design for social search UI, users can browse, search, save and repost any asset or activity found on most social networks.

 

Right Request

If users wish to repost or reuse content they need to get the permission from the original publisher. This shows the UI for requesting the rights from a single post.

Bulk Rights Request

Users can also select multiple items and do a bulk rights request.

 
Sharing   Folders can be shared but not individual assets to prevent permissions conflicts, sub folders could would inherit the permissions of the folder at the highest level.

Sharing

Folders can be shared but not individual assets to prevent permissions conflicts, sub folders could would inherit the permissions of the folder at the highest level.

Product Switcher   The asset library is accessed from the solution switcher, which I had designed also a year previous. With the Suite of products on the left (colored if users have access to them) and core services including the new asset library on the right.

Product Switcher

The asset library is accessed from the solution switcher, which I had designed also a year previous. With the Suite of products on the left (colored if users have access to them) and core services including the new asset library on the right.

Sharing pattern screens for all states.


CONTENT SDK: Modal

Throughout the design process we wanted to ensure consistency across all 3 expression of the product (webpage, modal and rail) and provide a similar feature set as well as UI consistency in appearance and operation. One way we did this was have the asset detail and edit pages be identical whether they were triggered from inside the modal view or from the rail.

modal sdk browse.png

Browsing + Filtering

Folders appear as cards with previews in the modal version, due to real estate constraints and also as this expression was less about content management and more about selecting and finding assets quickly from inside a workflow.

Modal Asset Detail View

The solution needed to account for a wide number of asset types, from images and video to email templates, twitter post and website designs. It shows a commenting and activity history below the asset that I defined.

Creative Cloud SDK

We collaborated with the Creative Cloud team to use their image editing SDK to provide a small number of image editing options from inside the product.

 

One feature that users loved was the ability to view an image and then see all the activities where that asset was being used, this is very useful in allowing for any activities that are using old assets to be cancelled.

After testing prototypes with users they asked for the ability to upload inside the modal version, something we initially resisted but incorporated as usage of the website version was much lower in comparison to the modal and rail versions.

 
Artboard 2 Copy 473.png

All Header States

This page shows all header states for webpage and modal versions of the SDK. This was done to ensure the patterns and call to actions were consistent. It also helped in ensuring we accounted for all use cases.


CONTENT SDK: Rail

The rail version of the content SDK was required for solutions that create activities such as Campaign and Target. The rail is used as an asset browser alongside their corresponding editing and creation UIs, be it for emails, or website A/B tests. I gathered requirements from these teams to understand their users and workflows and to ensure my design proposal would improve those products. I partnered with the designers on these teams to ensure we maintained similar patterns throughout all our work.


card designs

The entire product relied on expressions of different types of assets in different sizes so a wide range of card designs needed to be defined, I designed and maintained them from one art-board to maintain visibility of features for engineering and product management as well for design to maintaining style and UI pattern consistency.


NEXT STEPS

Adding more formats such as 4k video, VR content, 3D model formats as well as code snippets for websites and email templates as well as more light asset editing features. We planned for adding the ability to request content from creators from inside the solution, and tie that into a panel in our Creative Suite of tools. The ability to add more storage providers such as Google Drive, Box and the ability to link to combines on premises CMS would benefit it.


ITS FUTURE

I pitched this content management project as potentially being part of a much bigger initiative where it could become the foundation for a brand new product centered around marketers focused on content and a unique means of leveraging Adobes existing strength in content creation. This sitemap shows how this content management project could be part of a bigger solution that incorporated a means of planning, monitoring and creating marketing activities. It was the impetus for new project: a marketing calendar which I Ied the design for.


 

My Other Work