Plantilla Upvote: hoja de ruta pública con votos
Plantilla Upvote: un tablero de votos que puedes enseñar a tus usuarios
Upvote es la hoja de ruta pública de la galería de Zugo. Quien entra lee la lista de peticiones, vota lo que más quiere y propone ideas nuevas, y detrás del acceso hay un panel con lo que esa persona ha publicado y apoyado. Las ideas y los votos se guardan en el navegador. Clonarla no gasta créditos.
Debajo va el reparto: qué trae, qué aguanta el uso real y cuál es la frontera honesta que hay que cruzar antes de que un tablero así recoja opiniones de más de una persona.
¿Qué incluye la plantilla Upvote?
La plantilla gira alrededor de una lista y de tres formas de tocarla: votar, filtrar, añadir. Esa contención es el argumento. Los tableros de sugerencias mueren antes por exceso de funciones que por abandono, y este se niega a casi todos los extras.
| Elemento | Qué hace |
|---|---|
| Tablero | Fichas de idea con botón de voto, punto de categoría y etiqueta de estado |
| Contadores | Peticiones abiertas, votos emitidos y entregas del trimestre |
| Filtros | Todas, Planificada, En curso, Entregada |
| Orden | Fijo, por número de votos y de mayor a menor |
| Formulario | Título, descripción y categoría, con la idea abriendo en revisión |
| Acceso | Pantalla de correo y contraseña más creación de cuenta |
| Panel de socio | Ideas que enviaste, votos que recibieron e ideas que apoyaste |
Cuatro estados cargan con todo el flujo: en revisión, planificada, en curso y entregada. Es suficiente para un equipo pequeño y lo bastante corto como para que un visitante entienda el circuito sin leyenda.
El formulario hace una cosa que importa más que cualquier función: pide el problema en lugar de la solución, y lo dice en el texto de ayuda bajo el campo. Los tableros se llenan de soluciones por inercia, y una solución es mucho más difícil de priorizar que la queja que la originó.
El panel de socio es una pieza pequeña de retención. Enseñarle a alguien que su idea sumó votos esta semana es lo que le hace volver, y mostrarlo no cuesta nada.
¿Qué funciona de verdad y qué es solo interfaz?
El tablero funciona en serio. El voto se activa y el contador se mueve, la lista se reordena, los filtros la estrechan y una idea nueva aparece arriba con tu voto puesto. Todo eso corre sobre estado real y no sobre fichas dibujadas, y se comprueba en un minuto en la vista previa.
El estado se guarda en tu navegador, así que una idea enviada sobrevive a recargar la página en ese dispositivo. Es más de lo que consigue la mayoría de tableros de demostración, y convierte la plantilla en algo útil para un ejercicio en solitario: bosquejar una hoja de ruta, reordenarla y enseñarla a un compañero compartiendo pantalla.
Pero navegador es la palabra clave. Los datos viven en el navegador donde se escribieron, y quien abra el mismo enlace desde su portátil verá la lista original. La pantalla de acceso muestra una pantalla de acceso: no comprueba ninguna contraseña ni separa cuentas.
Para un tablero público ese límite es de fondo y ninguna edición de aspecto lo esquiva. El valor entero de recoger opiniones está en que voten personas distintas, y sin almacenamiento compartido sus votos nunca se suman. La base de datos y la identidad reales llegan con el conector de Supabase, montado encima de la plantilla.
Compruébalo antes de repartir el enlace. Abre tu proyecto publicado en otro navegador y confirma que allí está vacío. Cinco minutos de prueba evitan el momento incómodo en que el equipo entero votó y no quedó registrado nada. El lado colaborativo del asunto está en si se puede trabajar en equipo.
¿Quién necesita una hoja de ruta pública?
Encaja en un producto de software pequeño con usuarios implicados: una herramienta de suscripción, una extensión, una aplicación con comunidad. En cuanto tienes más peticiones de las que caben en la memoria, una lista pública sale más barata que una reunión de priorización, y responde a la pregunta que los usuarios repiten, que es si alguien leyó su mensaje.
Funciona igual de bien hacia dentro. Un equipo de sistemas, uno de operaciones o un colegio pueden usar este mismo esqueleto para peticiones internas, donde el público son cien compañeros y no el internet abierto. En ese escenario el límite del navegador sigue mordiendo, y la solución es la misma.
Es la herramienta equivocada para incidencias de soporte. Un tablero sirve para lo que quiere mucha gente, y una incidencia es la cosa rota de una persona. Mezclarlos produce un tablero donde una única queja urgente adelanta a una petición realmente popular.
También es la herramienta equivocada si no piensas construir nada de lo que aparece. Una hoja de ruta pública que lleva seis meses igual hace más daño que no tener ninguna, porque es la prueba visible de que nadie está escuchando.
¿Conviene pedir registro para votar?
El voto abierto recoge más votos y peor información. Vota cualquiera, nadie se compromete a nada, y cualquier control antifraude se salta borrando los datos del navegador. Eso no es un defecto de la plantilla, es lo que significa votar en abierto.
Pedir registro recoge menos votos y mejor información. Sabes quién quiere qué, puedes avisar a esa persona cuando lo entregues, y votar dos veces pasa de trivial a costoso. El precio es fricción justo en el instante en que alguien estaba dispuesto a ayudarte.
La respuesta habitual en un producto pequeño es dejar leer y votar libremente, y pedir un correo solo al proponer una idea nueva. Así la barrera queda en el punto donde de verdad necesitas poder contestar a alguien.
Elijas lo que elijas, es una decisión de base de datos y no de diseño. Las dos versiones necesitan cuentas reales detrás para significar algo, lo que devuelve el asunto al conector y no a una edición en el chat.
¿Cómo convertirla en el tablero de tu producto?
Primero el contenido, después la mecánica. Cada edición cuesta 3 créditos, así que la lista va de los cambios que la hacen tuya a los que la hacen operativa.
- Cambia el nombre del producto y el encuadre. Cabecera, título de la página, contacto del pie.
- Reescribe las categorías. Las de la demostración son genéricas. Las tuyas deberían usar las palabras con las que tu equipo ya habla del producto.
- Carga peticiones reales. De diez a quince entradas auténticas valen más que un tablero vacío, al que nadie añade nada.
- Ajusta los estados. Añade uno para lo rechazado si piensas decir que no en público, que conviene hacerlo.
- Conecta almacenamiento y acceso. Este es el paso que convierte una demostración en un tablero.
- Publica y enlázalo. El proyecto vive en una dirección del tipo
roadmap.zugo.run, con tu dominio propio encima.
El estado de rechazo merece un momento aparte. Decir que no en público es incómodo y es la señal más fuerte de que el tablero es real. Una lista donde nunca se rechaza nada se lee como decoración en menos de un mes.
¿Cuánto cuesta llegar a un tablero real?
El clon no gasta créditos ni pasa por la IA, así que la cuenta arranca en la primera edición. Llegar a un tablero que enseñarías a un cliente suele pedir entre cinco y ocho ediciones, más el trabajo de conectores, que no consume créditos.
| Acción | Créditos |
|---|---|
| Clonar la plantilla | Ninguno |
| Una edición en el chat | 3 créditos |
| Construcción desde cero por descripción | 6 créditos |
| Plataforma multipágina | 12 créditos las tres primeras páginas, 3 por cada adicional |
| Modo Hi-Fi | El doble: edición 6, construcción 12 |
Free entrega 5 créditos, que cubren el clon y una edición pero no una construcción desde cero, que pide 6. Pro cuesta $25 al mes con 200 créditos, unas 66 ediciones, y Business cuesta $99 al mes con 800 créditos. Cada construcción se abre en un entorno aislado antes de entregarse, así que una versión que no carga no llega a tus manos.
Si la hoja de ruta tiene que convivir con una página de novedades y una guía de propuestas en direcciones propias, eso ya es una plataforma multipágina: 12 créditos las tres primeras páginas y 3 por cada una siguiente. Una construcción sencilla tarda alrededor de un minuto, y una multipágina tarda varios.
¿Qué ediciones se piden más?
"Añade un estado de rechazada con un motivo obligatorio visible en la ficha". "Deja comentar una idea y muestra el número de comentarios en la ficha". "Agrupa el tablero por categorías plegables en vez de una lista larga".
Las peticiones contra el voto tramposo salen enseguida, y la respuesta honesta importa: sin cuentas y sin almacenamiento compartido, cualquier control se derrota borrando los datos del navegador. La protección seria empieza por la identidad real y no por un retoque de interfaz.
Las peticiones de presentación son baratas y valen la pena: "muestra las tres peticiones más votadas en una fila destacada sobre el tablero" o "en móvil pon el botón de voto a la derecha de la ficha para que quede al alcance del pulgar".
¿Dónde se detiene la plantilla?
Un navegador no es un tablero público. Sin almacenamiento compartido cada visitante ve su propia lista y los votos no se acumulan nunca. Supabase quita el límite, y eso es una etapa de trabajo y no un mensaje en el chat.
Moderar es tarea de personas. Ideas duplicadas, mensajes fuera de tema y el párrafo enfadado ocasional necesitan a alguien. La plantilla puede ocultar, fusionar o reordenar entradas cuando construyas esos controles, pero no puede decidir qué merece quedarse.
La lógica de flujo profunda llega por ediciones. Enlazar una entrada con tu gestor de incidencias, avisar a quienes votaron cuando algo se entrega, ponderar votos según el tamaño del cliente: todo alcanzable, nada de eso en un solo prompt. En un producto de verdad complejo Zugo no sustituye a un equipo de desarrollo, y el código se exporta a GitHub cuando quieras. La versión general de este proyecto está en cómo crear un tablero de sugerencias con IA.
La forma más rápida de juzgar el esqueleto es cargarlo con tu propio atraso de peticiones. Abre la galería en zugo.dev, clona Upvote y pega las diez peticiones que ya conoces. Verlas ordenadas por votos suele cambiar cuál piensas hacer a continuación.