top of page
.png)
.jpg)
CONSOLE DASHBOARD - NAVIGATION
Unified multiple dashboards into one with a single log-in for both internal and consumer users. Conducted tree-testing to establish the initial architecture and added modules as needed. The dashboard now supports insights, content management, and customization across all the new Anewgo 3.0 products.
ROLE
Three months into the role, I had a better understanding of the Anewgo ecosystem and collaborated with the product manager/CTO to evaluate the efficiency of the old dashboard and map out the new navigation. Later on, I collaborated with QA to pinpoint UX/UI issues and developers to aid with the accuracy of implementation.
CHALLENGE
The Anewgo ecosystem requires staff to navigate three separate dashboards, each with its own login, for every builder account, resulting in a complex management process
This confusing system greatly affects Anewgo staff productivity, as customers turn to staff for simple tasks such as editing content or reviewing analytics. Additionally, with all Anewgo 2.0 products being revamped with new functionalities, it was vital that these changes are mirrored in the new architecture. Thus, we took the opportunity to unify the system into a single dashboard with one login, intuitive navigation, and seamless transitions between builder accounts.
APPROACH & IMPACT
A modern and visually approachable dashboard that focuses on seamless and intuitive navigation
I conducted tree testing to evaluate whether the current organization and labeling offered sufficient context for users to make informed decisions. This process allowed me to consolidate the primary actions into four main modules. Additionally, I created a visually approachable style guide and updated the UI to incorporate recognizable elements, focusing on simplifying navigation between modules and builder accounts. To ensure alignment, I utilized Slack to communicate and share design concepts with stakeholders, enabling a quick feedback loop throughout.
Two of the three dashboards have been retired and their functionality has been moved to the 3.0 console dashboard is now being used to support lead analytics, content management, and customization across all 3.0 products.
DISCOVER
BACKGROUND
Why do we need this dashboard?
There are three different dashboards that handle the Anewgo ecosystem: Analytics, Builder Dashboard, and Marketplace Dashboard.
These are commonly used in conjunction with one another so users tend to open multiple tabs or constantly switch between dashboards. These dashboards house mini-dashboards as well that further complicate simple tasks.
.png)
.png)
What are the three current dashboards being used for?
-
Analytics - Leads, insights, and marketing for the My Home App
-
Builder Dashboard - Global content management and app subscriptions
-
Marketplace - Analytics, article management, and agent management for Anewgo Marketplace
TREE TESTING
Conducted tree testing with end-users seeking to improve their dashboard skills to reveal navigtion issues
I designed tree testing flow using Google Forms to evaluate the current navigation structures of the various dashboards. Participants were both Anewgo staff and home builder customer staff who were unfamiliar with the current dashboards' sitemaps. They were then tasked to select the most appropriate category for actions like changing a home’s price or adding new communities.
From the tree testing, the main issues centered around locating
-
Content management versus personalization
-
Global versus app-specific customization
-
Specific lead information
DEFINE
USER FLOWS
Took a step back and looked at the high-level user actions to create the sub-dashboard modules
Based on insights from the tree-testing, I had a better idea of the main user flows but was extremely overwhelmed with the scale of this dashboard as there were so many primary paths to improve and branching paths to consider. I went in circles and created sitemaps of dashboards that were just as confusing as the original one. So I consulted with my manager and he told to just take a step back and look at it from a high level.
I then realized that the top priority is guiding users to the correct sub-dashboard first, before focusing on the details and branching flows within the sub-dashboard. From here, I was able to consolidate it the main console dashboard into just four specific modules based on four primary high-level actions.
.jpg)
DESIGN
In the original UI, Anewgo staff had to open multiple tabs to access the different dashboards as they are commonly used in conjunction. Furthermore, straightforward tasks, such as uploading new content (which customers could handle themselves) were frequently passed to Anewgo staff. Both of these situations, caused by the confusing navigational structure, negatively affect productivity.
Other than this, Anewgo staff also switch builder profiles repeatedly throughout the day when updating content. Due to the lack of breadcrumbs, oftentimes, users lose track of which builder profile they are editing and would have to go back to the homepage to ensure they're in the right profile. This confusion has resulted in mistaken edits.
.png)
.jpg)
MAIN DASHBOARD LANDING PAGE
How might we help users freely navigate between different home builders and sub-dashboards?
DESIGN PROPOSAL AND FEEDBACK
Utilized Slack to get quick and early feedback as I was brainstorming and designing methods of navigation
As I was the sole designer in a fast-paced environment, I leveraged Slack and daily scrum meetings to gather feedback efficiently when proposing new ideas or needing input on some UI. This allowed for quick iterations while also fostering a culture of feedback and communication across teams.
STYLE GUIDE
An on-brand, minimalistic, and visually approachable dashboard
I believe that the willingness to learn and navigate a new interface is largely influenced by the UI. With this in mind, I focused on a dashboard that is minimalistic and visually approachable with a matching color palette. When creating the style guide, especially the color palette, I also accounted for the analytics color schemes to ensure that data visualizations are clear and distinguishable.
I collaborated with developers throughout the implementation process, providing all necessary assets and design specifications.
CONCLUSION
NEXT STEPS
Evaluate efficiency, pinpoint areas with high user error, and integrate new products into the new architecture
-
Conduct user testing to evaluate the following:
-
efficiency of the new navigation across sub-dashboards
-
identify risks of data cross-contamination when users switch builders
-
effectiveness of the sub-dashboard name and description in conveying its functionality.
-
-
Ensure that new configurations, settings, analytics are properly organized into the appropriate sub-dashboards, as the company's product line continually grows,
KEY TAKEAWAYS
Ask for help especially in a team of one
-
Find design allies. Early on, I felt isolated as the sole designer, so I sought out design allies in QA, marketing, sales, and development to help advocate for design during decision-making. Collaborating with them also broadened my perspective whenever I got stuck in a design problem.
-
Utilize communication channels like Slack in presenting ideas, gathering quick feedback, and sharing progress. We have introduced channels in Slack specifically for presenting UI and asking for feedback from our in-house users. I also took advnatage of our daily scrum meetings, which is one of the rare moments when the entire team is present, to conduct live walkthroughs and demos. This not only helped me gather some insights but also ensured everyone stayed informed and up to date.
bottom of page