Lonely Planet

Project Overview

The Brief & Problem:

Lonely Planet, a travel site who prioritizes trusted content from expert travelers, expressed that they wanted to better include Digital Nomads into their sites structure by using their existing content. They wanted to help connect work and travel for those who do both full time.

Other Details:

Timeline: 3 Weeks

Tools Used: Figma

Devices: Mobile-first approach with responsive desktop design

*Please note this is a hypothetical project and scenario

The Team & My Role:

The team consisted of four people. I led the design process, while we also had a research, research synthesis, and overall project organization and consistency leader. While there were different roles, it was a highly collaborative process and we all contributed to every step.

The Solution:

Create new navigation tabs and categories to better organize Digital Nomad specific content as well as a search feature allowing people to find information about setting up their workspace in different cities and countries.

Who Are Digital Nomads?

Based on user research conducted through interviews and an in depth content analysis of youtube, reddit, and various blog posts:

  • Researchers

    They are constantly on the lookout for the next best destination. They spend time researching and looking for inspiration mainly on their mobile devices, then switch over to their laptops or desktops when it’s time to start making concrete plans. They also ensure they have several backup plans in case their original fall through.

  • Comfort Seekers

    When researching their next destination, their number one priority is comfort in their home base, particularly in their office. They want to ensure their lodging accommodations have a comfortable chair, high speed and reliable internet, as well as adequate space. Since they will be spending a significant amount of time here, this is the first and most important action they will take. While they prefer to work in their home base office, they will research co working spaces or wifi cafes in the area as a backup plan.

  • Cultural and Nature Enthusiasts

    They like to spend around 1-3 months in their desired location to ensure they get the full experience of a destination. In the hours before and after work, as well as weekends, you can find digital nomads at local bars and restaurants, exploring nature, and overall, doing anything and everything they can to immerse themselves in local culture. They also enjoy connecting with other digital nomads, as well as locals.

The Digital Nomad’s Journey

To help synthesize our research further, I created a journey map with a teammate to help understand the emotional journey of a digital nomads lifestyle

We decided to place our main focus on the “living” section, since this is the longest part of a digital nomad’s journey. After making this decision, we started to ideate ways to create a solution that focuses on these pain points using Lonely Planet’s existing content as requested in the brief. The first step to this was navigation.

Navigation - Adding Nomads To The Map

We initially created a site map that included a brand new tab named “Digital Nomads”. This tab would be its own separate hub for all digital nomad related content. We felt this would be simple, easy, and straight to the point.

But, when we conducted a tree test, we were proved wrong.

Very few people who took the test navigated to the digital nomads tab, while majority were searching for our proposed subcategories under Lonely Planet’s original global navigation categories. Based on these results, we created a final site map that embedded our new proposed categories within the existing navigation tab.

  • Final Site Map Iteration

    The new additions to Lonely Planet’s navigation are shown in blue.

Laying Out The Plans

After finalizing our map, we moved onto creating sketches and a proposed user flow to further our ideation process. We wanted to figure out how we could create a solution for helping users find inspiration for their ideal office set ups in specific cities, or just in general. While deviating some from these while starting our wireframing process, they did inspire how we started it.

User Flow

Done by a colleague as an initial idea for our mobile screens (since the company requested a mobile first approach), as well as our users searching for inspiration on mobile first.

Sketches

Initial Wireframes

After Sketching, a teammate and I began designing frames on figma. This includes:

Our new navigation categories. For this flow, we focused on the “Working While Abroad” tab, due to our users placing a great deal of emphasis on their work set ups and making their plans around it. This is what we spent most of our time ideating on.

Articles in the same format as their existing ones that are related to the topic of working while abroad in their searched location. For office set ups, we heard from our users that things like wifi providers, internet speed, outlet types and amount, and overall space is something that varies from city to city, and they wanted easier access to that information.

A new search by destination area, created similarly to their existing one, but focused entirely on working accommodations in the area. This includes: Information about setting up your home office, lodging accommodations with already great office set ups, as well as great coworking and wi-fi cafe’s for the back up plans they like to have regarding working accommodations.

We also created a second flow, which includes:

An iteration on the “Tips from Fellow Nomads” tab, which will bring them to a general article listing page, as most of Lonely Planet’s tabs do.

An article about more general office set up tips while you’re on the go.

Usability Testing

After prototyping our frames, we moved onto testing our designs to see how well users were able to navigate through them.

5/5 users we had test the product were able to complete our tasks within both flows easily.

Key Insights

Users felt the flows were too similar. While they understood there was a difference between our idea of the location specific office set up tips and the general, they felt there was no variation.

Users disliked some of the wording, particularly on the destination page. They felt it was too confusing at some points, making it hard to easily read and understand

After gaining these helpful insights from our testing, my colleague and I went back to figma and adjusted our frames based on the information we got from testing to make our designs more usable.

Final Product and Prototype

We changed “Tips From Fellow Nomads” to “Tips From Digital Nomads” for clarity. There are many different types of nomads that Lonely Planet has catered to previously, and this is to emphasize their need for better inclusion of digital nomads.

We added an overlay to not only the image on top of this page, but all images with text over it to ensure our text passed contrast accessibility needs. We also went ahead and changed some of the wording on this page.

We changed the name of this article since users felt the original title was too long and wordy, making it hard to understand.

We finished making this article page Hi-Fidelity, incorporating article titles that relate to some of our users other pain points, goals, and needs. While we did not get to fully ideate on every one, we wanted our users to know they were heard in our conversations.

We changed the article in our Tips From Digital Nomads flow to add more variety into our product, but still focusing on user needs. This one is to help users remember to take car of their mental health, since they expressed that this lifestyle can sometimes cause feelings of loneliness which can negatively impact their overall health and wellness.

Responsive Desktop Design

Since our users expressed using both their mobile and desktop/laptop devices when planning their trips, we decided to create a responsive desktop design after completing our mobile approach. Here are some of the previous frames in that format.

Reflections

  1. In the words of our nomads, be prepared for plans to fall through and always have a back up. Collecting data and information in other ways than interviews can help you move forward if you are struggling to find interviewees.

  2. Consistency is important. When we were first creating our frames, we noticed some inconsistencies on Lonely Planet’s original site within their style guide. We made the decision to update some areas of their style guide instead of sticking with it. It is okay to suggest changes that will create a better and more usable site layout, even though you may be told no.

  3. We had a lot of ideas for our solution, but ultimately we went with the one that best fits Lonely Planet’s original content. Even though this was what was stated in the project brief, if I could do it again I would create at least one new feature that was more outside of the box that would better help digital nomads. Letting the fear of being told no was definitely holding us back, but moving forward I want to take more risks.

iAm