Inspiration

Our desire to implement our passion for UI design and both data visualization and analysis inspired us to create this web application.

What it does

The T-Mobile Customer Happiness Index is a multi-page dashboard application that utilizes review data from the T-Mobile Consumer Affairs website to display data visualizations and tables with filtering capabilities of 30 authentic reviews.

How we built it

We built our webpage using Tailwind CSS for rapid styling and shadcn/ui for consistent, accessible components. We used JavaScript and JSON for the data structures (sample reviews), the T-Mobile Consumer Affairs reviews website, the Recharts open-source, component-based charting library for data visualizations, shadcn/ui component library, Lucide React icon library, and React (TypeScript/tsx), Tailwind CSS/HTML for the front-end.

Challenges we ran into

We ran into challenges pushing and merging changes to GitHub and implementing both API endpoints to allow for real-time data analysis and Auth0/Firebase for secure user log-ins. We will definitely learn more web scraping and user authentication for future Hackathons and projects.

Accomplishments that we're proud of

We are proud of our team's dedication to creating a user-friendly, functioning webpage with working UI components and generative AI capabilities. More specifically, we were able to created a polished UI with T-Mobile branding, implement both a conversational chatbot and an AI summary generator, and create unique data visualizations (line, bar, pie, and scatter plots).

What we learned

While our team ran into numerous challenges as beginner hackers, we learned a great deal about RESTful APIs, the best file structure practices when creating repositories via GitHub, how to utilize JavaScript/TypeScript for webpage navigation and data structures, and the benefits of using components to reuse and organize elements within a webpage.

What's next for T-Mobile Customer Happiness Index

In the future, we would like to be able to create and call REST APIs to be able to scrape data from different social media and review forums on the internet, such as Reddit (who's policy allows pulling such information). The most ideal option is to be able to connect to live T-Mobile APIs to pull real-time customer reviews. We would like to improve the AI-Powered recommendations embedded within our webpage by automatically generating specific action plans based on each graph.

Built With

Share this project:

Updates