Genome

• 

  Landing page

• 

  Sign-in page

• 

  Upload page

• 

  Dashboard page

• 

  AI Analysis page showing genetic markers info & whatnots

• 

  Recommendations page

• 

  Insights page

• 

  User resources page

Inspiration

The idea for Genome was sparked by the growing curiosity around personal health and how generative AI can unlock insights around genetic data in particular. There was an opportunity to bridge the gap between complex genetic science and everyday understanding. This hackathon gave us the perfect stage to create something impactful—an intuitive tool that empowers people to make informed health decisions through personalized genetic insights

What it does

Genome is a web-based genetic risk assessment tool that uses AI to analyse users' genetic data, providing info on extracted genetic markers and personalized health insights with actionable recommendations, through an intuitive interface. The application features:

1. Secure data upload for genetic information
2. AI-powered analysis of genetic markers using Google's Gemini AI
3. A comprehensive dashboard displaying overall health scores and key risk factors
4. Detailed analysis of specific genetic markers and their implications
5. Personalized health and lifestyle recommendations
6. Interactive visualizations of genetic data and risk factors
7. Privacy-focused design with local storage for data persistence

How we built it

Genome was developed using a combination of modern technologies and iterative design processes:

1. Frontend Development:

• Next.js with App Router for client & server-side rendered React components
• Tailwind CSS for responsive, customizable styling
• Framer Motion for smooth, engaging animations

1. AI Integration:

• Vercel AI SDK for seamless integration with the Gemini AI model
• Custom prompts and AI system instructions with zod schema to structure AI output; data processing to ensure accurate genetic analysis

1. Data Visualization:

• Chart components using Recharts for interactive, responsive data visualization

1. State Management:

2. React Context API for efficient state management across components

3. Local storage for data persistence

4. Authentication:

5. Implemented Next.js middleware to protect private pages (work in progress for enhanced security)

6. Data Structure Design:

• Recursive & iterative process to determine the optimal representation of genetic information in the UI
• Created a little comprehensive genetic marker database, later integrated & replaced with AI-generated data

1. AI-Assisted Development:

• Leveraged generative AI for validating design decisions and exploring options throughout the development process

Challenges we ran into

• AI Model Integration: Initially, I expected to need specialized training for the Gemini AI model. However, we discovered it performed well without additional training, though some edge cases required attention.
• Data Structure and UI Design: Determining the best way to represent complex genetic data in a user-friendly interface required multiple iterations and extensive testing.
  • Authentication and Middleware: I faced challenges in implementing user authentication via next-auth, particularly in ensuring middleware effectively protected sensitive pages, there wasn't enough time to start debugging unknown issuses
• AI Response Schema: Updating the AI response schema to fit another iteration of UI initially resulted in errors during API calls, requiring us to switch to a different model version and refine our approach & data schema.
• Balancing Complexity and Usability: I struggled to find the right balance between providing comprehensive genetic information and maintaining an intuitive user experience.
• Data Sourcing and Validation: Time constraints led me to rely primarily on AI-generated data, raising questions about data accuracy.

Accomplishments that we're proud of

• Successfully integrating advanced generative AI (Gemini model) for genetic analysis without requiring specialized training.
• Developing an intuitive and visually appealing interface for presenting complex genetic information.
• Creating a flexible and scalable architecture that allows for easy addition of new features and genetic markers.
• Implementing a privacy-focused design that prioritizes user data protection.
• Balancing technical complexity with user-friendliness, making genetic insights accessible to a broad audience.
• Rapid development and iteration, turning a complex concept into a functional prototype within the hackathon timeframe.

What we learned

• The potential and limitations of AI in processing and interpreting genetic data.
• The importance of user-centered design in presenting complex scientific information.
• Techniques for optimizing AI model performance and managing API interactions.
• The complexities of handling sensitive health data and the importance of robust privacy measures.
• The value of iterative development and continuous testing in creating effective data visualisations.
• The potential opportunities in the intersection of biotechnology and software development.
• The importance of cross-disciplinary collaboration in tackling complex problems in the biotech space.

What's next for Genome

• Enhanced AI Model: Fine-tune the AI model with specialized genetic datasets to improve accuracy and expand the range of analyzable genetic markers.
• Integration with Established Databases: Incorporate data from renowned genetic research organizations to enhance the depth and credibility of our analysis.
• Advanced Visualization Tools: Develop more sophisticated, interactive visualizations to help users better understand their genetic data.
• Expanded Health Recommendations: Integrate lifestyle, dietary, and exercise recommendations based on genetic predispositions.
• Collaborative Features: Implement secure sharing options for users to discuss results with healthcare providers or genetic counselors.
• Machine Learning Integration: Implement ML models for continuous improvement of risk assessments and personalized recommendations.
• Enhanced Security Measures: Implement end-to-end encryption and advanced authentication methods to further protect user data. Genetic Ancestry Exploration: Add features to help users explore their genetic ancestry and heritage. -API Development: Create a secure API to allow integration with other health and wellness platforms.
• Predictive Health Modeling: Implement features to model potential health outcomes based on lifestyle changes and interventions.

Built With

• gemini
• next.js
• nextauth
• radix
• tailwindcss
• typescript
• zod