FTL - Data Networks

Faster Than Light

High Speed Network Technology

FTL - Faster Than Light

The industry's fastest data distribution network  software for enterprise, cloud, mobile, and IoT. High-performance messaging lays the foundation for digital business

For more than 25 years, TIBCO FTL has led the industry in high-performance messaging technology, and today we offer the most comprehensive messaging portfolio available to meet a wide variety of use cases and deployment models. TIBCO Messaging is the foundation of the TIBCO® Connected Intelligence platform, capitalizing on data in real time wherever it is, and making it available to applications that drive action based on analytical insights. If you are looking for the best in messaging, you’ve come to the right place.

Customers:

New York Stock Exchange, FedEx, American Airlines, Chase, Charles Schwab, Macy's, 

and 4000+ others Enterprise companies

 
 
Category

SaaS Enterprise​ software design

 

Date

Jan 2016 - Feb 2017 (1 year)

The solution

Create a network app with one click.

By starting with a 1-click solution and working back into complexity, the resulting solution was naturally easier to use.

I redefined who should be able to use Tibco FTL.

 

 Shifting from Network Architects, whose time is very expensive, to much lower level Admin Engineers.

FTL cloud requirements

A seamless cross-platform experience in the web browser. With a consistent look and feel in line with a vision for the future of the brand.

Network Architects and Operations Managers need to quickly & easily build, maintain, and troubleshoot complex data networks via the cloud app with the following qualities:

 

My role

UX Interaction Designer

Participatory design

Led cross-functional workshops

Secured stakeholder buy-in

 

Research and reporting

User research

Market and competitive analysis

Personas development​​

Intake and synthesis

Uncover new relationships

 

Iterative design

Rapid prototyping

Storyboarding user flows

Testing

Peer reviews

Stakeholder reviews

 

Information architecture 

Created an interactive dashboard

Modularized complex functions

Microinteractions

Production wireframes

Primary tools

Hand sketching

Sketch App

Keynote​

 

THE SOLUTION

ONE CLICK NETWORK APP CREATION 

After research, I redefined the persona who should be able to use Tibco FTL Cloud.

A network architect's time is very expensive, so making FTL accessible to low level admin engineers saves customers thousands of development dollars.

By starting with a 1-click solution and working back into complexity, it made it straightforward to figure out what the default settings should be.

CENTRALIZED MANAGEMENT

This centralized management strategy reduces the amount of technical expertise required of the user, thus reducing the level of seniority needed to administer the networks and saving massive salary costs for our customers.

A hierarchical decision making structure 

All decisions and processes are handled strictly at the top level.

 

Users can drill down through detail pages if necessary.

Streamlined the setting up and simplified the network administrator’s job.

Lofi Wireframe 

EDIT AND CUSTOMIZE

APPS WITH NESTED TABLES AND MODULARS WORKFLOW

Flattened the user's journey by breaking apart the numerous steps into a modularized workflow, replacing nested forms with multi-level pivot tables.

High fidelity  prototype

THE PROBLEM

SETTING UP LARGE COMPLEX NETWORKS IS DIFFICULT AND ERROR PRONE EVEN FOR CHIEF ARCHITECTS

Many customers expressed difficulty getting their complex data networks up and running quickly due to the highly technical details and various compatibility issues.

 

Setting up and maintaining a network was a time-consuming process that required the deep technical expertise of a network architect.

 

PERSONA 1 - Carl the Network Architect

 

 

 

THE PRIOR UI

Dozens of complex Forms

The previous version was a very tedious and time consuming experience, with a series of nested forms that the user had to fill out sequentially. 

 

The process obscured many of the hidden requirements and options needed to make the network applications run correctly, making it very difficult to troubleshoot errors.

Previously the interface was Dozens of forms which gave no visibility into the system.

DISCOVERY PROCESS  | Workshops
Workshop Particapation

I bring the Stakeholders together.

1 CTO

1 Chief Architiect 

2 technical Engineers

1 front end engineer

1 Design manager

1 Visual designer

Unifying interdisciplinary teams from multiple locations:

San Francisco 

Palo Alto

Chicago

Mexico

China

India

Open up the discussion  

Who ?

What ?

Where ?

When ?

Why why why why why ?

LEARNING TERMINOLOGY:

Apps: can contain hundreds of endpoints, which can send or receive data in a one-to-one or one-to many configuration

Endpoints:an abstraction that represents a set of publishers and subscribers in communicating programs

Transports: specify communication protocols and transfer data messages which multiple endpoints can subscribe or publish to

Configurations: must be set such that the structure of the sent data matches what is expected on the receiving end

 

