Skip to content
  • Services
    • Strategy
    • Customer Experience
    • Agile Delivery
    • Security
  • About
  • Partners
    • Aha!
    • Amazon Web Services (AWS)
    • Atlassian
    • Cloudflare
    • GitHub
    • InVision
    • Ionic
    • Pendo
    • Radar
    • Vue.js
  • Work
    • Modus Create Labs
  • Insights
    • Blog
  • Careers
  • Contact
  • Services
    • Strategy
    • Customer Experience
    • Agile Delivery
    • Security
  • About
  • Partners
    • Aha!
    • Amazon Web Services (AWS)
    • Atlassian
    • Cloudflare
    • GitHub
    • InVision
    • Ionic
    • Pendo
    • Radar
    • Vue.js
  • Work
    • Modus Create Labs
  • Insights
    • Blog
  • Careers
  • Contact
September 16, 2020

Crafting Visualizations Designathon

Customer Experience

When you are in digital transformation consulting, a funny thing happens: you start seeing patterns emerge across clients in different industries and apps of different contexts. Our UX team noticed one such pattern: we are getting a lot of sales calls and clients that need visualizations of data. As companies are tracking more data, there is a growing need to better understand that data — and visualization is a critical tool to help.

If you can see the data correctly, you can find out what is actionable, find patterns, and get a better view into what your data really means.

So we decided to have a designathon (like a hackathon but for design) around visualizing data. The idea was to share our process of thinking about data and how we could “see” data differently.

Designathon Ground Rules

Here were our simple ground rules for participating designers. (Note: “Modites” are what we call ourselves, the people of Modus.)

The Challenge: try to look at the data in a new way. Try to come up with a way of seeing the data that brings a new perspective to the user.

Suggested Data: Modites. Assume you can get any data about your fellow Modites — how long they’ve been working with a tool, their location, their skills, their work (e.g. projects at Modus), their favorite food or color — whatever you can dream, and apply that to your visualizations. (Escape clause: if you have another visualization idea, please go for it!). This is about process, not necessarily design.

Here are a few examples of what we came up with.

  • JD Jones: Modite Slack Communication Graph
  • Carlos Madrid: Modite Coffee Consumption
  • Dmytryo Kovalenko: Energy Generation
  • Drew Griffith: Augmented Reality Visualization
  • Sofia Mora: Modites of Modusland

JD Jones: Modite Slack Communication Graph

JD: Based on hypothetical data, this visualization shows how often Modites communicate with one another on Slack. Each node represents a Modite. The lines connecting the nodes (edges) represent how often those two Modites message each other on Slack. The thicker the edge, the more messages sent.

In this first visualization, a node’s size depends on its “betweenness centrality”. To keep it simple, a Modite will have a higher betweenness centrality if they are a bridge between two groups. In the example below, Jonathan Van Dalen frequently messages a small group of Modites that never message the larger group.

Modite Slack Communication Graph

In this second visualization, a node’s size depends on its degree. In this case, degree represents the number of messages the Modite has received and sent. In this example, Drew Falkman has a higher degree than others, signifying that he’s super chatty 😉

Modite Slack Communication Graph

While this data is purely hypothetical, social network graphs like this help us understand how information moves through systems. Such a graph could also help us understand how cross functional and collaborative a company is. If engineers only message engineers and designers only message designers, you could invest in fostering a more cross functional culture.

Carlos Madrid: Modite Coffee Consumption

Carlos: The idea was to do an interactive web experiment to drive traffic to our website using data about Modities’ coffee consumption across the world. After estimating how much coffee each Modite consumes on a daily basis through a simple poll (google forms, interactive web form), we could represent coffee consumption with particles in space (1 particle = 1 cup of coffee).

Coffee Data Visualization

This exercise would allow us to imagine and predict how much coffee our teams would require to fuel their creativity through a year in order to deliver outstanding and innovative products to our clients. At the same time, we could also break down consumption by country, continent, project and even time of year, allowing us to show our audience not only how much coffee a company like Modus consumes but also where our talents are located and in which countries we’d be available to provide our services.

The idea is to create a graphic that illustrates not just the data, but also the nature of the data: which is a volume of liquid. This type of animation inspires us to see the data not as just numbers and trajectory, but also see its true nature: a liquid consumable.

Coffee Data Visualization 2

Coffee Data Visualization 3

This could also lead to hosting design talks or sessions with different guests to talk about what we do over a digital coffee, to discuss creativity on different business topics, design practices and remote working.

Dmytryo Kovalenko (DK): Energy Generation

DK: The idea was to create an app that helps people/organizations track, control and manage the amount of solar energy produced and consumed in their household/office/factories etc.

