Tellounder LEONARDO TELLO / PRODUCTO DIGITAL

Sistemas, UX e IA aplicada que funcionan.

Casos reales, decisiones técnicas y productos en vivo. Explorá lo que construí y cómo lo resolví.

Podés cambiar el audio en cualquier momento.

POWER / READY
Tellounder

MUSIC / CULTURE

Rise Difusión: identidad, servicios y obra cultural administrable

Servicios musicales, obra administrable e identidad pública dentro de una presencia digital independiente.

Producto · Identidad · Copy · Experiencia · Administración · SEO

Abrir RISE DIFUSIÓN en vivo

Compartir este caso por WhatsApp

Tecnologías y funciones del proyecto

  • React 19: Construye la landing pública y el panel privado.
  • TypeScript 7: Tipa servicios, formularios y cards administrables.
  • Vite 8: Compila y optimiza la aplicación de una sola página.
  • Firebase Auth: Protege el panel mediante acceso con Google.
  • Cloud Firestore: Publica y ordena cards visibles en tiempo real.
  • WriteBatch: Guarda el conjunto administrado de manera atómica.
  • Firebase Hosting: Sirve HTTPS, dominio, rutas y caché de assets.
  • Canvas API: Reduce imágenes antes de guardarlas.
  • WebP Data URL: Permite media administrable sin usar Firebase Storage.
  • WhatsApp Deep Link: Prepara consultas por servicio mediante `wa.me`; no es una Business API.
  • JSON-LD + Open Graph: Alinea servicios, identidad y previews sociales.
  • Font Awesome: Aporta iconografía vectorial accesible.

Necesidades, decisiones y resultados

NECESIDAD / ARQUITECTURA

Una puerta para todos los servicios

Cinco propuestas distintas tenían que sonar como una sola marca.

Necesidad
Distribución, difusión, letras, webs y presencia digital estaban fragmentadas y eran difíciles de comparar.
Decisión de producto
Ordené la landing por servicios, plataformas, proceso, preguntas frecuentes y consultas contextualizadas.
Resultado
Cada persona puede entender, elegir y conversar con Rise sin pasar por una navegación confusa.
Evidencia
Cada CTA abre WhatsApp con el servicio elegido y el formulario compone una consulta completa.

Tecnologías aplicadas en este track

  • React: Mantiene servicios, preguntas y formularios dentro de una experiencia continua.
  • CSS propio: Construye la identidad musical sin depender de una plantilla visual.
  • WhatsApp: Conserva el contexto del servicio al iniciar la conversación.

COPY / CONFIANZA

Distribución sin promesas falsas

Vender un servicio también implica explicar correctamente sus límites.

Necesidad
La distribución necesitaba ser clara sin presentar a Rise como dueño del proceso que revisa una plataforma externa.
Decisión de producto
Separé acompañamiento de Rise, revisión de RouteNote y condiciones propias de las plataformas.
Resultado
La propuesta comercial comunica alcance, identidad y descubrimiento sin deformar el funcionamiento real.
Evidencia
La página enlaza la plataforma externa y presenta disclaimers visibles dentro del recorrido de distribución.

Tecnologías aplicadas en este track

  • Contenido estructurado: Distribuye beneficios, proceso y límites en el momento donde cada uno hace falta.
  • RouteNote link: Conecta con la plataforma real sin atribuirse una infraestructura ajena.
  • React: Mantiene el contexto de la consulta cuando la persona decide avanzar.

ADMIN / FIRESTORE

Obra administrable sin tocar código

La landing dejó de ser una pieza cerrada después del lanzamiento.

Necesidad
Rise necesitaba actualizar artistas y proyectos sin depender de una nueva compilación por cada cambio.
Decisión de producto
Construí `/admin` con acceso Google, edición, orden, visibilidad y publicación atómica.
Resultado
La portada se suscribe a cards ordenadas y muestra solamente las visibles, con respaldo local si el remoto no responde.
Evidencia
El panel publica toda la colección en una escritura batch y el frontend conserva cinco casos de respaldo.

Tecnologías aplicadas en este track

  • Firebase Auth: Protege el acceso a la herramienta de gestión.
  • Cloud Firestore: Sincroniza obra visible y orden sin volver a publicar la landing.
  • React: Resuelve edición, previsualización y estados de guardado.

MEDIA / ARQUITECTURA

Imágenes sin servidor ni Storage

Una restricción de infraestructura se transformó en una regla de producto.

Necesidad
Las cards necesitaban fotos administrables, pero el proyecto no debía sumar servidor propio ni Firebase Storage.
Decisión de producto
Reduzco a 1200 px, convierto a WebP en el navegador y valido peso antes de guardar la Data URL en Firestore.
Resultado
Rise administra imágenes dentro de una arquitectura gratuita, con topes explícitos en interfaz y reglas.
Evidencia
El sistema limita la colección a 15 cards y valida el tamaño de la imagen tanto en cliente como en Firestore.

Tecnologías aplicadas en este track

  • Canvas API: Redimensiona la imagen antes de enviarla a la base.
  • WebP: Reduce el peso conservando una calidad útil para cards públicas.
  • Firestore Rules: Repite los límites críticos fuera de la interfaz de administración.

SEO / PUBLICACIÓN

Identidad pública verificable

La misma marca debe ser reconocible en pantalla, buscadores y shares.

Necesidad
Una dirección visual fuerte perdía valor si dominio, metadata y contenido público decían cosas diferentes.
Decisión de producto
Alineé canonical, Open Graph, Twitter, datos estructurados, sitemap, robots y contenido visible.
Resultado
Rise se presenta con una identidad consistente ante personas, plataformas sociales y buscadores.
Evidencia
El sitio declara Organization, ProfessionalService, catálogo de servicios, FAQ y WebSite; `/admin` permanece fuera de indexación.

Tecnologías aplicadas en este track

  • JSON-LD: Describe marca, servicios y preguntas con estructuras legibles por buscadores.
  • Open Graph: Conserva identidad e imagen cuando el dominio se comparte.
  • Firebase Hosting: Publica dominio, headers y rutas del producto.

Proyectos y casos de estudio

AVVIVO

Sistema que muestra actividad, conecta actores, aplica reglas y registra eventos.

Producto · UX · Frontend · Backend · Datos · Cloud · Operación

CATÁLOGO AYE

Una fuente externa convertida en una experiencia comercial administrable, compartible y preparada para móvil.

Importación · Catálogo · Checkout humano · Administración · SEO · PWA

HEMBRA

Una marca artesanal convertida en tienda, operación administrable y sistema de universos visuales.

Marca · Catálogo · Comercio · Administración · Media · QA

ANTO GRISPO

Una obra recuperada y convertida en portfolio narrativo, accesible y autoadministrable.

Recuperación · Narrativa · Identidad · Portfolio · Administración · Publicación

MetalMente Arte

El archivo de un taller, convertido en un catálogo interactivo de herrería artística y restauraciones.

Producto · UX/UI · Frontend · Contenido · Administración · SEO técnico

Cielofinal

La música y la historia de una banda, reunidas en un archivo digital navegable y compartible.

Dirección visual · UX · Frontend · Contenido · Spotify · Administración · SEO