Spectacular User Experience Within A Tourism Website: Visit Humboldt

Samuel Harper
Growing Into UX
Published in
11 min readDec 1, 2019
The landing page for Visit Humboldt’s website draws site visitors in with a mix of enchanting videography, mystical music and a surprisingly fitting “Alice and Wonderland” theme. Courtesy of www.visithumboldt.com

Welcome to Jurassic Park! Er, I mean… Endor! Star Wars: Episode VI and scenes from Jurassic Park: The Lost World were filmed in Humboldt County, among a myriad of other movies including ET: The Extra Terrestrial.

I have fond memories of attending college at a small but well recognized state university behind California’s redwood curtain in the far northern part of the state. Although remote, Humboldt County offers a lot in terms of outdoor activities, easy access to the ocean, and a short drive to southern Oregon.

It’s massive biodiversity of redwood trees, ferns, mosses and other flora inspired George Lucas to set it as the stage for Endor in the movie Star Wars: Episode VI. It also inspired Steven Spielberg to film the trailer scene for Jurassic Park: The Lost World, in addition to scenes from ET: The Extra Terrestrial, among numerous other movies. And it is easy to understand why; the area’s striking beauty, large amount of forest, aquatic biodiversity and mystical vibe draws in filmmakers and tourists from all over the place.

However, I believe that one of the most delightful things that also came from that area was a website released by the Humboldt County tourism board, which created an amazingly beautiful, and fun tourism site for the area.

Not only is it incredibly well set up from a user experience perspective, but the branding, video and music, and UI elements also really make the site incredibly fun and delightful to interact with.

How the site works

People who go to www.visithumboldt.com are taken to a landing page which sets the stage for the experience that soon follows. A video plays in the background and the accompanying enchanting music and B roll of the forest ensues. Soon, we get a visual of Alice from Alice and Wonderland, having tea with the Mad Hatter and strolling through the forest.

The “Enter Here” button, signified by the white rabbit, is our open invitation to dive head first into an experience, not just another tourism website.

This particular site is designed in both an extremely beautiful, engaging and elegant manner which customizes the experience to the specific individual with it’s wide range of interactive graphics, video and mood setting music.

Upon “entering” the site, we are then prompted to answer which of the four categories individuals who frequently visit the area fall into.

Taking individuals to this screen allows for a more customized experience of the site.

Once the site visitor has selected which of the four categories they want to explore, they are then taken to a prompt which tells them what to expect. After clicking the “Get Started” button, they are shown a countdown timer, which leads to a string of clips, organized by location (approximately 60 seconds in duration, total) depicting activities the site visitor may be interested in, with accompanying music to set the mood.

Even though some of the locations overlap among several (or all) categories, such as Redwood National and State Parks (found in all categories), they are each depicted in a different context, based on the type of trip the site visitor is seeking.

Choosing the Destinations

At this point, the site visitor gets to choose their destinations! In this example, I selected the “Adventurous” category, which takes us through a video depicting a little bit of each location that falls into the category selected.

From here, users can:

  • Skip ahead or go back (using the arrows on the bottom right hand corner)
  • See progress through the video with the yellow bar at the bottom
  • Select specific locations they want to visit, with the click of a mouse, which provides feedback with the flashing white screen (as seen below)
  • View the amount of “pins”, or ideal locations selected (bottom right)
  • Adjust the volume, or go home (top right)
  • Exit the video early by hovering over the “pin count icon” on the bottom right. hand corner, which changes to “view itinerary” upon hover
An example of the layout from a video clip. For how much you can do, it is surprisingly simple!

Once site visitors picked the locations they want to visit, they can either wait until the video is over, or select the icon on the bottom right, indicating the number of pins available, which then changes to read “view itinerary”, taking them out of the video sequence and over to the next page.

If the site visitor does not place any pins:

They are taken to this page, where they are given additional help. They can select “Try Again” so they can go through the video adventure again and select which locations they want to visit.

For anyone who is not entirely sure where they want to go and plans to simply browse, they can opt to “View All Destinations”. This allows site visitors to browse and explore any locations that may be of interest to them.

Anyone who has a clearer understanding of where they plan to visit and just wants to see hotel and lodging information can select “Accommodations”.

If the site visitor selects at least one pin:

The storytelling element and experiential feel really makes the magic of the site pop.

They are then taken to this screen, asking the site visitor how they plan to get there. Once again, we see Alice, the Mad Hatter and a couple other characters, having tea on the cliff overlooking Trinidad State Beach.

At this point, the site knows:

  • What kind of vacation the individual is looking for (by category)
  • What specific locations the individual wants to see, within that category
  • How they plan to get there (more on this at the end of the article)

They are then prompted to a page featuring a beautifully rendered image of Alice and the white rabbit, observing the expansive forest, and compared in height to even a portion of one of the mighty redwood trees.

Site visitors are prompted to scroll down, revealing the page below.

Scrolling down reveals an interactive map with pins from each location selected. Clicking on each pin takes the site visitor to an overview of that area. On the top right hand corner, we are shown how many locations were selected (denoted as “pins”).

From here, site visitors are able to:

  • Go home or turn the volume off (or back on again)
  • Read more about each location selected
  • Get directions to said location (routes to Google Maps)
  • View accommodations
  • Email the location to yourself or someone else
  • Obtain a printer-friendly version of the page

For the people who want to find where specifically they can stay, they are able to use the dropdown to filter out which areas they want to stay in, and what housing accommodations they want.

The hotel and accommodations page for out-of-county visitors.
The screen displaying at the bottom of the page. There is a video playing in the background, making the text easier to view.

