jessica peng


Sandbox Management App

A streamlined solution for transferring sandbox objects.


hero

Overview
Transferring objects between sandboxes in Adobe Experience Platform (AEP) is a manual process that relies on individual API calls. Currently, users cannot perform bulk transfers, monitor progress in a centralized view, or identify dependencies before initiating a transfer.

The Sandbox Management App provides one UI for users to easily move successful configurations of AEP metadata (schemas, segments, datasets) from one sandbox to another.
Goals
  • Allow users to seamlessly transfer objects and their dependencies between sandboxes.
  • Reduce overall time and cost to manage sandboxes
Role
UX Designer and Developer | Wireframes, Prototyping, UI/UX Research, Front-End Development and API Optimization
Scope
August 2022 - January 2023
Tools
React, TypeScript, React Spectrum (React implementation of Adobe’s design system), Unified Shell (Adobe’s UI framework for internal apps), HTML/CSS


Exploration

Personas
  • AEP customers with a technical background
    • Solution architect
    • Consultant
    • Data engineer
Customer pain points
  • Tedious and time-consuming to copy complex objects
  • Slow set-up for new business implementations (need to deploy sandboxes with a baseline configuration)
  • Need a separate set of APIs for AJO and migrating development work to higher sandboxes
Functional requirements
  • Copy all foundation objects (schemas, datasets, segments, sources, destinations) and first level dependencies from one sandbox to another sandbox
  • Review dependencies before copying
  • Sync objects between the source and destination sandboxes
  • Revert objects (once) after syncing
  • Monitor actions for troubleshooting
Competitive Analysis
We explored features and gaps of existing object copy tools within Adobe. Gaps included not having a UI, only supporting certain objects, and not supporting bulk copy. In contrast to these offerings, Sandbox Management aims to provide a centralized experience for users to copy, sync, and revert one or more AEP objects.

competitive analysis


dependencies
dependencies

Graph and table representation of root objects and their dependencies


Design Process


Based on requirements, I created a user flow diagram and sketches to illustrate the overall experience. From there, I drafted a mockup and gathered team feedback, which highlighted issues with scalability when copying multiple objects and challenges with debugging.

user-flow
User flow for copying objects


sketches

Initial sketches


Version 1

Image 0
Image 1
Image 2
Image 3


Version 2


Given the feedback on Version 1, I decided to restructure the experience, focusing on scalability and organization.

ImprovementBeforeAfter
Problem
Users can only view one artifact's dependencies at a time.
Solution
List all objects and their dependencies in a separate window.
Thought Process
Previously, we used a dependency tree (plugin) to view all dependencies for a given object. During testing sessions, we realized the tool was lagging for object's with multiple dependencies and users wanted a more holistic view of all objects they selected. I decided to create a separate window to display all objects and their dependencies in an organized list.		BeforeAfter
Problem
Lack of modularization makes it hard to incorporate new features.
Solution
Separate the objects into their own tabs.
Thought Process
We received two additional requests to sync and revert objects between sandboxes. Incorporating these features (each requiring multiple UI components) would've been time-consuming and unreliable in our single-page UI. Given that our highest priority was to implement these features for schemas and we already faced issues running asynchronous calls across different artifact types, we decided to move each object type to its own tab.		BeforeAfter
Problem
The audit log is too dense and hard to follow for troubleshooting.
Solution
Turn the audit log into a table and put it on another tab.
Thought Process
The audit log outputted asynchronous calls across all copy operations, which made it hard to trace what was actually happening for each copy workflow. Since we already created tabs for each object type, we decided to extend this to the audit log and put it on a separate tab. We also narrowed down the information to main actions taken in the app and organized it into a table.		BeforeAfterAfter


user-flow
Revised user flow for copying objects
Image 0
Image 1
Image 2
Image 3
Image 4
Image 5
Image 6
Image 7
Image 8
Image 9
Final design


Development Process


I developed the final experience on Unified Shell using React/React Spectrum and worked closely with the backend team to accurately copy dependencies in the correct order and test the experience. Through testing and demos, we gathered user feedback and tracked all issues in JIRA.

issues
Our main challenges were successfully identifying and copying object dependencies and defining error messages (we came up with a list of job statuses for various scenarios).

syncflow
Flow diagram for copying and syncing a schema


jobstatus
All transfer job statuses displayed in the UI


Limitations


Currently, users cannot copy more than 10 objects at a time. If a schema has a custom Identity Namespace as a dependency, users must first copy that object separately before copying the schema. In addition, only the top-level of dependent objects can be copied or synced to a destination.


Impact & Next Steps


Our audit logs indicate that over 100 internal consultants and solution architects have used our app. With the addition of a feature to copy objects across IMS orgs, feedback has been very positive, highlighting its impact on simplifying sandbox management in AEP.

crossims
For example, manually recreating a single object takes ~4 hours at $250/hour ($1,000 per object).
  • Syncs (60) → ~$20,000 saved
  • Copies (4,000) → ~$1,000,000+ saved

In total, this represents over $1 million in savings, along with improved customer satisfaction.