top of page
Interactive Map
for Mobile
Hello Network is a company that offers tailored incentives, gift cards, and reward programs to support local businesses and strengthen community ties between consumers, merchants, workers, and employers.
In the spring and summer of 2022, I had the opportunity to work on a new feature for Hello’s mobile app: an interactive map that helps users effortlessly locate businesses of interest. Collaborating closely with Hello’s Head of Product, I took charge of the strategy, research, and the complete UX and UI design for this feature.
01.
The Problem
After purchasing an incentive offer, Hello users received a static list of participating businesses where they could spend their balance. However, this format lacked the flexibility and convenience needed for users to access it quickly while on the go.
02.
The Goal
Our goal was to create a seamless experience for users to quickly locate participating businesses, find directions, and effortlessly check their remaining balance available for spending at these locations.
“My Account” page
03.
Understanding
the Context
I was initially assigned the redesign of Hello's customer account page. It is where users can find their balances and update certain personal information such as email address and password.
As I was auditing the page and reviewing the business and user objectives for it, it came to my attention that an increasing number of users were complaining about not being able to easily find where they could spend their balances. Many didn't remember to check their customer account page before going to a store and found out with frustration while trying to pay that it wasn't a participating business.
Initial product summary
Some of our most frequently asked questions
04.
Identifying Needs
I wanted to gain a deeper understanding of our users' feedback, but budget and time constraints made it impossible to conduct direct user interviews. To bridge this gap, I turned to our Customer Service Manager who engages daily with our customer base and has firsthand knowledge of their concerns and frustrations. Collaborating with him allowed me to capture a more accurate picture of our users’ needs and pain points, even without direct interviews.
With the goals to uncover the most pressing issues and identify users' needs in mind, we managed to compile a list of the most recurrent questions our users had been sending us.
05.
Addressing User Needs
The next question I asked myself was "How are we currently addressing our users' needs with the products and resources at our disposal?"
Hello interacts with its users via four main channels: a transactional website, a native app, SMS notifications and newsletters, and finally customer service. Using a Venn diagram, I sorted user needs according to the channels that are currently meeting them.
I soon realized that some needs could be diverted away from customer service to either Hello's transactional website or its native app for a more seamless user experience.
User needs diagram
Priority tabe
06.
Prioritizing User Needs
By evaluating each user need by importance and frequency, I was able to identify the most pressing ones:
1) viewing account balances, and
2) understanding where to spend those balances.
07.
User Journey
I mapped out key user journeys to uncover opportunities for improvement. The goal was to understand the process from the moment a user purchases an offer to when they redeem it at a participating store.We uncovered several friction points but chose to prioritize the steps where the previously identified user needs could be addressed most effectively. It became evident that the Hello mobile app was the ideal solution, as it caters to users on the go who need quick access to their balances and information about participating businesses.
User journeys
Mid-fi design iterations
Prototype 3.1
09.
Usability Testing
An initial prototype was presented to our development team to gather their feedback.
Key Takeaways:
• Developing the interactive map might take longer than expected, potentially delaying the first version's launch.
• There was no option to sort businesses by proximity.
Adjustments Based on Feedback:
• The interactive map feature was postponed to a future version to avoid delaying the improved app’s initial release.
• We added a button allowing users to sort businesses by proximity.
Next, we conducted a usability test with five Hello employees using the revised prototype. Our main question was “How do users navigate the mobile app to discover participating businesses?”
Findings:
• Navigation through the app was smooth and intuitive.
• Users were unsure if they could select multiple business categories at once.
• There was no way to search for a specific business.
• Some business categories were unclear (e.g., mixed businesses, services, miscellaneous, etc.).
Further Improvements:
• We added a label in the dropdown menus indicating that users can select multiple business categories at once.
• We decided to incorporate a search bar in a future app version, allowing users to find specific businesses.
• In the next update, we will refine our store categories to better align with users' mental models and expectations.
FINAL DESIGN
10.
Seeing Balances and Stores at a Glance
When users open the app, their balances are displayed by promoter. While organizing them by card would feel more intuitive, as it is possible to have more than one Hello card, the current approach aligns with marketing requirements. To enhance flexibility, we plan to introduce a toggle button in a future release, allowing users to choose how their balances are displayed.
On the “Where to Spend” page, users can seamlessly switch between a list view and a map view of stores linked to a specific balance. Additionally, they can filter stores by category and proximity, provided geolocation is enabled.
Main screens
“Where to Spend” flows
08.
Visualizing Balances and Eligible Stores
Before finalizing the decision to integrate this feature into the Hello mobile app, I first explored how user balances and participating stores could be displayed in the My Account section of the Hello website, as originally planned. However, as the requirements became more defined and the design grew more complex, it became clear that a mobile app experience would be a better fit.
11.
Future Features
To enhance the user experience, we plan to introduce several new features in a future release. These include the ability to refresh the store list by pulling the screen when users change locations, displaying the user’s current position on the map with the option to recenter it, and showing store locations within shopping malls, among other improvements.
bottom of page