If the site visitor did not like any of the locations selected, they have the option to either try again (goes back to the page to select one of four categories), or for the people who want to more freely explore the site, they can select “View All (fill in the category selected) Destinations”.

The overall outcome of the site is extremely well executed, prompting site visitors to explore different parts of Humboldt County, plan an itinerary, and book any accommodations while they are here.

Why this site has brilliant user experience

Customized experience
The fact that the Visit Humboldt website is constantly asking questions that get to know the site visitor that much more indicates a strong focus on routing the site visitor to the places they would be most interested in.

Ability to freely explore the site
While the site does a fantastic job of narrowing down what the visitor wants, they are by no means, stuck there. There are options peppered in everywhere to correct any mistake the visitor may have made, or to simply keep exploring. Users can freely jump back and forth, try it again, or skip the video sequence all together.

Strategic use of branding and storytelling
While this is not directly a user experience related topic, the strategic choice of music, graphics and immersing the site visitor into one of the four stories, while also adding in the magical Alice and Wonderland theme is a fantastic example of communication between the UX designer(s) and Creative Director(s).

Well done use of imagery, as well as video and music
Related to the previous point above, the strategic use of still images, as well as video and music really make the experience THAT much more immersive. So again, while it is not as directly UX related, it definitely compliments the experience itself quite nicely.

Highly interactive
One of the best things about this site is how FUN it is! I have found myself going through it over and over, trying every which interaction and possible route, and observing how strategically it is set up.

In fact, it was such a great experience, I just HAD to jot down each page, the flow, what users can do on each section, and how choices are presented.

I went through the site and laid out how individuals are able to navigate based on choices made.

Site Limitations

Of course, no digital product is perfect, and the site does have some potential flaws which are worth mentioning.

1. The “How Might You Arrive” section is surprisingly not as helpful as one would expect

While this section does suggest that the UX designer(s) behind the project put some thought into making the experience as customized as possible, it surprisingly does not seem to actually produce any sort of output that tells people the best route to get there based on the mode of transportation they selected. My guess is that it would output that information to Google once it sends site visitors to Google Maps, however it does not, and as such they must select their mode of transportation all over again once they get there.

2. The CTA on the accommodations page is to view the itinerary, not to filter and find accommodations

This was a strange one for me to wrap my head around. Why would users be prompted to take an action that gets them back to the page they came from, instead of completing the action they came to this page to accomplish? Why must they scroll down in order to get there?

From the previous screen, users must scroll down here in order to manually select the locations they want to stay at, despite already selecting the locations they are interested in beforehand.

What is also strange about the itinerary view is that it does not also allow site visitors to see a list of hotels within areas they selected in the video mode before landing here. Where this site falls short is that it expects site visitors to know where the adventures they previously selected are located. Showing a list of hotels and places to stay for that area, based on what was already chosen and marked on the map would be helpful.

Furthermore, whenever someone selects “View Accommodations” for a location (Say, Redwood National and State Park), they are taken to the generic accommodations page, instead of to a page confirming they are looking for accommodations around Redwood National and State Park. This can confuse the site visitor as to where they are, and site feedback is necessary at all times.

3. The descriptor text takes site visitors to a card, located at the top of the page

This part threw me off as well. It is jarring to hit the button which you think will expand the text for you, only to be jumped to the top of the page instead. Obviously a logical choice would be to expand the text which is already there, instead of jumping site visitors to the top of the page and making them scroll back down to get back to where they were.

4. The mobile experience could be better

For example, one of the biggest mobile related issues I noticed is that site visitors must select the filter bar on the top of the page, in order to find a location they want to stay in. People I have showed this to were not able to find the filter bar at first, causing unnecessary frustration.

Because all of the attention is being called to the center of the page, it distracts people from the actual functionality of what they are here to do, which is instead, located at the top of the screen.

The small text link below, which is located where most CTAs are placed, instead routes people to a different website for Humboldt County. Yes, the descriptive text tells people what to do, but not everyone will read it.

4. The video on the landing page (usually) does not play at first

This is a weird technical issue, as there is actually supposed to be a video with music playing when you land here. And yet, most of the time this is what people see, implying this is supposed to be a stationary background. It does play however, if you have gone though the video sequence, and then press the home button, navigating back here.

Obviously this is a weird technical issue more than anything else, but it does limit the intended experience.

This is what most people see when landing on the landing page, even though there is supposed to be a video playing.

Honorable mention: the interactive video does not work on mobile

Another interesting thing to call out is that the mobile version of the page does not have the fun, interactive video that the desktop version has, which is disappointing, as it seems like it would be especially fun on mobile. The site itself feels more as if it was designed with desktop in mind, as the mobile experience offers the option to watch the video and displays all destinations within that category, instead of letting them select each one as they choose.

Furthermore, each section has a segment of that video to watch from the whole video for that category, as would be seen if the CTA was clicked.

This could have been some sort of technical limitation from a developer perspective, so it’s possible this feature was desired but had to be scrapped in favor of this version.

Overall experience

While the site does have a few limitations that are left to be desired near the end, it is still an incredibly exciting, fun and super engaging site to interact with. And if you ever have the opportunity to travel to the area, I highly recommend you do. It is a spectacular, hidden gem within California’s northern coast.

If you would like to experience the site for yourself (which I STRONGLY encourage you do), you can do so here: www.visithumboldt.com

Before you go

If you are interested in connecting with me, you can find me on Linkedin here.

--

--

Samuel Harper
Growing Into UX

Professional UX designer and UX career coach; I help brand-new UX designers land their first jobs, excel in their first jobs, and network like a badass!