AgroConnect· Manual de diseño · mobile · abril 2026
Catálogo visual · 46 pantallas · abril 2026

Todas las pantallas de la app, agrupadas por flujo de usuario.

Este manual reúne doce documentos de mockup que cubren las 46 ContentPages compiladas en AgroConnect.Mobile. Cada mockup fue construido leyendo los XAML — mismos tokens Sunlight, misma estructura de bindings, mismo copy. Entrás por el flujo que te interese, abrís el documento, y ves las pantallas con el device frame y captions técnicos al pie. Para la referencia de tokens, tipografía y patrones, ver el documento completo →

Documentos 12
Pantallas 46 xaml
Flujos 4 + transv.
Roles 3 + admin
Cobertura MVP 42/46
01

Flujos de usuario

12 documentos · agrupados por rol

El orden sigue el viaje del usuario a través del producto. Arranca en autenticación, pasa por los tres flujos operativos (aplicador, productor, operario) en el orden en que se tocan unos a otros, y cierra con las pantallas de cuenta y perfil que son transversales. Hacé click en cualquier tarjeta para abrir el documento completo con los mockups.

Aplicador
Productor
Operario
Transversal
01Entrada
Login & Home

Punto de ingreso. Splash, login con gradiente Sun, pantalla de inicio con KPI strip del rol activo y atajos a los flujos principales.

LoadingPage LoginPage HomePage
Abrir mockup
02Aplicador · core
Aplicador — Plan · Ejec · Firma

Las tres pantallas canónicas del trabajador de campo: wizard de planificación, pantalla de ejecución en curso con mapa y KPIs grandes, y cierre con firma on-device.

Plan Execution ExecComplete
Abrir mockup
03Aplicador
Job Detail · Notifs · Checklist

Detalle de un trabajo en la bolsa con contact rows, listado de notificaciones agrupado por día y checklist de pre-ejecución con ítems marcables.

JobDetail Notifications ExecChecklist
Abrir mockup
AC
04Aplicador
Bolsa · Perfil · Ejecuciones

La bolsa de trabajos abiertos, el perfil público que ve el productor (con rating y zonas) y el listado histórico de ejecuciones del aplicador.

JobList ApplicatorPublicProfile ExecutionList
Abrir mockup
05Aplicador
Perfil Aplicador & Onboarding

Wizard de alta de perfil público en 4 pasos + pantalla de perfil propio con los datos editables del aplicador.

Onboarding CreateApplicatorProfile ProfilePage
Abrir mockup
JM
06Aplicador
Mi Equipo

Gestión de operarios de la empresa aplicadora: listado, alta y detalle con KPIs de rendimiento individual.

OperatorList OperatorDetail CreateOperator
Abrir mockup
+ 📄
07Productor
MiCampo · Upload · Detail · Deriva

El hub del productor (Mi Campo con tabs), la subida de receta por PDF con extracción automática, el detalle de receta propio y el análisis de deriva con alerta brick.

MiCampo UploadPdf RecipeDetail DriftResult
Abrir mockup
18 24 6
08Productor · core
Recetas · Lotes · Trabajos

La vuelta completa del productor: listado maestro de recetas, grupo de recetas hermanas, detalle del lote, asignación directa vs municipio, y la bolsa invertida (trabajos publicados por él).

RecipeList RecipeGroup LotDetail DirectAssign AssignMunicipality ProducerJobList
Abrir mockup
09Productor
Cierre: Job Detail + Review

Las dos últimas pantallas del flujo productor: el detalle del trabajo publicado (con postulantes y elegir aplicador) y la calificación post-ejecución con estrellas y comentario.

ProducerJobDetail ReviewApplicator
Abrir mockup
10Operario · core
Operario · Ejecución · Cuenta

Home del operario (vista reducida), cuenta mínima, y los 5 sub-tabs del shell ExecutionPage: Conditions, Products, Drone, Timeline, Contact. Incluye las dos transversales de edición (EditProfile, ChangePassword).

OperatorHome OperatorAccount ExecConditions ExecProducts ExecDrone ExecTimeline ExecContact EditProfile ChangePassword
Abrir mockup
11Transversales
Alta & elección de rol

Las pantallas comunes a cualquier rol: registro de usuario, selección de rol para usuarios multi-rol, y el shell de ejecución en vista aplicador (plan → ejecutando → cierre).

Register RoleSelection ApplicatorExecution
Abrir mockup
42/46
12Status
Pendientes de migración

Estado vivo del trabajo: qué pantallas ya se mockearon y migraron al sistema Sunlight, cuáles quedan. Actualizado tras cada tanda.

EditApplicator (pend) + 3 pendientes
Ver estado
02

Referencia rápida

tokens · escala · radios

Los fundamentos del sistema Sunlight en una sola página. Para la versión extendida — incluyendo la paleta clásica que conviven, los patrones recurrentes, los hallazgos del diagnóstico y el inventario completo de las 46 pantallas — mirá el documento completo.

Paleta SunlightLos 12 tokens más usados · ~40 pantallas
SunPaper#f3efe6
SunPaper2#fbf8f1
SunInk#1a1d17
SunMuted#6b6d63
SunLine#d9d3c1
SunClay#b8593a
SunMoss#2d4a2b
SunBrick#8b3a2a
MossSoft#e2ecd9
SkySoft#dce7ee
AmberSoft#f2e3bf
BrickSoft#f2d9d0
TipografíaInter · 4 pesos · escala 10–48
32Hero4xl
22Título pantalla2xl
18Subtítuloxl
15Botón · Labellg
14Body defaultmd
12Captionsm
11EYEBROWxs
Radios3 niveles · base 4px
Sm · 8botón · pill
Md · 12card · frame
Lg · 20hero · avatar
EspaciadoBase 4px · 8 niveles
4
Xs
12
Md
16
Lg
24
2xl
48
4xl
Doce documentos. Cuarenta y seis pantallas. Un solo sistema visual.
— El manual como índice del trabajo real
AgroConnect·Manual de diseño mobile·v1 abril 2026·12 mockups·46 pantallas