Digital Sales Room

CASE STUDY Client Portal UI/UX, Oracle

How do we create a collaborative, secure space that enables the sales team and prospective customer (buyer) to share and access relevant content, ease communication and provide live status throughout the sales process?

THE ASK

  • Difficulty identifying the best available content

  • No metrics to track the success of shared content

  • No shared collaboration space to manage content

  • Emailing large attachments makes it hard to track

  • No single source of truth for the state of the deal

PROBLEM

We created a secure, shared, templated environment in which both the seller and prospect can define their needs quickly and personalize how their content is presented – sharing assets and tracking the progress
of the deal in real-time throughout the duration of the sales cycle.

SOLUTION

Requirements

Build a set of scalable component modules that meet the needs
of all phases of the sales process, regardless of industry or scale
of the prospect

  • Establish a friendly and familiar environment that reflects the tenets
of the Redwood Design System

  • Provide co-branding opportunities for a targeted, personalized experience

  • Create an action leading to a single go-to location for each opportunity

  • Offer two options for DSR creation:

Private/Secure DSR - internal collaboration system through
document and folder sharing

Public DSR - available to anyone with URL

Sales Reps need relevant material based on the customers pain points and goals, to address their needs and provide better and personalized solutions.

Sales Reps need to rapidly identify and translate their customers pain points and goals into potential solution proposals so they can have more time to sell.

Sales Reps need to leverage the key information they already have on the account so they can quickly spin up sales material for their customers

Creating a unique experience for each set of needs.

DESIGNING THE DSR MICROSITE

The Seller

  • The Seller wants a secure, branded, immersive online sales collaboration workspace that replicates the benefits of an in-person engagement.

  • They want to easily share compelling and relevant sales material with
their Buyers.

  • The seller-curated content is assembled around a prospect’s region, industry, paint points, business goals, and potential products of interest – helping to advance opportunities through the pipeline.

  • Sellers want to understand Buyer engagement with content and track the health of an opportunity. Sellers also want ways to identify high-return, previously successful sales content that will resonate with similar prospects.

The Buyer

  • The Buyer wants a more personalized buying experience that includes a secure space to share project content and negotiate with Sellers in real-time.

  • They want a centralized area where they can assemble project content, self-identify key stakeholders and in a frictionless way invite them to collaborate.

  • At their own pace, the Buyers want one place to connect with subject matter experts, evaluate products and ask questions.

Expanding on the Redwood Design System

We use the existing design system as the foundation when building the new DSR environment. We expanded the collection and created a new extension of the palette and textural identity to form a uniquely new environment, while staying true to the Redwood brand.

A SPECIALIZED COLOR PALETTE

A unique palette was created as a subset of the Oracle Redwood Design System. This default color set is used when there is no customized co-branding initiated by the prospective buyer.

REDWOOD VISUAL AND TEXTURAL ELEMENTS

What you need - when you need it.

Multiple configurations for each step of the sales process. Featured below are the Discovery and Solution configurations. Though there are default configurations, modules can be swapped or repositioned as needed, giving the seller and buyer greater control of their communication.

A WARM WELCOME

Custom Welcome screens present different high-level messaging. Wether you are new to the DSR or a returning contributor, allowing for a targeted and relatable message at each stage, creating a more organic engagement.

TEAM MODULE

Default Discovery and Solution microsite configurations, created specifically for SeABank.
Each displays relevant navigation and modules.

Content Module Design

We needed to create templated modules to represent each step of the sales process. While remaining unique to each prospect’s requirements, there was flexibility to the modules that universally addressed the common needs of all customers, providing flexibility and personalization. Core modules comprised every phase of the sales process to more easily track the progress of the deal, provide context for the customer and seller, provide a shared repository to share relevant documents for storage as well as fluid communication and transfer of valuable information pertaining to the deal.

The modules remained structural integrity while providing flexibility to retain the Redwood default application or unique customization of the modules to represent the customer’s branding.

Upcoming Events &and Periodic Agenda

An easily accessible toggle button to switch between modules allows for multiple views within the same component without creating a separate module, saving valuable scrolling space for the user.

Your Team

Default state displays up to three team members.

We needed to solve for instances where there were potentially many members, so we built a contained, scrollable module to accommodate an unlimited number.

Co-branding Design System

PROVIDING OWNERSHIP

To provide a true branded feel, we created a system for customers to incorporate specific elements of the DSR interface, allowing for logos, brand color palettes, visuals elements and proprietary imagery, etc. while still retaining the overall integrity of the structure and functionality of the microsite.

In this example with Ikea we conducted a survey of their common branding elements as well a their corporate guidelines to inform the usage within the existing modules. Once the modules were populated with Ikea’s visual elements, we were able to easily configure a thoroughly branded experience.

Editing Experience

CUSTOMIZE YOUR ENVIRONMENT – CLEAN, SIMPLE WYSIWYG INTERFACE

We created a simple dashboard experience allowing the builder of the microsite the opportunity to quickly modify the sequence and configuration of the modules, expediting the creation process while presenting the exact content required to respond to rapidly changing needs.

By displaying larger thumbnails along with clearer overview of the sequence of the modules, the microsite owner can more easily see how the modules will appear with real content.

SHAPE LAYER

CONTENT LAYER

FINAL DSR

Smooth Sailing ( ...scrolling)

PARALLAX CONSTRUCTION

To create a more dimensional and fluid interaction and series of micro-interactions, we created a multi-level structure consisting of content modules, branded shapes and full color background. This helped both promote the use of the modular content structure and an modern experience for the user.

RESULTS

I led a small team of UX designers from concept and exploratory design phases through final designs. Interactive prototypes were presented to the PM and development teams leading to adoption by other product teams – setting the guidelines and template for all development tools.