70 lines
3.0 KiB
Markdown
70 lines
3.0 KiB
Markdown
# TASK-045-simplify-real-server-cards-for-product-ui
|
|
|
|
## Goal
|
|
Simplificar las tarjetas de servidores reales para mostrar solo la informacion mas util para el visitante final, mejorando la claridad y reduciendo ruido visual y tecnico.
|
|
|
|
## Context
|
|
Las tarjetas actuales ya muestran datos reales A2S, pero siguen ensenando informacion que no aporta suficiente valor para la experiencia principal. La tarjeta debe centrarse en lo esencial: nombre, estado, jugadores, mapa, region, ultima captura y CTA de conexion. Cualquier metrica adicional debe ser secundaria o eliminarse si no mejora claramente la lectura.
|
|
|
|
## Steps
|
|
1. Revisar la estructura actual de las tarjetas reales.
|
|
2. Reducir la informacion visible principal a:
|
|
- nombre
|
|
- estado
|
|
- jugadores actuales
|
|
- mapa
|
|
- region
|
|
- ultima captura
|
|
- boton Conectar
|
|
3. Evaluar si promedio y pico deben quedar como datos secundarios discretos o desaparecer.
|
|
4. Eliminar de la tarjeta elementos como:
|
|
- tendencia reciente
|
|
- numero de capturas
|
|
- bloques densos poco utiles
|
|
5. Reorganizar la tarjeta para que se lea rapido y con claridad.
|
|
6. Mantener una composicion limpia y coherente con el diseno actual.
|
|
7. Asegurar buena legibilidad en desktop y movil.
|
|
|
|
## Files to Read First
|
|
- AGENTS.md
|
|
- ai/repo-context.md
|
|
- frontend/index.html
|
|
- frontend/assets/js/main.js
|
|
- frontend/assets/css/styles.css
|
|
- backend/app/payloads.py
|
|
|
|
## Expected Files to Modify
|
|
- frontend/index.html
|
|
- frontend/assets/js/main.js
|
|
- frontend/assets/css/styles.css
|
|
|
|
## Constraints
|
|
- No tocar backend salvo alineacion menor si fuera imprescindible.
|
|
- No romper la CTA Conectar.
|
|
- No anadir librerias nuevas.
|
|
- No hacer cambios destructivos.
|
|
- Mantener el ajuste centrado en UX de producto final.
|
|
|
|
## Validation
|
|
- Las tarjetas reales muestran solo la informacion mas util y legible.
|
|
- Desaparece ruido tecnico innecesario.
|
|
- La CTA Conectar sigue visible y clara.
|
|
- La UI gana sensacion de producto final.
|
|
|
|
## Change Budget
|
|
- Preferir menos de 3 archivos modificados.
|
|
- Preferir menos de 160 lineas cambiadas.
|
|
|
|
## Outcome
|
|
- `frontend/assets/js/main.js` simplifica el render de tarjetas reales a identidad, estado, poblacion, quick facts y CTA, eliminando resumen historico, tendencia y llamadas auxiliares ya innecesarias.
|
|
- `frontend/assets/css/styles.css` elimina estilos asociados a bloques tecnicos densos y deja una composicion mas directa para las quick facts.
|
|
- No fue necesario tocar backend ni cambiar la CTA `Conectar`.
|
|
|
|
## Validation Result
|
|
- Validado con `node --check frontend/assets/js/main.js`.
|
|
- Revisado en codigo: las tarjetas mantienen nombre, estado, jugadores, mapa, region, ultima captura y CTA, y desaparecen tendencia, capturas, promedio y pico.
|
|
- Revisado en diff: la task queda limitada a `frontend/assets/js/main.js`, `frontend/assets/css/styles.css` y el archivo de task.
|
|
|
|
## Decision Notes
|
|
- Se opto por eliminar por completo las metricas secundarias en lugar de rebajarlas visualmente, porque seguian cargando la tarjeta y no aportaban suficiente valor a la lectura principal.
|