Uncovering the real network of work
A concept to visualise network graph data
Product UX/UI Design
Front End Designer
Team Machine is an enterprise-level business intelligence app that pulls together continuous, real-time data of what, when, where and how work happens. It uses network graph data from services like Slack, Github, Jira, Dropbox and Google Suite to visualise connections and collaborations between users and across projects within an organisation.
The team had built a proof of concept and were able to show how colleagues within or external to an organisation were connected via the projects and conversations they were part of.
We needed to create a speculative product to illustrate what was capable with the data we had access to, and how it could be used practically.
Scope & Constraints
Express the network graph data in a meaningful way, via a UI that felt familiar and was much simpler to digest than the original charts.
There was no formal process for this project – no user journeys or user stories. We would need to thoerise any potential jobs-to-be-done.
When I arrived, the team had built a prototype which visualised network graph data, expressed via a charting library.
While distinct and interesting, and quite frankly beautiful, the charts were difficult to navigate and understand.
This was one just one way to visualise the data, however.
A successful app would give users access to the potential synergy the connected data offered.
We theorised an AI-powered conversational interface would be a useful way to interrogate the data, but this was way too much development overhead.
To test the Question: Answer paradigm, I opted for a text-based interface, starting with basic pre-determined questions that users could click to progress through the app.
View this file in Figma
Eating our own dogfood
Given the time constraints, I decided that the most appropriate organisation to model would be one I was familiar with, this would reduce the research overhead finding examples for entities such as job titles, apps used, file types etc.
the aim was to understand the type of questions users might ask when considering the network of an organisation.
- Who is available?
- What can they do?
- What are they working on?
- Who are they working with?
- Who can help me with xxx
- How can I contact [person]
Looking at an individual user, we can see a dashboard showing a summary of the entities they are connected to: projects, files, chat threads, apps they use etc.
We can drill down into any of these summary headings for a detailed list.
An option to filter or sort the list can help answer questions like “what have they been working on recently”.
NB: the filter “last 7 days” is vague and begs the question “WHAT in the last 7 days?”.
Is that when the file was created, or last modified?
Sarah’s list of skills is presented as a tag cloud. Clicking a skill launches a page of users who also have the same skill, ranked by rating, so we can understand how Sarah compares to other users.
We might want to show Sarah’s rating for each skill on her own page.
Clicking a user might show a list of projects where they have used that skill, apps they use, files they created using those apps, other people they worked with.
Outcome and Lessons Learned
Get in touch:
Due to COVID-19 restrictions I'm only available for remote contract roles at present.
East London, UK
+44 07496 230 314