Many countries limit the amount of solar energy produced by people/organizations due to technical (political, economical) constraints, so it becomes important to control and manage energy flow to keep it within limits. It’s also possible to earn money by producing more energy than needed and feeding it back to the electric system.

Imagine an Internet of Things, or IoT, device that can be connected to an existing electrical system and allow users to control their solar energy production and consumption remotely from Mobile, Desktop and/or Web App (sort of like a Nest Thermostat for solar energy).

Energy Generation App

Drew Griffith: Augmented Reality Visualization

Drew: This exploratory prototype focused on visualizing possible future technologies. In this case we chose augmented reality to see how we might be able to mesh visual design, motion tracking, and 3d together.

The scope of this prototype was to display details about each Modite’s time zone, availability, and software proficiencies, while providing deeper dive modules for them to showcase their current projects, blog posts, and other social information.

Aside from creating the visuals for this prototype, this exploration was mainly centered around gaining insights into the level of effort required when creating motion tracked prototypes. Video quality and hand steadiness proved to be quite challenging while working through the motion tracking tools. We needed to repeat filming and scene attempts for After Effects to even register tracking points. Once the points stuck though, we were able to create a reusable template from the 3d motion tracked layers. This template allows us to quickly prototype interactions and animations on the 2d animated composition layers with ease. Going forward, we can experiment with the future of interface design and visualizations existing outside of fixed screens.

Sofia Mora: Modites of Modusland

Sofia: The idea behind “Modites of Modusland” was to create a fun way to display hypothetical data about Modus and its employees. My focus was to exhibit how you can show all different types of data in multiple ways. For example, charts, maps, progress bars, etc. I decided to display all of the data in a dashboard, with the idea that it could continue to grow and progress with new information every day.

As Modus is always transforming and growing, this would be a good way to keep up with all the changes and new exciting things happening in the company.

Modites of Modusland

Conclusion

Showing data in meaningful and fun ways is challenging and always a learning experience, but overall we had a great time working on these and discussing all the possibilities.

Posted in Customer Experience
Share this

Drew Falkman

Drew Falkman is a Director of Strategy at Modus Create. He has been providing product and technical direction to companies from startups to Fortune 500s for over 20 years. He is a published tech author, trainer and speaker and has a never-sated passion for technology. In his spare time he loves to write stories/blogs, build stuff, cook stuff, play music, enjoy his family and make wine.
Follow

Related Posts

  • Modus Product Design Principles
    10 Product Design Principles

    Over the past two years, Modus Create’s product design practice has grown from two employees…

  • Are You Ready for Design Transformation? - IAC
    Are You Ready for Design Transformation?

    Chris Avore discussed design transformation, evolving product development leadership, elevating design maturity, exploring organizational culture…

Subscribe to the Modus Newsletter

Receive the latest blog articles and insights every month from the Modus team.

Join Our Global Team

Would you like to be a Modite? We are redefining distributed consultative services. We have open positions throughout the globe.

See Open Positions

Let's Chat

If forms aren’t your thing, you can always call us (+1-855-721-7223).

Modus-Logo-Primary-White.svg
  • Services
  • About
  • Partners
  • Work
  • Insights
  • Newsroom
  • Careers
  • Contact
Virginia (US)

12100 Sunset Hills Road
Suite 150
Reston, Virginia, 20190
Tel: +1-855-721-7223

California (US)
12130 Millennium Dr

Los Angeles, CA 90094

Missouri (US)
609 E High St

Jefferson City, MO 65101

Romania

Str. Mihai Veliciu, no. 17
Cluj-Napoca, Romania
Tel: +40-0786-887-444

Costa Rica

2nd Floor, Plaza Koros, Av 3
San José, Santa Ana, Costa Rica

© 2021 Modus. All Rights Reserved.

Privacy Policy | Accessibility Statement | Sitemap

This website uses cookies.
These cookies are used to collect information about how you interact with our website and allow us to remember you. We use this information in order to improve and customize your browsing experience, and for analytics and metrics about our visitors both on this website and other media. To find out more about the cookies we use, see our Privacy Policy.

Accept
Privacy & Cookies Policy

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these cookies, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may have an effect on your browsing experience.
Necessary
Always Enabled

Necessary cookies are absolutely essential for the website to function properly. This category only includes cookies that ensures basic functionalities and security features of the website. These cookies do not store any personal information.

Non-necessary

Any cookies that may not be particularly necessary for the website to function and is used specifically to collect user personal data via analytics, ads, other embedded contents are termed as non-necessary cookies. It is mandatory to procure user consent prior to running these cookies on your website.

Scroll To Top