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
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.
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
