ai_voicebot made at 42 Abu Dhabi for InnovateX organised by the UAE MOI.
InnovateX AI VoiceChat Solution
Welcome to Tesseract, your gateway to a new dimension of accessibility! Tesseract, named after the four-dimensional cube, embodies our vision to empower people of determination and senior citizens in navigating the UAE Ministry of Interior's website effortlessly. This project was conceived and developed by Salim Hamzaoui and Deffo Ngankam Steve at 42 Abu Dhabi, as part of the InnovateX hackathon organized by the UAE Ministry of Interior.
While the original website may offer some accessibility features, integrating an AI vocal personal assistant like Tesseract can significantly enhance the accessibility and usability of the website. Here's why:
Natural Language Interaction: Tesseract allows users to interact with the website using natural language commands, providing a more intuitive and user-friendly experience compared to traditional accessibility features.
Customized Assistance: The AI vocal personal assistant offers personalized assistance tailored to the specific needs and preferences of each user, adapting its responses to best support individual users.
Dynamic Navigation: Tesseract dynamically navigates through the website, responding to user queries and providing real-time guidance as users explore different sections or perform various tasks.
Enhanced Efficiency: Users can quickly and efficiently navigate the website using voice commands, reducing the time and effort required to access information or complete tasks compared to traditional accessibility features.
Continuous Improvement: The AI vocal personal assistant can evolve and improve continuously based on user feedback and emerging technologies, ensuring ongoing accessibility enhancements.
Comprehensive Support: Tesseract provides comprehensive support across a wide range of tasks and interactions, assisting users at every step of their journey on the website.
Cross-Platform Compatibility: Tesseract offers cross-platform compatibility, allowing users to access the website's features and services seamlessly across different devices.
User Empowerment: By providing users with an AI vocal personal assistant, we empower them to navigate the website independently and confidently, taking control of their browsing experience.
The existing user interface of the UAE Ministry of Interior's website poses significant accessibility challenges for people of determination and senior citizens. Traditional navigation methods may be cumbersome or impractical for users with disabilities or those less familiar with technology.
Tesseract addresses these challenges by introducing a voice-based interaction system, allowing users to navigate the website using natural language commands. Our AI-powered chatbot, customized with ChatGPT 3.5 Turbo, provides guided navigation, information gathering, and text-to-speech capabilities to enhance user experience and accessibility.
The existing user interface of the UAE Ministry of Interior's website poses significant accessibility challenges for people of determination and senior citizens. Traditional navigation methods may be cumbersome or impractical for users with disabilities or those less familiar with technology.
Tesseract addresses these challenges by introducing a voice-based interaction system, allowing users to navigate the website using natural language commands. Our AI-powered chatbot, customized with ChatGPT 3.5 Turbo, provides guided navigation, information gathering, and text-to-speech capabilities to enhance user experience and accessibility.
We chose Nuxt.js for its server-side rendering capabilities, which improve SEO and initial load times, crucial for accessibility. Vue.js provides a robust framework for building dynamic user interfaces, complementing Nuxt.js perfectly.
Node.js powers the backend, enabling server-side logic and API integrations. We opted for pnpm as our package manager for its efficiency in dependency management and faster installation times.
TypeScript enhances code quality and maintainability by introducing static typing, reducing bugs and improving developer productivity.
Tailwind CSS offers a utility-first approach to styling, allowing us to rapidly design custom interfaces without the overhead of writing traditional CSS.
Given additional time and resources, here are areas we would focus on to further enhance Tesseract:
To install and run the InnovateX AI VoiceChat Solution, follow these steps:
Clone the repository: https://github.com/shamzaou/hackathon_moi_tesseract.git
Look at the Nuxt 3 documentation to learn more.
Make sure to install the dependencies:
# yarn
yarn install
# npm
npm install
# pnpm
pnpm install
Start the development server on http://localhost:3000
npm run dev
Build the application for production:
npm run build
Locally preview production build:
npm run preview
Once the development server is running, open your web browser and navigate to the specified localhost address. You can then interact with the AI voice chat solution by following the prompts provided by the chatbot. Use your voice to navigate through the website, complete applications, or access services offered by the Ministry of Interior.
Contributions to the InnovateX AI VoiceChat Solution are welcome! If you would like to contribute, please follow these steps:
git checkout -b feature/new-feature
git commit -m "Add new feature"
git push origin feature/new-feature
Thank you for considering the InnovateX AI VoiceChat Solution! If you have any questions or feedback, please don't hesitate to reach out to us. We hope our solution contributes to enhancing the accessibility of the UAE Ministry of Interior's website for all users.