Tonya AbnaTeamSuccess is a one-of-a-kind customer success tool that allows your customer relationships to grow along with your revenue. Easily monitor, automate and streamline your customer lifecycle. Create more upsell opportunities, and reduce the risk of churn with proactive alerts.
More screenshots & stats »
TeamSuccess was a brand new product started at TeamSupport, so I worked on it through the entire software development lifecycle, from research and planning to design to implementation, launch, and maintenance. I was the lead UI/UX Engineer on the project, but I fulfilled many roles.
The UI/UX decisions behind building this app had two main drivers. First, we wanted to build a first class customer success tool that could compete in the burgeoning market. Second, we wanted the application to work hand-in-hand with our customer support and customer insights tools as a suite of products. We needed to build the TeamSuccess application from the ground up geared towards the user experience for Customer Success Managers, while creating a design system and component library that could be leveraged in the other applications which were geared toward Customer Support Reps and Business Analysts.
The first steps in this process involved research and planning. We performed customer interviews, developed user journeys, user stories, data models, the information architecture and workflow, and researched design patterns, features, and even terminology used for the success industry, while also taking into consideration design patterns and features used in other SaaS industries. This helped to drive each of the decisions around the UI/UX of the application.
Other factors taken into consideration were the business needs behind the project, the maker experience (MX), and the shared needs of the suite of products. For example, for business needs, we followed an agile process to get the product to market as quickly as possible while gaining feature parity with our competitors. For MX, when evaluating different ways to implement a feature, we'd take into consideration the development complexity and the ease of which the code behind the feature could be maintained and extended over time. And for the shared needs, when building the design system and component library we needed to make sure that each element would meet the needs for all applications, not just the success application that we were starting with.
During this process I created mockups, prototypes, and UI/UX requirements for each feature. I helped to guide the technical design, developed frontend code and worked closely with other developers guiding them on the implementation of components and how to use the design system that I developed, and participated in code reviews and quality assurance. In addition to being the UI/UX lead on the project, I often assisted project management in guiding and tracking the progress of the product's development.
Before going to market, we worked with a select group of interested customers to launch an early access program that allowed us to elicit user feedback and make final adjustments before the official launch, making sure that the tools and features were easy to use and understand and provided the desired results of our customers.
Building the TeamSuccess application was success! We were able to get it to market, integrate it with our other products, and build it in such a way that enables us to rapidly develop new or extended features, leveraging the design system and component library. We've also been able to use those same tools to improve the other products in the suite, driving the whole towards a more consistent, easy-to-use user experience.
The TeamSupport industry-leading customer support software empowers SaaS companies to reduce churn and increase NPS scores by promptly resolving tickets and easily collaborating with multiple departments to provide a level of support that creates customers for life.
More screenshots & stats: Application Maintenance, Login Promos Modernization, Advanced Search Modernization, Knowledge Base Modernization, Other Modernization Projects
I worked on every aspect of the TeamSupport application, including doing project management, design, development, and quality assurance. Projects were divided into two categories: Product Support, which included bug fixes, technical debt, and maintenance, and Research & Development, which included modernization and new or expanded features. As the Senior UI/UX Engineer I created the overall roadmap for the company's UI/UX direction, built the design system and component library for use in the applications, created guidelines and documentation and led training sessions on UI/UX and front-end development topics.
The UI/UX Roadmap for TeamSupport that I developed involves taking all products through a Design Thinking inspired workflow, which should align with the SDLC: Research > Strategize > Implement > Repeat. This involved defining roles and responsibilities, setting goals and priorities, and developing a workflow for UI/UX deliverables. It outlined the various avenues of research open to us and when to use each method, the steps involved in using those research findings to define the problems and ideate and prioritize solutions, and the short-term and long-term deliverables expected during the implementation process.
The roadmap was supplemented by extensive documentation on our global app branding and shared components, UI/UX guidelines for components and content, and articles outlining the results from research on topics such as frameworks and architectures, design and UI elements, components and component libraries, and more.
In addition to providing guidelines for the development team to follow, I also led training courses and provided 1:1 guidance for the development team on these topics.
Under the Product Support umbrella, I worked to maintain and incrementally improve the TeamSupport application over time, using the research and guidelines I completed. This included providing bug fixes, UI/UX improvements, and performance enhancements.
Some of the performance boost initiatives I led included upgrading our third party assets, optimizing and minifying assets, improved caching and the usage of CDNs, updating the app to use a system font stack and a singular icon source, and other tasks aimed at consolidating, streamlining, and modernizing the application's code and assets, while improving the customer experience.
In working on bugs and technical debt for the app, I worked closely with the Support and Product teams to analyze our customers' needs and prioritize the development tasks. This included doing extensive reviews of the customer feedback and performing a thorough evaluation of the application's functionality and usability.
Additionally, I worked in a project management capacity, providing requirements and direction to other developers as they worked to improve the product.
Under the Research & Development umbrella, I worked with the development team to update the legacy code, which used a variety of older technologies. We modernized the code to use React and leveraged the global design system and component library that I developed. I worked in a project management and design capacity on these updates, providing UI/UX and functionality requirements, mockups, prototypes, and graphic assets, guiding the technical design, and participating in code reviews and quality assurance.
The goal was not only to modernize the design and improve the user experience, but also to restructure and centralize the code to take advantage of modern coding techniques to improve performance and make the code easier to maintain and grow over time.
When working on the updated designs for these features, I consulted with stakeholders, reviewed customer feedback, bug tickets, and feature requests, performed a competitive analysis, and leveraged modern design patterns for SaaS applications.
In addition to this research and collaboration, I also researched each technology, framework, and component used in modernizing these features to make sure that it met our stringent criteria.
The number one feature of the TeamSupport application, and the most complicated, is Ticketing – the ability for application users and their external customers to create and update support tickets.
More screenshots & stats »
Under Research & Development for TeamSupport, the largest project I worked on was leading the initiative to redesign and modernize the ticket page.
Before starting the redesign, I did extensive research on the existing ticketing features to understand all aspects of the current functionality. I reviewed reams of customer feedback and hundreds of bug reports to learn how our customers were using it and how they evaluated the user experience, what their pain points were with the product, what they liked about it, and what feature requests they had. I also received additional feedback from our Customer Support and Customer Success teams who both use the product themselves and work closely with the customers every day, and so are well versed in the user's expectations.
During the design process I worked closely with all internal and external stakeholders to make sure that the suggested adjustments to the design and functionality met the needs of all affected parties. Key customers were consulted during the design phase and given a sneak peak of the modernized ticket page, so that we could get their feedback on the usability of new or revamped features. The design was driven not just from the user experience, but also from business needs and technological needs and limitations, with the goal to find the best balance in the finished product.
I worked in a project management and design capacity on these updates, providing UI/UX and functionality requirements for around 70 properties on the ticket page, defining their individual functionality and how they interacted with other elements in the application, creating mockups and prototypes, guiding the technical design, and developing frontend code.
This was my most extensive project and it went through several iterations. Unfortunately, before the full development phase started, this project got shelved as the product roadmap was re-prioritized under new leadership. The plan is still to move forward with the proposed design, it is just a matter of having development resources available to assign to the project. When the new ticket page is implemented, it is expected to be a major driver in new sales and reduced churn.
More detail on the web, print, and multimedia projects I've completed can be found in my portfolio. Over 300 projects for over 90 clients are included in the growing list, which can be filtered by employer, industry, tasks completed, and more.
For a more focused view, you can also filter the list to show just my favorites, a selection of the projects that I'm the most proud of, or that were the most fun to work on.