Much more 

COLLABORATIVE WORKSHOPS

I explained the high level concept and my design solutions to the rest of the UX team. To validate my concept, I wanted to see if they could develop a better idea or convention that I could leverage. 

Screen Shot 2018-10-15 at 3.34.59 AM_edi
SYNTHESIS AND INSIGHTS
 
INSIGHTS

The current iteration is error prone and takes months to setup a network application.

Companies need to be able to quickly deploy and monitor network applications in an accessible and transparent way.

 

SIMPLIFY AND STREAMLINE THE WORKFLOW

Network architects and operations managers need a faster and easier interface to create, modify, and troubleshoot complex networks.

 

Aim to help the user 

- the right action

- at the right time

- with the right context

- through the right channel

An example use case

The New York Stock Exchange (NYSE) publishes stock prices at message rates of millions per second over Tibco's FTL Messaging. Millions of traders can subscribe to any one price.

 

A trading house needs to create a new network app to subscribe new desks to the prices published by the NYSE so they can buy or sell stocks internally or through the exchange. 

The network architect will quickly set up new trading desks using network apps to apply the same configuration to different offices around the world.

Network Apps always have

2 or more ENDPOINTS = O 

1 or more TRANSPORT = >  

NYSE publishes a stock price over a one of our transports.

 

The trading house can subscribe to the NYSE stock price, making it available to hundreds of traders in offices around the world.

 

Buyers and sellers can instantly trade:

•in-house on internal transports or

•externally on the exchange’s buy and sell transports.

THE SOLUTION

Part 1

DESIGN GOALS

Drive awareness, engagement, and sales with an easy to use out of the box experience.

​​

Faster maintenance and reduced downtime without being required to know how the data distribution happens

ITERATIONS

Once I had an understanding of the technical concepts and what the user needed, I was able to synthesize it all down to a very simple and easy to use concept with a high level of detail and control.

I flattened the user's journey for setting configurations by breaking apart the numerous steps required into a table or grid that could be easily scanned and modified.

APPROVED CONCEPT:
LAYERED GRID

Based on the many-to-many relationships of the endpoints and transports, I came up with a multi-layered grid table.

This visually stacked hierarchy allows users to expand each layer while maintaining context. Each level in the table can contain multiples sets. 

THE WIREFRAME ITERATION

MULTIPLE VERSIONS OF THE LAYERED GRID WERE MADE AND TESTED

To find the most efficient and readable design, I made multiple rapid iterations and tested them with people who had no understanding of the technology or the purpose. 

 

I would simply put it in front of people to see if they could understand the structure just by looking at it.

EARLY VERSIONS

The app layer can contain multiple endpoints.

 

Endpoints contain multiple transports which are set by default to be compatible. 

The transports groups contain multiple transports,

and the transports contain multiple components 

That pattern is repeated for each section

LATER VERSION

Experimenting with adding and deleting levels in the grid.

+ DETAIL PAGES

Expandable detail pages were added to allow users to drill down.

FINAL VERSION

Once a design direction was settled,  I began to add layers of details and microinteractions.

I continually collaborated with  the project's visual designer, to work out many of the details. We constantly pivoted on the microinteractions.

+ STATUS CURTAINS

A hideable dropdown screen shows analytics.

It allows the user to drill down into detail pages.

The dashboard can be opened and hidden with a single click.  

 
SOLUTION 
Part 2

NETWORK MAPPER 

MAKING CONNECTIONS

The Problem with connections

Previously, there was no visualization of the entire network.

 

The user would have to make one complete endpoint configuration from start to finish then move on to the next endpoint. 

Users would have to take great care not to make a single error that would be challenging to track down.

 
 
MAKING CONNECTIONS WITH A 
CONNECTION MAPPER

In the new designs, after the apps, endpoints,  and transports are created, they can all be rapidly reconnected using a data mapper.

Breaking the process into small modules

for later assembly makes for a much faster and simpler experience.

 

FIRST MAPPER PROTOTYPE

LATER MAPPER VERSIONS
FINAL MAPPER PROTOTYPE

 
OUTCOMES

FAST, SCALABLE, EASY TO IMPLEMENT AND USE

  • Extremely scalable

  • Ability to stay competitive in a volatile market

  • Prevent errors

  • Faster maintenance and reduced downtime

  • With its powerful platform, users can even create their own finance applications

Screen Shot 2019-09-22 at 5.41.14 PM.png
Screen Shot 2019-09-22 at 5.41.27 PM.png
Screen Shot 2019-09-22 at 5.41.48 PM.png