Páginas Públicas

Esta sección documenta las páginas públicas de Floutic que son accesibles sin autenticación.

Página "Quiénes Somos"

La página "Quiénes Somos" (/quienes-somos) es una página pública que presenta al equipo de Floutic a los visitantes.

Contenido de la Página

La página incluye las siguientes secciones:

1. Sección Hero

• Título principal: "Quiénes Somos"
• Subtítulo descriptivo sobre Floutic
• Diseño visual atractivo con gradientes

2. Nuestra Historia

• Sección que cuenta la historia y el origen de Floutic
• Incluye un icono SVG decorativo
• Texto narrativo sobre cómo comenzó la plataforma

3. Nuestra Misión

• Descripción de la misión de Floutic
• Qué objetivos persigue la plataforma
• Cómo ayuda a empresas y expertos

4. Nuestra Visión

• Visión a futuro de Floutic
• Dónde se ve la plataforma en el futuro
• Valores y objetivos a largo plazo

5. Nuestros Valores

• Lista de valores fundamentales de Floutic
• Cada valor incluye un icono y descripción
• Diseño visual atractivo con tarjetas

6. Nuestro Equipo

• Grid de tarjetas mostrando a los miembros del equipo
• Cada tarjeta muestra:
  • Foto de perfil (con diseño de gradiente)
  • Nombre completo
  • Rol en el equipo
  • Biografía (con límite de líneas)
  • Enlaces a redes sociales (si están disponibles)

Funcionalidad

Visualización de Miembros del Equipo

• La página obtiene los miembros del equipo desde el endpoint GET /api/profiles/team
• Solo se muestran administradores con is_visible_in_team=True
• Los miembros se ordenan por display_order (ascendente)
• Se filtra automáticamente para mostrar solo miembros con full_name (evita tarjetas vacías)

Perfiles Individuales

• Cada miembro del equipo tiene su propia página de perfil público
• URL: /equipo/{slug} donde slug es generado automáticamente desde el nombre
• La página de perfil muestra:
  • Información completa del miembro
  • Biografía completa (sin límite)
  • Todas las redes sociales
  • Ubicación y sitio web personal
  • Metadata SEO optimizada

Interactividad

• Las tarjetas de miembros son clicables (si tienen slug)
• Al hacer clic, redirige a la página individual del miembro
• Hover effects: las tarjetas tienen animaciones sutiles al pasar el mouse
• Los enlaces de redes sociales abren en nueva pestaña
• Los enlaces sociales previenen la navegación de la tarjeta (stopPropagation)

SEO y Metadata

La página incluye:

• Título SEO: "Quiénes Somos - Floutic"
• Descripción meta optimizada
• Schema.org structured data para organización
• Open Graph tags para compartir en redes sociales

Diseño Responsive

• Grid adaptable: 1 columna en móvil, 2 en tablet, 3 en desktop
• Espaciado optimizado para diferentes tamaños de pantalla
• Tipografía escalable
• Imágenes optimizadas

Configuración Backend

Para que un administrador aparezca en esta página:

1. El administrador debe crear o editar su perfil en /perfil/admin
2. Debe marcar el checkbox "Visible en equipo" (is_visible_in_team=True)
3. Opcionalmente, puede configurar el display_order para controlar el orden de visualización
4. El perfil debe tener al menos un full_name para aparecer

Endpoint utilizado:

• GET /api/profiles/team - Endpoint público (sin autenticación) que retorna todos los perfiles admin con is_visible_in_team=True

Otras Páginas Públicas

Página de Aceptación de Invitación

• URL: /admin/invitation/accept?token=XXXXX
• Página pública para que usuarios invitados creen su cuenta de administrador
• Requiere un token válido de invitación
• Formulario con validación en tiempo real:
  • Nombre de usuario (3-50 caracteres, solo letras, números y _)
  • Contraseña (mínimo 8 caracteres, con requisitos de complejidad)
  • Confirmación de contraseña
• Indicadores visuales de requisitos cumplidos
• Redirección automática al login después de crear la cuenta exitosamente

Página de Perfil Público de Miembro del Equipo

• URL: /equipo/{slug}
• Página individual de cada miembro del equipo
• Accesible desde la página "Quiénes Somos" haciendo clic en una tarjeta
• Muestra información completa del miembro:
  • Foto de perfil grande
  • Nombre completo y rol
  • Biografía completa
  • Ubicación
  • Todas las redes sociales configuradas
  • Sitio web personal
• SEO optimizado con metadata específica del miembro
• Schema.org structured data para Person