Ryobi Hyper Charger

Client

TTI // Home Depot

When

July- November 2022

Location

Anderson, SC

Role

Interaction, Visual Design, Prototyping, Testing, and Development hand off

This was my first solo project as a UI/UX designer for TTI. It is an accessory app to the Hyper Charger Product. The goal of this project was to identify areas in which the app could improve the use of the product.

In the App Store as of Nov. 17th, 2022.

Context

TTI is global company that owns many power tool brands, including RYOBI. They are moving towards integrating apps and digital interfaces into their new products.

I was half of the UI/UX team at TTI

At a company with branches all around the world and over 50k employees, I was one of two UI/UX designers. I was responsible for leading UI/UX design across all brands, including all apps, digital interfaces, updates, and design systems.

During my time at TTI, I learned an immeasurable amount. Some of my achievements include:

Forming the department: Since there were only two of us and we were both recent college graduates, we didn't have a Director or Senior designer to provide us any guidance. We pushed ourselves until we made up for that lack.

Worked on the highest profile projects: TTI was expanding into new markets when I joined. We worked on the first global project and the first product where the app was essential to the use of the product.

Established a design system: This helped keep designs consistent in look and feel across all apps. It also helps designers and engineers to work more efficiently.

Project Background

Project Managers for the Hyper Charger decided that the product could benefit from an accessory app. The Hyper Charger and its app were created in response to user feedback from prior chargers.

I was given the project in June, the charger was set for mass production by November, and the app had to be sent to the developer by mid October. Due to the expedited timeline of the project, the research and functionality was, for the most part, provided to me by the Project Managers and Engineers.

Research ascertained that the users wanted to know as soon as the batteries finished charging without having to check the actual battery regularly until it's finished charging. The app solves this problem by alerting the user as soon as the battery is fully charged, wherever they are. We wanted to give users time back.

Originally, the Project Managers wanted to eliminate the secondary function. I felt it was important to keep the secondary function in order to increase the value and usefulness of the app, so I designed multiple different possibilities for replacement and presented them to the team. They saw the value for the user in adding the charging runtime to the app and we moved forward with that design.

Development Process

I created high fidelity prototypes in Adobe XD specifying what the product would look like in each scenario. I created components and a Sticker Sheet before marking all screens for export, setting them for development review, and making links. I sent the Developer a document containing all of the prototype links, as well as an intent document.

After sending these documents to the engineers, I stayed in constant contact with them through Slack as they developed the app, making sure every interaction was accounted for.

XD Prototypes

Intent Document