- ๐๐ป Live Preview
- ๐ฅ Video Walkthrough - Kaltura
- ๐บ [Video Walkthrough - YouTube] (https://www.youtube.com/watch?v=zMLe1_y9GXQ)
This document outlines the final version of the prototype for "Accademium", specifically focusing on the Orientation Survey component. This prototype represents the next step in the design process, evolving from a high-fidelity click-through prototype created in Adobe XD to a fully interactive application developed with React and TypeScript.
The primary aim of this prototype is to demonstrate the complex type of interactivity within the Accademium platform. It showcases how user responses are handled, stored, and used to provide personalized recommendations for study fields.
- Users interact with an orientation survey designed to capture their preferences, strengths, and interests.
- As users progress through the survey, their responses are stored in the local state of the application.
- Upon completing the survey, the local state (containing the user's responses) is sent to the OpenAI API.
- The AI model processes the responses and generates personalized recommendations for study fields based on the provided answers.
- After receiving initial recommendations, users can refine their results using the "Randomize" button.
- The "Randomize" button, represented by a dice icon, provides an additional set of three recommendations aligned with the user's survey responses.
- Enhances the visual and interactive elements from the hi-fi prototype, ensuring a polished and engaging user experience.
- Utilizes intuitive design principles to guide users seamlessly through the orientation survey and recommendation process.
- Captures and manages user responses in real-time, maintaining data accuracy and security throughout the survey interaction.
- Enables immediate updates and feedback based on user inputs, enhancing responsiveness and user satisfaction.
- Employs OpenAI's advanced models to analyze user data and generate personalized study field recommendations.
- Provides tailored suggestions based on user preferences and survey responses, aiding users in making informed academic decisions.
- Introduces gamified elements such as the "Randomize" button, represented by a dice icon, at the end of the survey.
- Allows users to explore alternative study field recommendations aligned with their interests, enhancing engagement and satisfaction.
- Enhances user control by providing options to refine recommendations, promoting a personalized and enjoyable experience.
You can access the prototype directly from this link.
Alternatively, you can run the prototype locally:
- Navigate to
accademium-orientation-survey
folder. - Open a terminal (e.g., Git Bash) and ensure you are inside the
accademium-orientation-survey
folder. - Run
npm install
to install the necessary dependencies. - After the installation is complete, run the command
npm run dev
in the terminal. - Open your preferred web browser and go to
localhost:5173
to access the prototype.
The application utilizes the OpenAI API, and each API call costs approximately ~$0.01. A typical session generally totals around ~$0.02 due to making two separate calls - one for the initial study field recommendations and another for the randomized study field recommendations.
The application currently operates within a budget of approximately $5 dollars, so please use it sparingly.
Additionally, if you are running the application from a location other than the live preview link or the folder provided in the graduation hand-in, you will need to generate your own API key for the OpenAI API.
For further instructions on generating an API key and additional information on usage guidelines, please consult the OpenAI documentation.
- Implement additional gamification elements to further enhance user engagement and interaction.
- Enhance AI capabilities to provide even more personalized and accurate recommendations.
- Gather user feedback to continually refine and improve the prototype's usability and functionality.