FinCoach

• 

  Inicio de la Página

• 

  Explicación de Funcionamiento

• 

  Explicacion de Beneficios

• 

  Zona de Contacto

• 

  Formularios de Inicio de Sesión y Registro

• 

  Dashboard Principal

• 

  Generación de Recomendaciones y Alertas

• 

  Área de Gráficas y FinCoach AI

Inspiracion

La inspiración principal para FinCoach provino de un problema fundamental en la inversión: el comportamiento emocional y la tendencia a la venta por pánico. La visión era crear una solución tecnológica que ayudara a las personas a tomar decisiones con confianza y evitar reaccionar impulsivamente ante las fluctuaciones del mercado. El eslogan, "Invierte con Confianza, No con Pánico," encapsula perfectamente esta misión. Además, la estética y credibilidad del proyecto se inspiraron en el branding de Capital One (colores Navy y Rojo), Para plantear la idea utilizamos la metodología Design Thinking empatizando en una situación de un miembro del equipo sobre inversiones. Buscando proyectar un aspecto profesional y de confianza en el sector fintech.

Lo que aprendimos

La construcción de la página de aterrizaje de FinCoach ofreció varias oportunidades de aprendizaje clave:

-Integración de Diseño y Desarrollo: Se puso en práctica el uso de un sistema de diseño estructurado, combinando Tailwind CSS para la utilidad y Shadcn UI para componentes consistentes, lo que reafirmó la importancia de la consistencia visual, como lo demuestra la implementación de los colores de marca de Capital One.

-Diseño Mobile-First y Accesibilidad: Se reforzó la necesidad de un enfoque de diseño primero para móvil, asegurando que el diseño completamente responsivo funcionara impecablemente en todos los puntos de interrupción. También se aplicaron activamente características de accesibilidad y optimización SEO.

Como se construyó el proyecto

El proyecto FinCoach fue concebido como una aplicación de una sola página utilizando una arquitectura moderna:

-Tecnología y Estructura: Se optó por un stack robusto de React y TypeScript para el frontend para asegurar escalabilidad y estabilidad, con Wouter para el routing de la SPA. El estilo se gestionó con Tailwind CSS y componentes Shadcn UI. El backend es minimalista, basado en Express.js, enfocado inicialmente en el punto final del formulario de contacto.

-Desarrollo de la Interfaz: Se creó una implementación inicial completa de la página de aterrizaje , incluyendo todas las secciones clave: la Navbar sticky, la sección Hero con indicadores de confianza, las secciones funcionales, Testimonios, Contacto y el Footer.

-Diseño Visual: Se implementaron los colores de marca definidos. Se generaron ilustraciones personalizadas para las secciones Hero y de características para mejorar el impacto visual y la profesionalidad.

Retos que enfrentamos

Creación de Contenido y Estrategia: El principal reto fue traducir el concepto de un asistente de inversión impulsado por IA en un mensaje claro y convincente para la página de aterrizaje, centrándose en la solución y el problema.

Implementacion de IA y API's: Fue un gran reto hacer que funcionen y puedan converger entre ellas tratando que de una se apoye la otra y vicebersa, y resolver los errores que se nos atravesaban por el camino.

Built With

• amazon-web-services
• capitalone
• deeplearning
• firebaseauth
• geminiai
• git
• github
• ingeniusapi
• llm
• machine-learning
• microsoftsqlserver
• neuralnetworks
• openpyxl
• pandas
• python
• react
• scikitlearn
• tailwindcss
• typescript
• xgboost