The "Magic" between layers and data- The Connectors✨

Blings Playground

The playground is where users can connect the layers from the rendered projects to Data interactivity and logic using the Connectors.

Results:

During my tenure at Blings.io, I innovated and perfected the method for instructing and training fellow creators in utilizing our creation flow (watch my very long and a bit boring tutorial here).

Through teaching, I gained valuable insights into the improvements needed in the interface, leading to a more intuitive and user-friendly design.

Users access the project in the playground to connect layers to connectors in a scene-by-scene manner.

UX

Complexity emerged when I realized that a single connector tied to a data key could impact multiple layers. Adopting a connector-per-layer workflow might reduce user learning cove but lead to an abundance of connectors and inefficient work processes.

Treating the connector as a multi-layer effect proved pivotal in streamlining the process, resulting in significant time and effort savings. This strategic shift not only positioned the connector as the primary interface but also seamlessly accommodated the addition of various connector types, enriching the project's creative playground.

Recognizing the pivotal role of connectors in establishing connections to data, the UI of the playground is designed around the connectors bar.

This design approach acknowledges the connectors as the "magic" behind the Blings product for the video creator user persona.

The UI adopts a playful aesthetic with micro animations and a vibrant color scheme to elevate user engagement.

UI

Introduction:
Our objective was to empower proficient video creators utilizing Blings within After Effects, facilitating the seamless integration of data to elevate interactive elements within their projects.

User Profile:

Experienced After Effects users who have previously done rendering their projects using the Blings extension.

Challenges:

To simplify data integration, we designed connectors as effects, linking a single layer to a data point and reducing complexity.

User Persona & User Journey

I opted for a dark-colored teal-graded Adobe semi-look interface for the Playground, establishing a unique brand identity for the Blings.io ecosystem.

This case study outlines my journey in refining the Blings Playground and The Connectors, demonstrating a commitment to user-centric design and innovative solutions in data integration within the realm of video creation.