Great examples of UX

17m 38s

In their UX Roundtable video series, the UpTop Health UX team discuss great examples of UX.

Moderator: Michael Woo (Director of UX)
Interviewees: Abbey Smith (UX Designer), Deborah Roberts (UX Designer), Michael Woo (Director of UX)
Share

Episode Transcript

Moderator/Michael: Welcome you to another episode of the UX roundtable. Today’s topic is sharing some great examples of UX that each of us has found. We have a mix of healthcare and non-healthcare. And with that, I will start off with you, Abby.

Abby: Great. Let’s do this. So my kind of example of great UX is a company called forward. I’m not a member, I just kind of stumbled upon them in the past couple of days. And I think what they’re doing is really interesting. They are a primary care facility that I have just noticed reading through the website and the copy here that they really put the patient first, which I mean is all about UX in general. I was actually really interested in them because they are so heavily tech focused in a way that I haven’t seen any sort of healthcare provider do that. I think they can do that because they are private, right. And it’s a, it’s a membership based doctor’s facility. But I thought it was just really interesting, I think from a high detail level UX. Their colors and visuals are soft and approachable, but also kind of makes the user feel that people know what’s going on. That they know that these doctors know what they’re doing and how to use all of this technology that’s coming at them.

Cause it is quite a lot. They kind of use UX language in a really good way to help like bring all of these medical terms down into a layman’s person world. And so that like anyone like you and I, any sort of patient, any age of patient can understand it, which I thought has was a really smart way to go about doing something like this that is so futuristic in technology. Let me just scroll to this technology page because this is where I thought they did a really great job. So they have this mobile app, again, putting the patient first, they have this mobile app where they have thought through what their patients will need. So it kind of helps people to meet people where they are.

They always are going to have access to any of their data, any of their test results, any of their programs, just in case they need to do some cross doctor collaboration with a referral or something. I think that is a huge factor in people dealing with doctors. Just in my own kind of UX research that there’s so much to bring at all times and you don’t want to have to deal with the back and forth. So I thought that was a really great UX win for them. Then also on this technology part, I think this is the scariest part of what they do just because it is so futuristic. They take the time here to explain how this can improve people’s care. Which again, I think is really great UX when, it takes the pressure off of people so that they can focus during a meal, during an appointment,  and they can understand what’s going on and what they’re seeing.

I think that creates a high level of trust right off the bat, which is another UX win. Without that trust and doing these kinds of futuristic things like genetic testing and biometric monitoring, it gives them an upper hand and helps push them forward, at least in this new tech kind of world within healthcare, which in my opinion is probably where things are going to go sooner than later. So that’s what I had as a great example of a company out in front, for sure.

Deborah: I chose Airbnb, which is outside of healthcare. I thought it’s just a great example for its visual clarity, minimalist design, consistency, and efficiency of use, and there’s a lot of things that could be applied to any sort of website design and UX design. Coming to the homepage here, my eyes are immediately drawn to this background image. I think it’s really dynamic and you also see this kind of headline go near and then a single singular CTA explore nearby stays. Then you also have this kind of prominent search bar, which has really clear language, giving the users a clear indication of what information is needed. I also liked that they have this banner here, “get the latest on our COVID-19 response’, because especially with travel and safety being a big consideration right now, just having that front and center and easy to find is really nice for users. I think that transparency helps to build trust.

Then you can see at the bottom here, there’s a little white space and you can see that there’s some more content so that you could give that indication that you can scroll. And here we have some other locations that are featured, that are actually specific to my location. So it’s been personalized, which I liked, and you can see that the artwork is similar. So it kind of tells this cohesive visual story. It also is telling me how much time it would take to get to the destination, which I thought was really great. Then scrolling down the page, you have these sections that are following a similar, modular layout, but the background here, shows contrast, which is nice because it just helps to break up the page visually, but it still really feels cohesive.

And then from a content perspective, this section “live anywhere”, provides these curated results. So you could just jump into this curated site section, which I thought was really cool. It’s really inviting. And, then down here too, just, you know, thinking overall from a content perspective, they have online experiences featured right now because people aren’t traveling as much during the pandemic. And it just felt very relevant. The images felt really dynamic, which was just really engaging and it helps the user, encourages them to move forward. Then coming back up here to search, because this is where I think a lot of their users would go if they’re looking for a place to stay, when you hover, you can see that you can engage with these different sections as their color changed. Then as you click in, it gives you this clear instruction of what you need to enter or input.

They also have this shortcut here, which I like, exploring nearby destinations, and then that automatically progresses you to this check-in state. And I like too, that they were showing two months at a time as opposed to just one so that it gives the users, visually they can see more without having to click and scroll. Then as you select your check-in date, as you move your mouse around, you automatically can see progress to this checkout date. You can clearly see what timeframe has been selected. And then I liked this too, this was a good example of progressive disclosure where this was hidden until you selected your dates. And then upon doing that, you could choose. Right now it’s automatically selected for me that I want these exact dates, but you could change that if you are flexible and that might affect your search results.

