4 tricks for designing data-heavy applications

Default avatar.
December 11, 2012
4 tricks for designing data-heavy applications.

ThumbWhile big data makes for useful applications, it can also stand in the way of clean, usable interface designs. With more and more web applications built upon mountains of data collected in the cloud, how can you deliver all that data without turning the resulting application into a visual train wreck?

Balancing complex data needs with a simple user interface is a challenge for any web application designer today. Stripping away information will simplify the user interface, but less data often means a less functional and useful application. Yet, keeping all that contextual data can create an unusable monster of an app.

Through the process of redesigning our customer service application, we learned several important lessons for designing simple interfaces built on complex data. We’re sharing a few tips here:

1. Know your use case

The central tenet of good UI design is to start with the problem you are trying to solve, not the data you have or the design you want. If your key goal is we want it to look slick,” you’ll be basing design decisions on the wrong criteria. 

Define a use case that will guide your design process. How do most people use your tool? Understand that you cannot please every single user. As a designer, your aim should be to provide the best tool for most of your users, most of the time. 

In Zendesk’s case, we wanted to make the process of resolving customer issues faster and more personal, meaning the support person should know the customer as much as possible. This criterion shaped each design decision and gave us a framework to prioritize all the data we had.

Zendesk screenshot

2. Start with everything, then simplify

Designing data-heavy applications is more like sculpting than painting. Rather than starting with a blank canvas, you begin with something massive and start chiseling away. When it comes to designing a section of your app, start with all the data that could possibly fit in the section, then start organizing and prioritizing the data according to your main use case.

For instance, when it came time to design the support ticket page in the new Zendesk, we included everything that was potentially related to an actual support ticket and made it the same typeface, size, and color. The result was a horrifying and impenetrable mess. We then set out to whittle down, prioritize, and organize the information. We hid items, changed font weight, and added interactivity where needed. Each decision was based on our use case priorities defined above. 

Zendesk screenshot

3. Use the content itself as your design elements

With data-heavy applications, there’s no need to add extra chrome. Drop shadows, sweeping gradients, multiple textures, and other extra design elements just add visual complexity to an already complex application. 

This doesn’t mean your design needs to be black text on a white background. Instead, rely on the content and data itself to create visually pleasing experiences.

Invest your time in typography; reduce words where you can with solid and meaningful iconography and use color to group data and content in consistent ways.

Zendesk screenshot

4. Keep everything agile

Every design can be redesigned and every redesign can be redesigned again.

As more and more people use your application, you will discover areas that can be improved and simplified further. In order to iterate toward a better and cleaner design, it helps to break down all the elements of the application (data, functionality, design) into the smallest possible components on the backend.

Building your machine so it can be easily taken apart and rearranged will help you make improvements and meet changing needs as you go.

Zendesk screenshot

Conclusion

In summary, the twin goals of simplicity and data-richness don’t have to be mutually exclusive. In fact, big data can lead to great innovation in user interface design.

Regardless of the application, the lessons of starting with a use-case, sculpting rather than painting, designing with your content, and staying agile will help build simplicity on top of complexity.

Have you designed a beautiful user interface for a large amount of data? What tips and tricks can you share? Let us know in the comments.

Featured image/​thumbnail, data image via Shutterstock.

Toke Nygaard

Toke Nygaard is the Chief Creative Officer at Zendesk, driving the company’s design-centric approach to both brand and customer experience. Find more on Twitter @Zendesk

Read Next

AI Changes Everything and Nothing

The marketing frenzy surrounding the recent flood of AI-powered apps and services has caused some observers to question…

15 Best New Fonts, March 2023

Fonts are one of the most critical tools in any designer’s toolbox. With clever use, you can transform a design from hu…

20 Best New Websites, March 2023

We have another exciting collection of the best new sites on the web for you. In this month’s episode, there are severa…

Exciting New Tools for Designers, March 2023

We have invoicing apps and scheduling tools. Some resources will save you the trouble of hiring a designer or developer…

Free Download: Budget Planner UI Kit

Designing an onboarding process can be tricky; there are so many different options, and if you get it wrong, you could …

3 Essential Design Trends, February 2023

There’s a common theme in this month’s collection of website design trends – typography. All three of these trends show…

Free Download: Education Icons

Icons are essential for successful web design. They provide an eye-catching, unobtrusive way to communicate important i…

15 Best New Fonts, February 2023

The fonts you embed in your website transform the design and can mean the difference between an extraordinary brand exp…

Unlocking the Power of Design to Help Users Make Smart Decisions

Users are faced with decision-making on websites every day. The decision-making process can be far more complex than it…

20 Best New Websites, February 2023

The quality of websites in 2023 has moved up a gear, with designers cherry-picking trends as tools, embracing new ideas…

AI’s Impact on the Web Is Growing

Despite the massive strides tech has taken in the last few years, we rarely see a week as tumultuous as this. When your…

Exciting New Tools for Designers, February 2023

No matter what you’re working on, you can guarantee that there’s a cool app, resource, or service that will help you do…