About
Project Details
Process
User Interviews
Support and dev
Sales
Marketing
Comparative Analysis
Ideation
Lo-fi wirerframes and iterations
High-fidelity prototypes
Reflection
Admin Panel for data management, marketing and sales
Project Details
I designed an admin Panel for the administrative team, enabling them to perform activities related to data management, analyze sales metrics, and execute marketing campaigns.
Duration
4 months - Summer Internship (May to August 2023)
Tools
Figma
Miro
Platform
Web Application
Role
UI/UX Designer
Collaborated with a diverse team of 20 individuals, including product managers, developers, marketing associates, sales representatives, and support staff.
My Process
I initiated my process by employing research methods such as user interviews, data analysis and competitor analysis . Subsequently, utilizing the insights gathered, I developed personas and commenced my design phase.
Design Goal
The goal is to build a user-friendly interface for the admin team for data management, event creation and to visualize sales activities.
But Why?
The organization comprises various teams, including marketing, sales, developers, and the support team. Each team has distinct pain points and requirements, necessitating a centralized admin panel to facilitate their respective activities.
4 key findings from user interviews
Support team
The support team gets 20+ customer data-edit requests per day, manually updated by developers on the Data Base
Developers
Developers spend significant amount of time fixing these issues, they are unable to concentrate on building new features.
Sales Activities
While the company was rapidly expanding to other cities, the sales team couldn't visualize or track this expansion
Marketing
During school events, there were many marketing campaigns executed through manual processes.
The support and the dev team were overwhelmed
The support team was overwhelmed by daily customer requests and relied on developers to address them via Slack, which added to the developers' workload and hindered their focus on new features.
A glimpse of what they mentioned 🧐
“With increasing customers every day, everybody in the team needs to be self-sufficient to resolve any customer query”
-Support User
“We don’t like the fact that we have to depend on the developers even for small changes to be done”
-Support User
“I’m unable to concentrate on bug fixes and new feature developments due to these requests from the support team”
-Full stack developer
“Every time there is a change in data, I manually edit them on the backend which is not safe to do”
-Frontend Developer
Sales team couldn't visualize/track sales
As the company rapidly expanded into new school cities such as Wisconsin, Indiana, and Illinois, all sales-related data, including the number of listed spots and new leases, was tracked manually on a Google Sheet. This cumbersome process placed a significant burden on the sales team's responsible for its maintenance.
A glimpse of what they mentioned 🧐
“I set the sales goal for the month and track them on this master sheet, we review this every month”
-Sales Associate
“Our main target customers are school students. We aim at expanding to different cities”
-Sales Head
“I wish I could see the impact of my activities. That will make feel motivated to do more”
-Sales Associate
Marketing team ran campaigns manually
During school events, such as the National Collegiate Athletic Association (NCAA) Football season, the team aims to execute marketing campaigns involving push notifications, emails, and UI changes with banners. However, performing these tasks manually for each event proved to be a laborious process, placing undue pressure on developers, marketing personnel, and the sales team.
A glimpse of what they mentioned 🧐
“Omg!! The football season, the time of the year when our business is at its peak. Also, it is the best way we could increase our brand awareness!”
-Marketing Executive
“Brand awareness and sales goals go hand-in-hand and I believe big school events have great potential for both”
-Sales Associate
To learn from our comparators!
Source: G2 Review
I started off by getting a comprehensive list of all the features in the product and its corresponding ratings and reviews by trusted sources (G2). I picked the factors that would be relevant for the my project, the admin panel and explored by signing up for free trials.
Factors I compared and analysed
Freehand sketching is my go-to method for generating ideas.
User flows to understand how everything fits in
Once we had the feature list ready, I developed a structured representation of how users will navigate through the product for the admin panel for each of the use case. This step aimed to provide a clear roadmap, addressing distinct needs and optimizing their workflow within the administrative interface.
Low-Fidelity wireframes testing and iterations
This interface would help the admin team to add, edit, update the property data, seller and buyer data
Version 1
Started off with a table view. Downside - Too much cognitive load for the user
Version 2
Following various experimentations with card and table views, we settled on a mixed layout. The fundamental details are positioned to the left, while additional data is compactly organized into accordions on the right - a set up designed to minimize users' cognitive strain.
Version 3
Implemented two tabs, "Properties" and "Users," to streamline searches based on either property details or the buyer/seller since the users encountered challenges navigating tasks related to user data when the information was previously perceived as exclusively property-centric.
Created tabs for "Properties," "Buyers," and "Sellers" to streamline searches. Additionally, introduced a new section called "Spot Details" for addressing user concerns about information overload when spot details were initially included within property details.
Sales Dashboard
I designed a sales dashboard layout featuring a map on the left and corresponding data on the right. This setup allows the team to readily identify high-performing cities and determine where to focus their expansion efforts.
Version 1
After user testing, I found that the users struggled to relate data on the left to the map on the right, so I swapped their positions
Version 3
Version 2
Through A/B testing with two versions—one featuring a pie chart and the other with pins and legends—I observed that users preferred the pie chart representation. This version proved to enhance data comprehension for users.
Marketing
Under marketing, we added an event manager tool which will help the admin team to creat events and run campaigns whenever there is a need.
Version 1
Event manager is used to create events, that will run marketing campaigns.
Version 2
Users needed some context on what will happen when they set up an event and so I added a left panel that gives them some context
Following multiple rounds of wireframing and user testing, I developed high-fidelity prototypes that underwent several iterations, each enhanced through ongoing testing. Here are some of the use cases and corresponding key features.
The data management dashboard consists of
Property details - Properties listed their parking spots,
Buyers - Who have bought parking spots listed on BuyMySpot
Sellers - Who sell parking spots on BuyMySpot
The admin team should be able to edit/modify this information some upon customer request or under required circumstances.
Editing property data
The support user can disable the spots listed by a seller. They need to authorize this action since it cancels the pending and ongoing leases of that particular property.
Editing user data
The admin team should be able to edit the buyer or seller personal information upon requests
Viewing and editing seller details
The admin team should be able to view sellers' personal information, the list of parking spots they have sold, view its leasing history.
They can also reach out to the seller using the message button on the top.
Sales Health
The sales team should be able to monitor how many spots have been leased , waitlisted per state and city.
Marketing
The marketing section consists of an event manager where the marketing team can set up campaigns for upcoming events and run them for a required period of time
Outcome and Impact
The team built the MVP on a low-code platform called Retool and I was able to witness its outcomes firsthand,
Support team felt self-sufficient
The support team felt self-sufficient to carry out data related queries that came in without depending on the developers.
Developers were able to focus on new features
Developers experienced a sense of relief as the support team became self-sufficient in handling customer requests, allowing the developers to focus on implementing new features instead of addressing customer inquiries.
Sales and Marketing
It initially took almost 4 hours for the marketing team to create one campaign and manually circulate in on email, text messages, and in-app notifications. But now, they were able to create as many campaigns as possible within a few minutes.
Sales dashboard was still in progress, they were using Google Maps API to build the dashboard.
Reviews from the team
“This tool super helpful for all of us, particularly at this point where we are rapidly expanding our business”
-Ian Herdegen, Founder
“The event manager and the data dashboard is seriously saving us a lot of time for the team”
-Jacob Glick, Marketing
“The data management is helpful even for the developers, we don't risk editing data on MongoDB anymore”
-Andrew Wilson, Full-Stack Developer
Reflections and Takeaways
As a sole designer working on intricate use cases involving extensive data has honed my problem-solving skills through this project. This experience has deepened my understanding of design challenges and strengthened my ability to navigate complex scenarios independently.
Ideation is crucial
Sketching and brainstorming prior to diving into digital designs have proven immensely beneficial to me. This process encourages a free flow of ideas, alleviating the pressure of perfection and allowing creativity to flourish.
Requirements are not always clear
UX designers aren't always provided with a clearly defined set of requirements. While challenging, these situations offer an opportunity to push your skills further by delving deeper into the problem and generating a list of useful considerations.
Cross-functional collaboration
Collaborating closely with cross-functional teams such as support, development, sales, and marketing was an invaluable opportunity, enabling a comprehensive understanding of diverse perspectives and fostering synergistic outcomes.