Internet speed website

Created to connect the remote worker to the internet from anywhere.

Project Overview

Understanding the User

Starting the Design

Refining the Design

Going Forward


Project Overview

THe Product:

Testyourstay.com is a new website created to connect remote workers to the internet from anywhere in the world which allows users to test a location’s internet speed before booking their accommodations.

Target Users:

  • Income: Any

  • Age: 25-55 years of age

  • Profession: Any remote position

  • Education: Any

  • Gender: Any

  • Lifestyle: digital nomad, remote worker, travels often for their company

Project Duration:

March 2024-April 2024


The Problem

Remote work is on the rise, the digital nomad era has begun. Post the 2020 pandemic more and more companies have seen the need to offer remote positions for their employees. Working remotely has many benefits for employees, including the ability to travel the world while working. A problem that many digital nomads and remote workers face is knowing if internet connectivity and speed will work for their needs before booking their accommodations.

The Goal

The internet speed website app will let users quickly and easily search address-specific internet speeds from anywhere in the world before booking a hotel or room share accommodation. Speed tests will be uploaded from the community of users directly to the site. This allows all users access to an ever-growing database of location-specific internet connectivity.


My Role

  • Lead UX designer

  • UX researcher 

Responsibilities

  • user research

  • wireframing

  • prototyping


Understanding the user

User Research: Summary

The research for this project was fueled by my extensive travels with my husband who is a remote worker. With so many unique places to visit while traveling, we needed a way to check an accommodation’s internet speed before booking. Primarily working through Hotels.com and Airbnb.com, we found that descriptions often specified internet connection, but few if any, gave details on actual speeds. We were left to sort through reviews of previous customers to decide if the internet speeds were fast enough to handle various remote tasks, specifically video conferencing. We needed an app that showed us the most recent internet connectivity information at the accommodations we were interested in booking.

I started with the vision that the app would primarily be a place for users to upload their current internet speeds, but I quickly realized that owners and managers of the accommodations could also upload their internet speeds as a way of enticing future remote working customers. After numerous competitive audits and the first round of user research, I quickly learned that there was a gap in the international lodging and tourism business. With the ability to look up a specific address’s internet speed, the user would not only receive the information they needed for their remote work, but also help grow the database with their uploads.

My user research includes three areas of focus: understanding what the internet speed app primarily will be used for, how the user wants to primarily use the app (mobile, desktop, etc.), and understanding the processes and emotions that people experience when the user is in the app.

User Research: pain points

1

pain point

There is not enough information about internet speeds when selecting accommodations internationally.

2

pain point

Internet speed information is generalized and not consistent across accommodation platforms.

3

pain point

Unbiased third-party speed test information is not available on most accommodation websites.

4

pain point

Internet speed information does not have a central database with the ability to grow as users and companies upload current speeds.


User Personas:

By completing this user journey map I was able to really breakdown the user’s process when using the app. However, not integrating my own designer biases with online shopping was the most challenging part of this process.


User Journey Map


starting the design

Paper Wireframes

The goal for this set of wireframes was to design an initial home page for the internet website and app.

I started the process by creating a list of “must haves” to include in the design. Knowing that a heat map of current locations experiencing fast internet connectivity would grab the user’s attention, I placed it partially above the fold to encourage users to scroll down the page. Gaining inspiration from Airbnb’s app, I also experimented with featuring high-quality images of trending destinations.

Ultimately in Figure Home V1, I brought together the elements I liked from each wireframe creating a clean and cohesive design that also included the “check your stay” search bar front and center for users who already have a location they are interested in staying at.


A carousel from the paper wireframe to highlight trending travel destinations

Digital Wireframes

With the initial paper wireframes drawn up, it was time to put my homepage layout into a digital format using Figma. Using inspiration from the user research, I wanted to create a design that was exciting and easy to navigate. Searching for a new location to visit can be fun but also daunting, so I focused on the users when creating a design that sparked curiosity while making the process as easy for the user as possible. With so many items to check off the list when traveling to a new location, the users needed an app to help them achieve their goals quickly.

The design below highlights a clean and to-the-point layout with eye-catching main elements on the page.

“Check your stay” search bar at the top of the page for users who already have a location they are staying at

An eye-catching internet heat map above the fold to encourage users to explore and stay on the page longer


Low-fidelity prototypes

From the homepage, this user flow features the page showing results from a specific location’s internet speed search. Users are provided upload/download speeds, ping information, and a brief description of what kind of tasks can be done with the current speeds.

From the homepage, this user flow features the educational page informing users what the different internet speed definitions and terms are. The user is provided with upload, download, and ping information, and why it is important for them as a remote worker.

From the homepage, this user flow shows how a user would go about uploading the current speed they are getting at their location, as well as, a link to the educational page for more information on their speed test results.


Refining the design

High-fidelity mockups

With the low-fidelity wireframes worked out, it was time to add some color, typography, and realistic imagery to bring together the branding and consistency of Testyourstay.com.


High-fidelity Prototype

Check out the high-fidelity prototype here.


Accessibility considerations

1

visual design

Using a high-contrast color scheme, this app design supports visual impairments with colors that pass WCAG compliance.

2

large touch targets

Keeping users with motor and/or vision impairments in mind the touch targets throughout the app are large and well separated from neighboring touch elements.

3

ICONOGRAPHY with labels

To ensure that all users can navigate the app easily simple and recognized iconography is used throughout the app with text below for users with screen readers.


going forward

Takeaways

impact

If you’re going full remote then you should invest in a good connection. You’re going to be expected to be on video calls and just get your work done.

—Anonymous remote worker

what i learned

Throughout this project, I wanted to focus on a clean, educational, user-centered design. My biggest takeaway was that sometimes less design is more when keeping the user focused on what they are trying to accomplish with your product. Impactful images and large, specific touch points were vital throughout this design.


Next steps

1

I would like to fully design and flush out the entire app. With a current rise in employees working remotely, the need for information about internet connectivity will only continue to grow.

2

I would like to further work out the opportunities with this website by conducting usability studies as different sections are completed.

3

Once the app has been fully designed I would like to partner with a web developer to get the site live. I can see users all over the world uploading their internet speeds as they travel, creating a substantial database. Perhaps this site would even encourage businesses to invest in faster internet speeds for their customers.


Thank you for taking the time to dive into this internet speed website case study! To review more of my work please continue on to the next case study: Boutique Retail App.

〰️

Thank you for taking the time to dive into this internet speed website case study! To review more of my work please continue on to the next case study: Boutique Retail App. 〰️

Previous
Previous

Boutique Retail App