Plot Twist?

Inspiration

After hearing Ms. Benita's talk about 'choosing our own adventure?', we all related to the anxiety that comes with making decisions in life. This motivated us to think about the question: "What if there was something that could help choose our adventures easier?" Our creation is our answer to this tough question: PlotTwist.

What it does

This website opens up with a conversation, you and a chatbot discuss who you are as a person which will help you make decisions in your daily life. It doesn't just tell you what these decisions are however, it makes a visual storytelling of different paths based on your decisions with small clip-arts and texts.

How we built it

We decided to use the React Native framework for our front-end and the LangChain/LangGraph framework for our back-end as well as generating the AI output using Google's Gemini API. In order to help transfer the AI output to our React app, we used Flask to create a server. We implemented a log-in feature using Auth0 API, as well as its respective libraries that support React.

Challenges we ran into

Running out of tokens to use via Gemini. The difficulty of Prompt Engineering and getting the LLM to generate the correct responses. The difficulty of hosting a flask server on the Jupyter notebook and connecting it with server.py and our react app. It was also quite challenging to use LangGraph to help with LLM memory management (so the LLM remembered details about the user).

Accomplishments that we're proud of

Using Google's Gemini API for the first time and accomplishing whatever we could against its limitations, such as the Google-style illustrations in our output. We were also able to implement a page-flip animation using React in our app.

What we learned

This was our first time working with an LLM model, as well as learning how to transfer LLM output to our front-end. We learnt teamwork and integration of a solid front end and back end. We also learnt to prompt engineer and make classes in order to store and use data effectively.

What's next for Plot Twist?

Linking the Auth0 to our LangGraph, so that we can tie a thread ID to the user's account, ensuring that the LLM memory remains constant and separate amongst other users. Implementing an interface where the user can ask the chatbot questions, and using the chatbot's output we can generate our story output. We also hope to add a feature where the chatbot will prompt the user every week in order to gauge their parameters again, ensuring that its output will also be beneficial to the user.

Built With

• auth0
• auth0/auth0-react
• axios
• base64
• flask
• gemini
• javascript
• langchain
• langgraph
• native
• python
• react
• react-pageflip