DataStax | Meaningful User Experience with Graph Data (Chris Lacava, Expero) | Cassandra Summit 2016

Meaningful UX with Graph Data

Chris LaCavaSenior UX DesignerExpero www.experoinc.com Chris has spent the past two decades defining, designing and building software for a variety of industry verticals. He has experience as a usability engineer, interaction designer, front-end developer as well as product manager for both consulting and product-oriented organizations.

Hello!

Bringing Challenging Product Ideas to Life

Data Architecture, Visualization & Training

Reactive User Interfaces

Lean Product Discovery & Rapid Prototyping

Productizing Research & Innovation Projects

Custom Software for Scientific Computing

Data Science & Machine Learning

1. Graph Basics 2. Tailor experiences to the intended audience3. Determining the right visualization4. Choosing the right tools

Things we’ll cover

Graph Basics

8/16/2016

Vertex

Relationship

Things are connected to other things

Vertex

RelationshipNYC Bostonconnected by

Vertex

Relationship

Jason Aliceson of

(Product)

Spider Man Lunchbox

Marvelpart of

(Franchise)

Spider Man

Lunchbox

Marvel

part of (Franchise)B

Ages 3-8recommended

(Product)(Age Range)

Spider ManLunchbox

Marvelpart of

(Franchise)

Ages 3-8

(Product)

(Age Range)

part ofIron Man

Toothbrush

(Product)

