Resources

Wait, that’s Shiny? Building feature-full, user-friendly interactive data explorers - Posit Conf

video
Oct 31, 2024
17:59

image: thumbnail.jpg

Transcript#

This transcript was generated automatically and may contain errors.

Hi everybody, can you hear me okay? Awesome. Okay, my name is Keegan, and today I'm going to talk to you about building feature-full, user-friendly interactive data explorers with Shiny and friends. So, let's talk about Shiny. This is a Shiny app. This Shiny app presents data on the number of crimes in different cities. This Shiny app has multiple ways to explore the data, including a data table, an interactive map, and a line chart. This Shiny app also has filters to let users select a specific day or type of crime. This Shiny app brings data to a user and lets them explore it in an interactive way. It's a data explorer.

This is also a Shiny app. This Shiny app has a homepage that describes the data that are contained in the Shiny app site. It has details about different ways that users can explore the data and encourages them to go find the data in a way that works for them. This Shiny app has multiple ways to explore data. There are interactive data tables that let users filter to a specific date or type of crime. There are details when a user is focused on a specific piece of the data. And there are multiple ways to explore the data in this Shiny app, including an interactive table, an interactive map, and interactive line charts.

This Shiny app also provides detailed information to users when they make certain selections. So if they pick a specific city, there are details about where that city's data are coming from. If they pick a certain type of crime, there are details about how we define that type of crime and where that data are coming from.

Getting from a basic Shiny app to a full data explorer

So today, I want to talk to you about how you can get from a Shiny app to a Shiny app. And by that, I mean, how can we get from a basic Shiny app that brings data to your users to a full data explorer experience that really invites users in, tells them what the data are, how they can explore them, and provides the right context and details along their data exploration journey. And to do this, you should ask yourself, can Shiny do that?

What do I mean by this question? Well, let's look at an example. Let's first ask ourselves, can Shiny look and feel like a full website? So let's start with our basic Shiny app. The users plopped right into this data table. And to most of us who are pretty used to working with data, it might be clear right away how to interact with this data. But there's still probably lots of questions about where the data come from and what limitations they might have.

So let's give our users a home page. Let's give them somewhere to land. Let's welcome them into the data explorer, tell them where the data are coming from, show them the different ways they can explore the data, and give them options for learning more about this data explorer, including learning more about the data sources or who built the site and why they built the site. We can also add additional context like about and methodology pages that just answer frequently asked questions users might have about the data in this site, like what is the purpose? Why am I here? What are the limitations of the tool or the data in the tool? And who should I contact if I have questions about the data in this explorer or how to use it?

So by just adding really a couple of pages to our Shiny app and not a lot of content really, we've given our users a lot more context for the data in the app and how to use it. So it already feels a little more like a full website. But let's take this a step further. The default operations of Shiny is that it kind of functions like a single page application, right? You move between different tabs, but you're really never leaving the same page. With actually just a few lines of code in the server, we can add sub URLs for each of our pages to help our users move to different sections of our app through either the navigation or through the URL. We can also have these changes logged in the browser so that users can use forward and back buttons in the browser to track their own journey.

This might feel like a really small thing, but this actually has a really big impact on users feeling like they're on a full website. Usually when you're on a website, you expect that you can move back and forth between the actions that you take. This is something we maybe take for granted. And then in a Shiny app, you might ask the question, wait, what page was I just on? So if you add these little details to make your data explorer feel a little bit more like a full website, you'll help your users explore more effectively and feel like they're on a full website.

Customizing and explaining the user's experience

Okay. So what else can Shiny do? Let's ask, can Shiny customize and explain a user's experience as they explore data? Let's first think about providing some context. So here we've got a title. This title describes the data someone's looking at in this filtered data table. But we can also really easily change this title reactively based on our user selection. Again, this feels like a really small detail. This doesn't take a lot of effort, but now we're really making it very clear exactly what data a user's looking at at any given point in time. It's right there, right in front of their face.

