Case Study

Basemap Desktop App

This major overhaul of the Basemap Desktop App allowed us to address device–specific user needs for an overall better user experience.

Project hero image

Understanding the

User's Pain Point

Basemap's Desktop App is the sister to it's mobile app. While the desktop app utilized a different user interface, user-created assets such as photos, markers, and drawn objects are shared between apps allowing the user to access and manipulate their saved information from multiple platforms.

Unfortunately due to limited resources, work on the desktop app fell behind - creating disparity between the mobile and desktop apps, including missing features and outdated aesthetics & interactions.

Image demonstrating the user's pain point.
Image demonstrating the business opportunity.

The Business

Opportunity

By overhauling the desktop app, Basemap had an opportunity to re-examine and plan for how users utilized platforms differently while also updating the app to include revenue-driving features, such as hunt research and social sharing.

My Role

As UX Designer I drove the effort to overhaul the desktop app from the ground up — working with both CEO Jeffrey Balch and the desktop development team.

UNDERSTANDING THE CUSTOMER JOURNEY

After reading through user statements & app reviews, as well as performing informal interviews with users, I began to identify underlying differences in how users engaged with our desktop and mobile platforms differently throughout their journey. To this end, I created a customer journey map in the effort to better understand user touchpoints throughout their journey, both before, during, and after purchase. This not only allowed me to better analyze user interactions with the app, but also helped identify user pain points and provide specific guidance on opportunities for improvement.

IDENTIFYING USE CASES FOR KEY FEATURES

With a firmer grasp on which features in the desktop app were providing challenges to our users, and the impact on their customer journey, I did a deep dive into the use cases for each feature. By doing so, I was able to specifically identify which features were in need of complete overhaul (or addition), and which features merely needed updates. Our hope was to address a wide variety of issues quickly and concisely from major issues, such as user frustration at the absence of the Location Sharing feature on desktop (as it already existed on mobile), to the smallest details, such as improving the variety of map markers available in our existing tool sets.

WRAPPING MY HEAD AROUND HUNT RESEARCH

Finally, I needed to wrap my head around the Hunt Research that Basemap offers as a paid additional feature. This data, provided by a third party, allows hunters to understand the specific "tag" details surrounding the strict hunting regulations in each state by a number of variables from animal type to number of prongs on an antler, et al;. These tags can be purchased or awarded to hunters allowing them to hunt their specified pray during the appropriate hunting season according to each state's laws. Hunters face very serious repercussions for violating these laws and as such it is important that we make sure this information is both accurate and comprehendible.

As I felt that there were significant improvements to be made to this paid feature, I worked to understand what this hunt research entailed in my effort to make sure I provide visualization of the data in a way that both provided our users with confidence and delighted them with an interactive and easy-to-use interface. I also believed this was an opportunity to outshine our competitors who (in my opinion) were not providing optimized experiences for their users in regard to similar data.

design

applying what we learned

Because this was a nearly complete overhaul of the user interface, I started by earmarking features which we would be reusing, both for ease of economy, and more importantly, to help reduce the risk of cognitive overload and user rejection of existing mental models. Then I began the process of building out the new interface with the end goal being an interactive prototype.

Ideation and

Design Concepts

As we were reusing/redesigning a few key pre-existing elements — and due to the massive effort this overhaul entailed — I began my concepting process directly in Adobe XD.

I focused on creating a few new concepts for each of the most heavily used desktop features, including the primary menu, search, and hunt research. Once I had a few concepts I was happy with, I would review with stakeholders to finalize direction.

Image demonstrating the design concepts.
Image demonstrating hi-fi concepts and/or prototypes.

Hi-fis and

Interactive Prototypes

Once we felt that the overall design concept for the desktop app was solid, I worked toward tieing all of the features together in an interactive prototype that would allow for a holistic walk-through for the development team. Under normal circumstances I would test a prototype, but due to lack of time and resources, it was decided that we would move ahead without testing.

development

handing-off the final designs

With stakeholder approval on moving forward, I made a few final revisions to the design and reviewed with desktop development team. During review we were able to cover any questions about functionality, linking, and design elements.

Development and

Rollout

One of the greatest challenges with handing off a project of this size to a development team is the sheer number of moving parts. To help ease the process, I provided step-by-step instructions for the prototype walkthrough to aid developers in referencing the various features. Additionally, I created a "cheat sheet" of icon assets with links to their locations. I also created and followed strict naming conventions for ease of discovery.

Fortunately, the desktop development team was on-site and I was able to interact directly whenever questions or concerns needed to be addressed.

Image demonstrating development process.

The final

Product

While an effort this large never ends up looking quite exactly as you imagined it, I was overall very pleased with the final outcome. This was a task of epic proportions for a small development team, and they did a fantastic job bringing it to life.

Slideshow of images showing final product.

Before updating the Basemap Desktop app with new features, we first needed to make sure we were optimizing the map area [top, left] by reducing clutter and unnecessary screen cover.

We wanted to make sure that users were able to quickly and easily update their subscription and access their user information [top, right].

Lastly we wanted to make sure that our primary app navigation menu [bottom, left] and our saved objects menu [bottom, right] were easy to locate and operate independent of each other or simultaneously, depending on the user's needs.

Slideshow image 2 showing final product.

The primary menu (located in the black bar on the left side of the map screen) is the location where all of the apps main features live.

Perhaps our most heavily utilized feature, the map tools allow users to create new objects [top, left] and to edit those objects [top, right] — which is why we also have the additional quick access toolbar which sits in the top left of the map at all times.

We also added our subscription-based sharing feature [bottom, left] to bring the app into parity with our mobile experience, allowing users to connect and share locations and objects with friends.

Lastly, we made updates to the existing Layers, Settings, and Map Import/Export features [bottom, right] for improved usability and aesthetics.

Slideshow image 3 showing final product.

Perhaps the most important update, the Hunt Research feature, which requires a separate subscription, was a complete overhaul.

Our first objective was to give the user back as much map real estate as possible, as the feature had previously taken up nearly a third of the screen. To this end we updated the filters to a horizontal dropdown menu bar at the top of the screen [top, left]. This allowed the user to view each filter independently [top,right], or hide the filter bar completely using a toggle switch.

Because of the extent of the changes we made to the filter system, we also added pop-up tutorial bubbles to help guide the user through their experience as they interacted with it [bottom, left].

Finally, we created a user-friendly data visualization window that the user could open and close as needed, or quickly switch between data sets with a quick click of the right-most "Unit" filter [bottom, right.]

Business Impact and

Key Learnings

This was my last project with Basemap. While I loved the challenge of overhauling the entire app (as it gave me the opportunity to really address the user's needs in an organic and holistic manner) I was disappointed that I would not be around to see the impact the final design would have. I do, however, believe that Basemap's stakeholders gained an understanding of how quickly tech-debt can build up when a platform is neglected and I hope that moving forward they will be able to maintain and update the desktop app on the same timeline as they do with mobile.