Welk Resorts App
A time-saving, self-service app that allows guests to be in control
Project Brief
Overview
It's six minutes past midnight and you've just arrived at Welk Resorts. You'll be staying there for the next three days. You're running on less than four hours of sleep, you're tired, and let's be honest, you're a little cranky. The last thing you'd want to spend your time on is getting stuck in line waiting to check into your room. Or how about when you finally get into your room, you set your luggage down, and then you head to the bathroom to splash some water on your face, but then... SURPRISE! The faucet isn't working. Who has time for that? No one.
The Problem
Discover ways to automate and/or increase speed of service, which would allow for more time to experience all the amenities available. In return, this would help to increase Net Promoter Scores (NPS) and affect customer ratings and reviews on popular social media platforms (e.g., Yelp, TripAdvisor, Facebook, Instagram).
Role & Responsibilities
UX/UI Designer – Research, Interaction and Visual Design, Prototyping, and Testing
Discovery/Empathize
User Interviews & Guest Surveys
I gathered qualitative data through user interviews and Welk’s guest surveys in order to better understand user desires, actions, inclinations, and pain points. The following quotes were gathered from both those interviews and surveys:
Standout quotes gathered from user interviews and guest surveys. Click image above to enlarge.
Heuristic Analysis of Competitors
Performing a heuristic analysis on Welk competitors was eye-opening. I learned that there is “method to the madness” in creating effective usability in user interfaces.
I evaluated three top competitors in the timeshare/hospitality industry—Wyndham, Marriot, and Hilton. My focus was on the following three Usability Heuristics for User Interface Design:
Heuristic analysis of competitors. Click image above to enlarge.
Affinity Map
From the data collected during the user interviews, I was able to build an affinity map by organizing the information into smaller groups and themes.
Affinity map. Click image above to enlarge.
Empathy Map
I dove deeper into user needs by examining what they think, feel, say, and do, as well as what I observed as their pains and gains. The following two empathy maps were created:
Empathy Map #1. Click image above to enlarge.
Empathy Map #2. Click image above to enlarge.
Analysis/Understand
User Personas
The target users were broken down into two personas. While designing, I needed to keep these personas in mind while working towards a solution.
Persona #1: Non-Welk Guest
Persona #1. Click image above to enlarge.
Persona #1's Pain Points:
Persona #2: Welk Guest
Persona #1. Click image above to enlarge.
Persona #2's Pain Points:
Solution & Hypothesis
From all the research and information I gathered, these was the solutions I formulated:
Concept/Ideate
“How Might We” (HMW) Statements
With a hypothesis in hand, I prepared the following "How Might We" statements to help keep me on track towards designing a solution for the user:
Ideation of "How Might We" (HMW) statements. Click image above to enlarge.
User Stories
What are the goals and tasks that users need to accomplish and why? This is more about functionality versus the actual design.
Click image above to enlarge.
Information Architecture/Sitemap
How should the product/app be organized and structured? I needed to keep in mind ease-of-use navigation. This information architecture/site map shows the hierarchy and all the pages of the product/app.
Information architecture/site map. Click image above to enlarge.
User Flow
It’s important to know the journey or flow a user goes through to accomplish their goals while using the product. Below is an example of the flow for viewing an active service request:
User flow: view active servie request. Click image above to enlarge.
Design/Iterate
Sketches & Low-fidelity Wireframes
Initial sketches of what the product can look like were extremely helpful in making an idea much more real. Sketches are quick to create and are not meant to be perfect.
Sketch wireframes. Click image above to enlarge.
Next, I drew slightly more refined sketches in order to then create a low-fidelity prototype to be used in guerilla usability testing.
Low-fidelity wireframes. Click image above to enlarge.
Guerilla Usability Testing
In order to receive quick feedback on the design/prototype, I conducted guerilla usability testing with five people—some I knew, others were strangers—at different locations.
Biggest insights that should be considered and carried over for the final designs:
High-Fidelity Screens
Based on the feedback from guerilla usability testing, I created high-fidelity grayscale wireframes and mockups with actual copy and branded fonts. It mapped out the product’s layout, content, and hierarchy. I personally tested every red route and all the possible user flows with this prototype.
High-fidelity wireframes. Click image above to enlarge.
Prototyping/Testing
Prototype
Once I felt the product user flows were ready to test again, I then added color and imagery to the grayscale high-fidelity screens. I wanted to create a prototype that was pretty close to looking like a final, official product/app. Please feel free to try the prototype below that I tested with users.
Working prototype built using Marvel App.
Final high-fidelity screens. Click image above to enlarge.
Usability Testing
In the span of three weeks I was able to perform usability testing on the product prototype with four participants. Three were the original users interviewed and one user was from the guerilla usability testing. Each usability testing session lasted between 15–45 minutes. Participants were asked to complete the following tasks:
A few key insights from the usability testing:
Concluding Thoughts
Various screens in different sizes—desktop and mobile. Click image above to enlarge.
Outcome and Next Steps
At the beginning of this project and process, I thought that my initial ideas were maybe a bit too simple. As a reaction, I decided to tackle a bigger undertaking—designing a company’s app. I started to think that maybe I might’ve bitten off more than I could chew. But I kept an open mind and didn’t overthink everything. I had to remind myself during the process that ideas can and will shift based on research gathered. Narrowing down a plan helped to make a big, broad idea a little easier to comprehend and digest so not to get overwhelmed. I learned to trust the process.
I presented this project to my department, the Creative Director, Director of Digital Marketing, and VP of Digital Innovation & PR. A dialogue was started on the possibility of making this app a reality.
Thank you for reviewing this case study. If you have any feedback, questions, or comments you'd like to share, you're more than welcome to!