HobbyMe

Most people overuse social media and the internet to entertain themselves when they have nothing better to do, but what if they did have something better to do?

Comment

Inspiration

We all spend more time than we would like, scrolling mindlessly on social media or the internet, killing our beloved free time with quick entertainment. It is easy to fall into overusing technology when we have nothing else to do at a given moment. What if we did have something better to do with our time? Hobbies help to fill our time with valuable and enriching moments, keeping us stimulated and entertained away from social media. However, not everyone has a hobby, and finding something that fits our interests is difficult. Beyond that, even if we have a hobby in mind, getting started can be a daunting task.

What it does

HobbyMe helps its users find hobbies that are suitable for them. When they enter the platform, they fill out a questionnaire about their interests, free time, physical willingness, and other attributes and are matched with hobbies that may fit them. After selecting a hobby from the list of suggestions, users can view a detailed breakdown of what the hobby is, how to get started as a beginner, and how well it fits them, and can have a Q&A with an AI assistant to ask specific questions.

How we built it

HobbyMe's front end was developed using React and Next.js. We used components to create repeatable activity cards and global styling for the site's general theme. We used React because of the often repeated elements that would be beneficial to develop as components, as well as Next.js's ability to easily send HTTP requests to our Python Flask server and use routing to traverse our web pages. The back end's suggester implemented the OpenAI API tool which takes in the responses obtained from the front end and generates a response to send back to the front end. The server is a Python Flask server, which awaits HTTP requests from the React front end with user responses. After each response, it stores the user data temporarily to be sent to the suggester to give analysis on how well the selected hobby is fit for the user.

Challenges we ran into

  • Learning how to utilize a new technology, both of us, who worked on the front end, had never used React or Next.js before and had slight javascript familiarity, so learning how to create a React app from the ground up was a new and challenging experience. Especially learning the application file structure and how to make the site less static.
  • This was difficult for the person working on the backend because it was their first time doing something like this, which includes obtaining the API key from the openai website, installing the right packages into the virtual environment, and making sure that the API key is placed in the .gitignore file.

Accomplishments that we're proud of

  • The visual style
  • The quality of responses generated by the AI
  • Fostering a collaborative environment with smooth git collaboration

What we learned

  • How to create and modify React components
  • How to send HTTP requests to a Python Flask backend
  • How to utilize the OpenAI API
  • How to create and set up a virtual environment
  • How to download packages for the virtual environment ## What's next for HobbyMe Currently, when the user has suggested a list of potential hobbies for them, the list is created using tags of their interests. In the future, we would like to use generative AI to personally curate the list before the user views the enhanced details on whether or not the hobby is a good fit. We would also expand upon the experience and attempt to make it less linear.
Share this project:

Updates