Again, for those of us who are used to exploring data with Shiny apps, it's pretty clear that we're looking at aggravated assaults on July 9th. But for those who aren't necessarily used to how a data exploration tool works, reinforcing it with a big title that changes along with them provides them the context for exactly what they're looking at. We can also do this with detailed notes. So we can add context that answers questions users might have when they navigate to a specific view. We can add the definition of different crime types, for example, in this case, so that when a user's looking at a specific view, an initial question they might have about the data they're looking at, how do we define aggravated assault or larceny, is right there. We haven't inundated them with all of the information about all of the different crime types. We're showing them what they need, when they need to see it. So we're providing them the right context to learn about what they're exploring as they explore it.

We're showing them what they need, when they need to see it. So we're providing them the right context to learn about what they're exploring as they explore it.

So now let's say our user in this app finds something they're interested in. Let's say they're really fascinated by burglaries on July 30th. Using Shiny bookmarking, we can actually let users store the state of an app, save that in a URL, and if they take that URL and put it into their browser, it brings us right back to where we were. This might be a slightly unconventional way of using bookmarking, but it's really nice because we can let users find a specific insight as they explore data, save that for later, and come back to it or share it with others. So again, by just making a few small changes, we've made the journey of exploring this data a lot more understandable for our users, and we've given them a lot more power to actually share what they find with other people.

So to go from this to the site I was showing you before obviously takes a little bit more time and energy than that. And unfortunately, I can't teach you how to do all of this today. But I do think, you know, if you learn some CSS, you're kind of on your way. But what I really want you to take away from this is think about what your users might want to learn. Think about what questions they might have about the data. And then ask yourself, can Shiny do that? Instead of thinking, I can just toss this data in a Shiny app and share it with people. If you flip the way you think about the question and instead ask if Shiny can do a thing you want to do, most of the time the answer is going to be yes. And you can have a lot more of a rich experience for your users.

Why use Shiny for this?

So at this point, you might be asking, why should I use Shiny to do that? And there are two pieces to this question. The first is, why should I do that? And the second is, why should I use Shiny for it? So the first question, why should I do that? For me, the answer is pretty simple. It's part of my job. So I work at NORC at the University of Chicago, which is a nonprofit research institution. And our main tagline is that we deliver objective, nonpartisan insights and analysis that decision makers trust. So what this means for me as a statistician is I'm generally working with data that my colleagues in public health or health care or education research have collected or collated or analyzed in some way. And I'm trying to bring that data to an audience that can use it to make important decisions.

So what that might mean is helping communicate crime data from different cities that update daily to understand where there are gaps in open crime data or compare crime rates between different cities of different types. Or this might mean helping share data from the Medicare Current Beneficiary Survey to better understand the Medicare population and their needs and their access to health care. Or it might mean sharing data on the population of lawyers in Massachusetts, their demographics and information about their law practices to better understand that community and their changes over time. So bringing data to an audience and helping them learn about that data and helping them make informed insights from that data is a huge part of what I do.

So why should we take the time and energy to make these sites into full explorers that really help our users learn and share this information? Here is your data user. If you plop them into a site and show them data and let them explore it, they might have a lot of questions. They might not understand what they're doing on the site, how the data got there, or what they can do with the information. If we give them one of those landing pages that tell them what data are on the site and how they can explore it, they're going to be drawn in to the site and curious to explore more. If we provide them the right context by providing methodology and about pages, then our user has a better understanding of where the data come from. If we provide those customized labels and contexts for our users as they explore on their data exploration journey, they're going to better understand what a specific view or a specific data point is showing them. If we give people multiple ways to explore the data, they can bring their own research questions, find meaningful patterns that might impact a decision they have to make or something they want to learn about a specific data set. And if we give them ways to share and learn, they can translate what they've learned from exploring this data into impactful insights and action.