Back To School 2016(Promotio

promoted product

recommended

8/16/2016

TransportationVerticesStationsCitiesEdgesRailsRoads

Graphs are everywhere

The InternetVerticesRoutersComputersEdgesFibreEthernetMicrowave

Graphs are everywhereInteractions

Professors, Papers,

Conferences, Classes, Students

People, Restaurants, Hotels,

Reservations, Proximity

Sensors, Visits

People, Jobs, Titles,

Companies, Careers, Skills

Social Network

Vertices

People

Businesses

Phone Calls

Emails

Memberships

Friendships

Tailoring experiences

1. Know the problem you're trying to address2. Know the goals of your users3. Experience the data before you design a solution

● Be concise and general● Identify a major gap or deficiency in current system

or process

State the problem

Problem statement should:

Problem statement should not:● Contain the solution● Nest other problem statements● Address only symptoms

“If I were given one hour to save the planet, I would spend 59 minutes defining the problem and one minute resolving it.”

- Albert Einstein

Find the gap

Zeroing in on user goals What users think will bridge

the gap.

● Measurable ● From the perspective of each user type● Directly address the problem

Goals should be:

Goals should not be:● Technology specific● General, vaguely subjective

Dominant Dimensions provide an intuitive and technically feasible way to efficiently move through a large amount of data. Improving data coverage also increased the probability of finding relevant relationships that might have otherwise gone undiscovered.

What’s the Dominant Dimension in your data?● Temporal● Frequency (Velocity)● Quality (Veracity)● Relationships (Connections, Correlations, etc.)● Context● Type (Variety)● Size (Volume)● State/Status● Georeference (Location)● Custom Attributes

Data Discovery How can data

bridge the gap?

1. Determine the most effective visualization2. Factor in user perspective3. Leverage dominant dimensions

The right visualization

Answer 2 Questions:

Is my information conceptual or data-driven?

Are my visuals meant to be declarative or exploratory?

Determine the most effective viz

Idea Generation➔ Validate ideas➔ Creative, free flowing➔ Used to wireframe / design

Standard Data Visualization➔ Conventional, static ➔ Structured, simple data➔ Used to affirm or set context

Data Exploration➔ Trend spotting, deep analysis➔ Network diagram, 3D+➔ Used for trend spotting, deep

analysis

Idea Illustration➔ Shows process or framework➔ Simple metaphorical➔ Used to simplify complexity

Declarative

Exploratory

Conceptual Data Driven

Idea Generation

Standard Data Visualization

Data Exploration

Idea Illustration

Declarative

Exploratory

Data Driven

Conceptual

START STEP 1 Q?

SUBMIT

Idea Illustration

Idea Generation

Standard visualization

http://extremepresentation.com/Andrew Abela:

Determine the most effective vizAlgorithm based graph stories

Dependencies• Failure chains• Order of operation

Matching / CategorizingHighlight variant of dependencies

ClusteringFinding things closely related to each other (friends, fraud)

Flow / CostFind distribution problems, efficiencies

SimilaritySimilar paths or patterns

Centrality, SearchWhich nodes are the most connected or relevant

User Perspective What users think will bridge

the gap.

Why, how and where your users do their work affects user adoption

Example Scenario

Example Scenario - State the problem

Our users don’t have enough insight into how social media activity related to their products contribute to the bottom line, especially by region.

Social media saturationQuickly see information social media over time, by region, in relation to a specific product announcements. Identify key influencers.

Financial data correlationClearly correlate regional financial / sales data to a given region and announcement.

Overall performance of a product announcement at a glanceView regional, financial and social performance indicators for each announcements.

Example Scenario - User Goals

Data Sources:

● Graph of social media posts and comments● Regional sales and market data● Regional news announcements

Example Scenario - Experience the data

Dominant dimensions:

Product AnnouncementsTimeRegion

Social media occurrence (frequency)Financial KPI (sales / stock)

Primary entities:

What Does the data tell us?

Financial indicators and product order volume react inconsistently from region to region after traditional press announcements.

Sales are stronger in regions with more social media activity directly after a major announcement.

Example Scenario - Design Spec

Product Campaign

Region

Dominant dimensions

News Story

Financial KPIs

Social media occurrence

Primary Entities

Example Scenario - Design SpecGoals

1. Social media mention patterns, regionally, over time

2. Identify key influencers in social media, and announcement origin (per region)

Key Influence Indicators2

● Using weighted criteria, the user can zero in on key influencers within a given region at the selected time

● The User can progressively disclose more information about that activity by selecting one of the influencers.

1. Enumerate needs based on spec2. Evaluate off-the-shelf, open source, custom3. Ensure UX is cohesive

Choosing The Tools

Experiencing the data

DataStax Studio Linkurious Enterprise

UI Frameworks and Libraries

Selecting a robust framework offers:● A better, more consistent UX● Faster development● Browser compatibility support● Responsive UI extensions● A methodology

Node Chart Visualizations

KeyLines

Cytoscape

LinkuriousJS

SigmajsD3

Geospatial

LinkuriousJS MapboxKeyLines

LeafletJS Google Maps

Google Charts43

Standard Visualizations

ChartJS Highcharts

Timebar

KeyLines

Thank you

FOLLOW US@ExperoUX@uxchrislacava

EMAIL US

email@experoinc.comchris.lacava@experoinc.com

DataStax | Meaningful User Experience with Graph Data (Chris Lacava, Expero) | Cassandra Summit 2016

Software

Transcript of DataStax | Meaningful User Experience with Graph Data (Chris Lacava, Expero) | Cassandra Summit 2016

Lacava y Diniz - La Represion Policial en Brasil

DataStax: Enabling Search in your Cassandra Application with DataStax Enterprise

DataStax | DataStax Enterprise Advanced Replication (Brian Hess & Cliff Gilmore) | Cassandra Summit 2016

LACAVA PIAZZA · LACAVA PIAZZA 4272 • 254 • 764207 - Wall-mount porcelain shroud Exterior Dimensions: Material: Weight: Finishes: Faucet Holes: Wall-mount, vanity-top, or drop-in

DataStax | Network Analysis Adventure with DSE Graph, DataStax Studio, and TinkerPop (Bob Briody) | Cassandra Summit 2016

DataStax: An Introduction to DataStax Enterprise Search

DataStax ODBC driver for Apache Cassandra and DataStax ... ODBC Driver for... · DataStax ODBC driver for Apache Cassandra and DataStax Enterprise with CQL connector Installation

DataStax | Data Science with DataStax Enterprise (Brian Hess) | Cassandra Summit 2016

DataStax Enterprise in Practice (Field Notes)

DataStax | Graph Data Modeling in DataStax Enterprise (Artem Chebotko) | Cassandra Summit 2016

Mainstay DATASTAX

ZOOM LACAVA

DataStaxODBCdriverforApache ......[ODBC Drivers] DataStax ODBC driver for Apache Cassandra and DataStax Enterprise with CQL connector 32-bit=Installed DataStax ODBC driver for Apache

DataStax: The Whys of NoSQL

DataStax | Deploy DataStax Enterprise Clusters with OpsCenter (LCM) (Manikandan Srinivasan & Mike Lococo) | Cassandra Summit 2016

DataStax Enterprise on Microsoft Azure

LACAVA ALIA

DataStax: Datastax Enterprise - The Multi-Model Platform

Simplifying Data Management - DataStax · Simplifying Data Management with DataStax Enterprise (DSE) OpsCenter Other Administration Capabilities DataStax OpsCenter visually handles

5464 aquagrande ada - Lacava