A mobile app design to accompany the Texas Highways website

Client: Texas Highways Magazine

 

1. summary

Team

Mary Beth Garrido (UX/UI designer)

Joan Henderson (Director)

Mark Mahorsky (Creative Director)

Andrea Lin (Publisher)

Emily Stone (Editor)

Tools Used

Adobe XD, Photoshop

Problem Statement

Texas Highways Magazine provides readers with a curated guide to the state’s cities, small towns, hidden gems, and natural wonders. Stories focus on Texas’ scenic, recreational, historical, cultural, and ethnic treasures accompanied by strong photography highlighting the state’s natural beauty. 

The current responsive version of the website was not user friendly, and they would like a more user-friendly mobile app version to showcase Texas Highways articles and content.

Dates

January - May 2019

Design Process

The design process was based in design-thinking and empathy for the user:

Solution

Over the course of 3 months, I worked with Texas Highways Magazine to design a mobile application that provides a more holistic view of the magazine's content. My designs utilized the magazine's existing resources and personalities to create a curated user experience driven by artificial intelligence. My research ensured my designs are competitive with existing travel apps and user habits.

 

2. exploration

Independent Research + Defining Goals 🔬

I soon discovered that travelers crave a personalized mobile experience. This can be achieved through the use of AI.

Facebook and YouTube are the frontrunners for media. 66% of travelers watch online travel videos when they’re thinking about taking a trip, and 65% watch when they’re choosing a destination. (Source: Google Travel Analytics)

The Texas Highways app needs an inviting homepage design with simple navigation that is also social media-friendly. Furthermore, featured Texas Highways Videos will be a driving factor in our user’s travel decision making.

• How and why people use travel-based apps

• What data they find most important

• How they respond and react to feedback and alerts

• What dashboard elements would be the most useful

What about the Texas Highways Audience? 

Based on user data provided by the magazine, I was able to uncover existing user habits. I used this information to shape the needs of the target audience and influence my designs.

3. empathize

Who are the Users? 

Based on my independent research, I created two separate personas and scenarios as a springboard for my design. The first, mid-twenties couple on a weekend trip, and a family of four on their yearly Spring Break adventure.

 

"We love visiting hole-in-the-wall restaurants and local hangouts."

"With kids, it's not always easy to have time for yourself to plan a trip."

 

4. define

Synthesizing Insights + Finding Solutions  

Since I am designing an app for passive readers and active travelers, I focused on understanding how users use travel-information-based apps and what information was most valuable to them. This helped define the features and functionality of my designs. In summary, some of the insights are:

Most important metrics: Reviews from reputable sites like TripAdvisor and Yelp are king. They are what drives users to make decisions.

Personalization is critical: Users expect modern apps to "read their minds" and predict their next steps for them, or at least promote targeted content.

Efficiency is important: Families on the go and busy users don't have time to waste while planning a trip.

Dashboard needs: Featured video and social media widgets are desired and vital to retaining and spreading information in travel apps. The homepage should also feature direct gateways to relevant articles driven by AI through tagging (possibly durring the onboarding process).

Design: The app's design should also match the current branding look and feel of the Texas Highways website.

I proposed a mobile app concept built on customizable travel itineraries featuring Chet Garner, our Highways Hero 🤠

The app's travel suggestions would be inspired by user-inputted data via the onboarding stage. My priority became gaining the user's trust using existing assets. To do so, I utilized the persona of Texas Highways Magazine's Chet Garner. Chet is a long-time trusted source of travel recommendations across the state of Texas.

An established Texas Highways icon, I recognized Chet to be as an ideal personality for the Texas Highways travel guide role. As a trusted supplier of outstanding content, Chet Garner's ranked day-trip itineraries provide the content we've been looking for. They will serve as a guide for our users towards their next adventure. This persona could also be substituted by a more general 'Editor's Picks.'

4. prototyping

 

User Onboarding  😄 👋

As a springboard for my designs, I explored the UX/UI of many of the top travel information apps including Air BnB and Google Trips. Once my information architecture was defined, I turned my thoughts into wireframes in Adobe XD.

Armed with my design interface needs, user personas, and supporting research, I refined my ideas which were internally validated during our bi-weekly team meetings. If given more time, this stage of the process could have been improved with LEAN UX methodology to minimize initial scope, and external validation testing + design iteration.

Low - Fidelity Wireframe

Moving forward with high-fidelity...

Progress on my wireframes was presented to the stakeholders for feedback and iteration. Ideally, I would be able to capture feedback from Texas Highways readers as well. Perhaps in a future revisitation. Given the circumstances and tight timeline, I decided to move forward with a higher fidelity prototype before it was presented to the public.

Applying Look n' Feel  🎨

I wanted to utilize the website's existing color palette of black, aqua, and tangerine for the final app. For fonts, I took a cue from the magazine's digital flipbook.

High - Fidelity Screens

5. final screens

User Onboarding  😄 👋

 

Welcome to the Texas Highways Daytripper App! Here I introduce you to the app’s purpose. You also meet the famed Daytripper himself, Chet Garner, & learn why his endorsements matter.

Our users are expecting a personalized app experience powered by artificial intelligence. (Source: Google Travel Analytics) Users are prompted to enter interests which will later be used to provide personalized “smart” suggestions.

App Homepage  🏡

I created a custom homepage for users after they entered their interests. Here they are met with a global search, video clips, articles, memories, custom itineraries, places, and events tailored just for them.

Around 65% of travelers watch online travel videos when they’re thinking about taking a trip and choosing a destination. (Source: Google Travel Analytics). Nostalgia is a driving force. 44% of Millennials are likely to revisit favorite family destinations. (Source: Google Travel Analytics)

App Navigation 🧭

The global search categorizes users' results into relevant city restaurants, events, articles, hotels, and trips. These can be further sorted by "Near Me" or "All."

Travelers most frequently use their mobile devices to research activities or attractions, to locate shopping areas and restaurants, or to look up directions. (Google Consumer Insights, 2018)

Chet Garner’s data-based curated picks for you are signified by the Daytripper Stamp of Approval.

Custom Routes 📍

I broke trip itineraries down into individual checkpoints. These checkpoints feature a short description and review. They may be saved individually or as a group.

'Related Destinations' near the bottom prompt users to explore the app further.

Trips + Lists  🧳

Individual restaurants, events, hotels, places, and entire itineraries may be added to a Trip or List.

Trips and Lists (active and other) may be found in their designated tabs, as well as the ability to create new ones.

 

6. reflection

Lessons Learned  🤔💭

User data on a small scale...

As the only UX/UI designer, it was difficult to collect user data on a large scale. For the most part, I resorted to secondary research about mobile travel habits from reputable sources and the magazine itself.

Ideally, I would leverage data from user interviews to create my user personas and compile a journey map. I would love to test my prototype using RITE methods and tweak the final design as needed in a revisitation of this project.

The Texas Highways Magazine mobile app version 2.0 was launched in 2019, you can view it here. An official Chet Garner The Daytripper Field Guide mobile app was launched in 2020, you can view it here.

App Advertisement Mockup:

Contact me

© 2020 Mary Beth Garrido