So why should I use Shiny to do this? This is the other big question. Besides the fact that it's just fun, there are practical reasons that it's really effective to use Shiny to do these things. So to build a full data explorer like this, you would typically need three types of skill sets. You would need somebody who understands the data structure. That might be your statisticians or data scientists who know the variables in the data, know how it's structured, know how to wrangle the data. You need somebody to build the interface. That would be your front-end developers. They can actually build out the components that are going to be used by your users. Then you need people to connect the data and the interface together. That would typically be your back-end developers. You might be able to see where this is going. When we use Shiny, we can smash all of these skill sets into one group of people, and that is Shiny developers who can build the whole thing from start to finish.

When we use Shiny, we can smash all of these skill sets into one group of people, and that is Shiny developers who can build the whole thing from start to finish.

So when we're able to have all these skill sets in Shiny developers who understand data, understand how to program and use statistical programming software, and then they can learn how to build the user interface and server components in Shiny, we've condensed the sets of skills that we need into one smaller group. This means we can expand our group to enhance our users' experience and get the most out of data exploration. We can work with subject matter experts who understand the data at hand, who an audience member might be that's going to use and explore this data, and what type of research questions those people might have. We can also work with communication specialists who know how to best communicate with an audience and connect with an audience, and how to improve the journey of a user throughout the site.

So you probably won't be surprised to learn that the group of people who built the crime site I was showing you looks a lot like this. We had subject matter experts in crime data and crime data policy who helped us understand the purpose and the goals of the site. We had our Shiny developer team who built the whole thing, and we had our communication specialists who helped us think through the user experience and communicating most effectively with our audience. And the communication specialists are really, really great about asking the question, can Shiny do this? So very helpful people to have around.

So when you have all of these different sets of skills, the people who know the point of the data and who's going to use it, the people who can build the whole thing, and the people who can help communicate it effectively, now you can build full data explorer sites. You can communicate effectively with your audience, help them learn from the data, explore it, have the right context as they explore, and take what they've learned and share those insights and turn them into action. And the really cool part about this is if you think about this from the perspective of can Shiny do that, you end up building sites that maybe don't look or feel like Shiny, and you get lots of people asking, wait, that's Shiny? And you get to say, yes, yes, it is. Thank you.

Q&A

Thank you so much, Keegan. I do have a few questions from our virtual audience. So one is a little bit of a technical question regarding the sub URLs. Do you need a separate package to do that? Or can you do that with Base Shiny?

Nope, Base Shiny.

Great. So is the source of the app shown in the slides available?

Not the full app, but I did put up there, it was just up there. I don't know if anyone snagged it. There is a sample repo that does have a lot of those little tips and tricks I showed at the beginning. It's a very pared down, that ending version before I was like, and then there's a bunch of other CSS magic. There is a repo you can go explore that kind of walks you through how to do these different things.

Amazing. All right. So how do you approach scaling a Shiny app for a public website?

Good question. I think a key part of this is working with the subject matter experts to understand what we think the size of the audience might be. And actually we host all of our Shiny apps on Connect. So we utilize the tools there to help us scale up or down the resources we need based on how many users we're anticipating.

Amazing. So a question about your opinion on this. Would you consider Shiny developers full stack developers?

Oh, I feel like I could get in trouble with this question. I don't know if I would necessarily consider Shiny developers full stack developers, but I would consider Shiny developers people who have a really, a lot of different skills by leveraging Shiny to let us build things that look and feel like something a full stack developer might be able to make with those tools. I wouldn't necessarily say we should replace full stack developers with Shiny developers, but I do think it Shiny makes it a lot more possible to get closer to that.

Great answer. All right. So what are your favorite resources for learning CSS?

Oh, Google. Yeah, I Google a lot of things. There are really great websites out there for learning all the different class types. But yeah, I do a lot of, can CSS do that into Google?

Awesome. One more question here. Have you ever used or tried the Shiny UI editor?

You know what? I actually haven't. I got really excited about it the first time I heard about it and I do still want to use it. But actually, because of what I was describing, where we work with communication specialists who are often helping us design, not from the starting from Shiny perspective, we don't really start from like building UI up. We start from what should the look and feel of the site be, and then fitting Shiny into that.

Awesome. Really great to hear about your experience. Thank you so much.