A further look at the creation of Studio's Portal

A further look at the creation of Studio's Portal

Revamping an underused system

Understanding the need for a Portal

The Storysoft Client Portal has existed in the same form since 2018 providing clients access to analytic reports along with the ability to edit drivers, campaigns, and other Story details. As time passed, it was noted that clients rarely logged into the Portal, and with little value to the client, the Portal was only occasionally updated. With new internal initiatives underway I was tasked to give the existing Portal a “facelift” with added functionality.

Revamping an underused system

Understanding the need for a Portal

The Storysoft Client Portal has existed in the same form since 2018 providing clients access to analytic reports along with the ability to edit drivers, campaigns, and other Story details. As time passed, it was noted that clients rarely logged into the Portal, and with little value to the client, the Portal was only occasionally updated. With new internal initiatives underway I was tasked to give the existing Portal a “facelift” with added functionality.

What was wrong?

Usability was poor

The original Portal lacked a clear navigation structure and important features were hard to find, so it was decided that the update needed improved navigation, simplistic workflows, and a full UI redesign.

Visually, branding was dated with poor accessibility and most documentation was inapplicable. So with the full UI redesign, we were able to address these problems by using the design system as well as AI tools to update documentation.

What was wrong?

Usability was poor

The original Portal lacked a clear navigation structure and important features were hard to find, so it was decided that the update needed improved navigation, simplistic workflows, and a full UI redesign.

Visually, branding was dated with poor accessibility and most documentation was inapplicable. So with the full UI redesign, we were able to address these problems by using the design system as well as AI tools to update documentation.

Initial changes

Applying the design system

Using the layout, feature set, and functionality of the existing Portal, the design system was applied so that the styling was cohesive with other Studio products.

Initial changes

Applying the design system

Using the layout, feature set, and functionality of the existing Portal, the design system was applied so that the styling was cohesive with other Studio products.

Adding functionality

New features

The rework of the Portal would require adding in new features surrounding better channel and analytic management as well as access to Studio products.

Heading into the development process

Product handoff

The handoff process was designed to facilitate a seamless transition from design to development, ensuring clarity, efficiency, and accuracy in bringing Storysoft’s Studio's Portal to life. By providing detailed documentation, including annotated designs, interaction specifications, and style guides, developers had ample references to accurately replicate the high-fidelity design onto the existing Portal.

Before: Studio portal interface
After: Studio portal interface
Slide to reveal the new Portal redesign
Before: Studio portal interface
After: Studio portal interface
Slide to reveal the new Portal redesign

Portal landing experience for healthcare teams

Portal landing experience for healthcare teams

Example report

Example report

Channel creation

Channel creation

Two-factor authentication setup

Two-factor authentication setup

Detailed single user visit analytics

Detailed single user visit analytics

User profile settings

User profile settings

Registering a Story

Registering a Story

Back to the project