Then coming over to guests, you can easily add or subtract the number of guests that I liked to have with this X up at the top. So you could clear out your entry, if you wanted to. It just gives a lot of flexibility and enables the user to quickly change the input. Then coming to the results page, I thought that was really nice. You have the map at the right, and then you have your results here at left. And at the top you have some filters. They only show four filters at once, which I thought was interesting. This kind of goes back to that same idea of progressive disclosure and that it’s not overwhelming you with so many filters. You can really zero in on the results. And if you do want more, you can select that.

They have a nice use of white space and the use of hairlines here to separate the different sections. So as you’re looking at all of this text and information, it’s not visually overwhelming. I also liked because I chose as my destination nearby places, they have different locations separated out here. So you have Leavenworth glacier and you can scroll through the different options. You could say, show 101 to see everything on one page. Just overall, I felt like they did a really great job of breaking down the relevant information into smaller, easy-to-digest pieces. And it just makes it much more palatable for users so they can find what they’re looking for more easily. I’ll turn it over to you, Mike.

Moderator/Michael: That was great, thank you. Airbnb definitely is a inspiration for a lot of designers in terms of raising the bar instead of betting industry standards, for sure. Okay, let me share my screen. The example I was going to share is Oscar health insurance. Some of you may or may not be familiar. They’re not one of the big health insurance companies out there, but they’ve been around since 2012 as a startup that really uses technology to differentiate themselves from the competition. Their premise was to really focus on simple plans and coverage which means no co-pays or co-insurance, to make it a lot easier for users to understand, being that the health industry is just very complicated. I’m showing you the mobile version, although both desktop and mobile is really nice. I wanted to show you this because I think they did a really good job overall on their approach to delivering this experience.

I’m not going to say that it was mobile first. It probably was, but to the extent that they took just as much care designing for mobile, I mean, everything on the screen is very intentional. It’s a very delightful and functional experience and mind you, this is a payer portal, if you will. The balance of imagery and typography I think is well done. There’s three touch points I want to share with you guys. Going to either of these categories, whether it’s individuals or business or brokers,  to shop plans. First of all, I’m just going to plug in some information here. It’s not available in Seattle, so throwing in a New York zip code to shop for plants and compare.

This is a little bit busy here at the top, but you know, probably the reason for having this information. As you scroll down a bit, just showing again, like Deborah said about Airbnb, progressively showing information, critical information, that the users would care about. Allowing additional hovers to get more detail if needed. I just thought that it was a really nice scan to look at plans and, that function of being able to compare plans pretty easily; they only allow up to two. But in this view, as you can see, you know, it’s pretty straight forward, looking at these plans and highlighting which ones are more affordable for you. And again, it’s just bare minimum, right? The bare minimum of information that is critical as you’re going through this process of shopping. That’s the plan comparison.

I’m going to toggle over real quick to an example of shopping for care here. So let’s look for doctors. I searched for a network. So again, Florida and okay for myself, straight-forward prompts, pretty simple there, but like other articles we’ve talked about, being able to provide very useful search features, powerful search features that are relevant. So let’s just say, for example, even before I type anything, right, they prompt common searches here. They even have facets if you want to filter down your search, but let’s type Chiro. So it’s like, okay, chiropractor. Um, do I want that? Even the delightfulness of little illustrations of a male or female doctors is nice.

As you can see, when you are able to have control of APIs, to really control the experience, there’s a lot that you can do to  unify everything; to make it seem like it’s a holistic experience and not linking users off to a third party website where they’re searching providers and you have really no control over that experience. So they have a lot going for them in terms of controlling that technology.

Another thing I was gonna show you was frequently asked questions and I know this is not to be too enamored with, but it’s definitely a critical thing. If you’re trying to find answers, especially on a payer portal, whether it’s about terminology or whatever it is that you need, coverage, that kind of thing; it’s pretty smart. It actually, well, in this case, there’s no results found, but if you were to tap through a definition and you were to type FSA, cause I didn’t know what FSA met. It worked earlier. Of course, when I’m doing this live, it’s not going to work for me, but the point is if you were to type something, the assist of search and the predictive functionality of it is just really cool, allowing you to break down the different facets in which you would find that information. I just thought that was a really cool feature here as well.

Just in general, I think the intentionality of this site is well done and the balance of graphic design and function really made an experience that typically you want to get excited about. Something that you can definitely consume, more like a consumer experience, kind of like Airbnb, if you will.

Deborah: Definitely.

Moderator/Michael: Alright. Okay. Well, thank you everybody for sharing.

Websites in Video:
AirBNB: https://www.airbnb.com/

Forward: https://goforward.com/

Oscar Health Insurance: https://www.hioscar.com/