Pantalla: Resultados de Busqueda¶

Identificador: SCR-CAT-002 Modulo: MTS-CAT-001 - Catalogo de Medicamentos Version: 1.0.0 Fecha: 2025-12-05 Autor: MobileUxUiDrone (Eight of Eight) Estado: Especificado FASE: 2 - Value

1. Informacion General¶

Atributo	Valor
Nombre	Resultados de Busqueda
Proposito	Lista de medicamentos encontrados con filtros
Tipo	Full Screen
Acceso	SCR-CAT-001 > Busqueda
Prioridad	Alta

2. Wireframe ASCII¶

2.1. Estado: Resultados Encontrados¶

+------------------------------------------+
|  [<]    Buscar Medicamento                |
+------------------------------------------+
|                                           |
|  ┌─────────────────────────────────────┐  |
|  │  🔍 metformina                [X]  │  |
|  └─────────────────────────────────────┘  |
|                                           |
|  Mostrando 24 resultados                  |
|                                           |
|  [Tabletas ▼] [Oral ▼] [+ Filtros]       |
|                                           |
|  ─────────────────────────────────────    |
|                                           |
|  GENERICOS                                |
|  ┌─────────────────────────────────────┐  |
|  │  💊 Metformina 500mg               │  |
|  │     Tableta | Oral                 │  |
|  │     Generico                       │  |
|  ├─────────────────────────────────────┤  |
|  │  💊 Metformina 850mg               │  |
|  │     Tableta | Oral                 │  |
|  │     Generico                  ★    │  |
|  ├─────────────────────────────────────┤  |
|  │  💊 Metformina 1000mg              │  |
|  │     Tableta | Oral                 │  |
|  │     Generico                       │  |
|  └─────────────────────────────────────┘  |
|                                           |
|  MARCAS COMERCIALES                       |
|  ┌─────────────────────────────────────┐  |
|  │  💊 Glucophage 850mg               │  |
|  │     Tableta | Oral                 │  |
|  │     Merck                          │  |
|  ├─────────────────────────────────────┤  |
|  │  💊 Dabex 850mg                    │  |
|  │     Tableta | Oral                 │  |
|  │     Merck                          │  |
|  └─────────────────────────────────────┘  |
|                                           |
|  COMBINACIONES                            |
|  ┌─────────────────────────────────────┐  |
|  │  💊 Metformina/Glibenclamida       │  |
|  │     Tableta | Oral | 500/5mg       │  |
|  └─────────────────────────────────────┘  |
|                                           |
+------------------------------------------+

2.2. Estado: Con Filtros Aplicados¶

+------------------------------------------+
|  [<]    Buscar Medicamento                |
+------------------------------------------+
|                                           |
|  ┌─────────────────────────────────────┐  |
|  │  🔍 metformina                [X]  │  |
|  └─────────────────────────────────────┘  |
|                                           |
|  Mostrando 8 resultados (filtrados)       |
|                                           |
|  [Tabletas ✓] [850mg ✓] [Limpiar]        |
|                                           |
|  ─────────────────────────────────────    |
|                                           |
|  ┌─────────────────────────────────────┐  |
|  │  💊 Metformina 850mg               │  |
|  │     Tableta | Oral                 │  |
|  │     Generico                  ★    │  |
|  ├─────────────────────────────────────┤  |
|  │  💊 Glucophage 850mg               │  |
|  │     Tableta | Oral                 │  |
|  │     Merck                          │  |
|  ├─────────────────────────────────────┤  |
|  │  💊 Dabex 850mg                    │  |
|  │     Tableta | Oral                 │  |
|  │     Merck                          │  |
|  ├─────────────────────────────────────┤  |
|  │  💊 Glafornil 850mg                │  |
|  │     Tableta | Oral                 │  |
|  │     Laboratorio Chile              │  |
|  └─────────────────────────────────────┘  |
|                                           |
+------------------------------------------+

2.3. Estado: Cargando¶

+------------------------------------------+
|  [<]    Buscar Medicamento                |
+------------------------------------------+
|                                           |
|  ┌─────────────────────────────────────┐  |
|  │  🔍 metformina                [X]  │  |
|  └─────────────────────────────────────┘  |
|                                           |
|  Buscando...                              |
|                                           |
|  ─────────────────────────────────────    |
|                                           |
|  ┌─────────────────────────────────────┐  |
|  │  ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░  │  |
|  │  ░░░░░░░░░░░░░░                    │  |
|  │  ░░░░░░░░░░░░                      │  |
|  ├─────────────────────────────────────┤  |
|  │  ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░  │  |
|  │  ░░░░░░░░░░░░░░                    │  |
|  │  ░░░░░░░░░░░░                      │  |
|  ├─────────────────────────────────────┤  |
|  │  ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░  │  |
|  │  ░░░░░░░░░░░░░░                    │  |
|  │  ░░░░░░░░░░░░                      │  |
|  └─────────────────────────────────────┘  |
|                                           |
+------------------------------------------+

2.4. Estado: Sugerencia "Did You Mean"¶

+------------------------------------------+
|  [<]    Buscar Medicamento                |
+------------------------------------------+
|                                           |
|  ┌─────────────────────────────────────┐  |
|  │  🔍 metformuna                [X]  │  |
|  └─────────────────────────────────────┘  |
|                                           |
|  ┌─────────────────────────────────────┐  |
|  │  💡 Quisiste decir: metformina?    │  |
|  │                          [Buscar]  │  |
|  └─────────────────────────────────────┘  |
|                                           |
|  Mostrando 2 resultados para "metformuna" |
|                                           |
|  ─────────────────────────────────────    |
|                                           |
|  ┌─────────────────────────────────────┐  |
|  │  💊 Metformina 500mg               │  |
|  │     Tableta | Oral | Generico      │  |
|  ├─────────────────────────────────────┤  |
|  │  💊 Metformina 850mg               │  |
|  │     Tableta | Oral | Generico      │  |
|  └─────────────────────────────────────┘  |
|                                           |
+------------------------------------------+

3. Componentes UI¶

3.1. Result Count Header¶

Propiedad	Valor
Componente	CMP-CAT-005 (ResultCountHeader) NUEVO
Texto	"Mostrando {N} resultados"
Variante	Con filtros: "(filtrados)"

3.2. Filter Chips Row¶

Propiedad	Valor
Componente	CMP-CAT-006 (FilterChipsRow) NUEVO
Layout	Horizontal scroll
Chips	Quick filters activos
Ultimo item	"+ Filtros" para SCR-CAT-004

3.3. Section Header¶

Propiedad	Valor
Componente	Lista con section headers
Secciones	Genericos, Marcas, Combinaciones
Sticky	Si (al scroll)

3.4. Medication Result Card¶

Propiedad	Valor
Componente	CMP-CAT-007 (MedicationResultCard) NUEVO
Layout	Icono + info + indicadores
Icono	Segun forma farmaceutica
Titulo	Nombre del medicamento
Subtitulo	Forma, via, laboratorio
Badge	Estrella si popular

Propiedad	Valor
Componente	CMP-CAT-008 (DidYouMeanBanner) NUEVO
Icono	Bombilla
Texto	"Quisiste decir: {sugerencia}?"
Accion	"Buscar"

4. Comportamientos¶

4.1. Ordenamiento de Resultados¶

Prioridad	Criterio
1	Coincidencia exacta
2	Pais del usuario
3	Popularidad (busquedas)
4	Alfabetico

4.2. Agrupacion¶

Grupo	Criterio	Orden
Genericos	tipo = generico	Primero
Marcas	tipo = comercial	Segundo
Combinaciones	es_combinado = true	Tercero

4.3. Gestos¶

Gesto	Elemento	Accion
Tap	Result card	SCR-CAT-003
Tap	Filter chip	Toggle filtro
Tap	"+ Filtros"	SCR-CAT-004
Tap	"Limpiar"	Reset filtros
Tap	Did you mean	Nueva busqueda
Scroll	Lista	Lazy load
Pull down	Lista	Refresh

4.4. Paginacion¶

flowchart TD
    A[Cargar primeros 20] --> B{Scroll al 80%?}
    B -->|Si| C[Cargar siguientes 20]
    C --> D{Hay mas?}
    D -->|Si| B
    D -->|No| E[Mostrar fin de lista]

5. Datos Requeridos¶

5.1. Input Data¶

interface SearchResultsData {
  query: string;
  totalCount: number;
  filteredCount: number;

  // Filtros activos
  activeFilters: Filter[];

  // Resultados agrupados
  results: {
    generics: MedicationResult[];
    brands: MedicationResult[];
    combinations: MedicationResult[];
  };

  // Sugerencia fuzzy
  didYouMean?: string;

  // Paginacion
  hasMore: boolean;
  nextPage: number;
}

interface MedicationResult {
  id: string;
  name: string;
  genericName: string;
  form: string;
  route: string;
  strength: string;
  manufacturer?: string;
  type: 'generic' | 'brand' | 'combination';
  isPopular: boolean;
  matchScore: number;
}

interface Filter {
  id: string;
  type: 'form' | 'route' | 'strength' | 'type';
  value: string;
  label: string;
}

5.2. Output Events¶

Evento	Payload	Destino
onSelectMedication	medication_id	SCR-CAT-003
onFilterToggle	filter	Refiltrar
onFiltersClear	-	Reset
onFiltersOpen	-	SCR-CAT-004
onDidYouMean	suggestion	Nueva busqueda
onLoadMore	page	Paginacion

6. Accesibilidad¶

6.1. Labels¶

Elemento	accessibilityLabel
Result card	"{nombre}, {forma}, {via}"
Filter chip	"Filtro: {valor}, {activo/inactivo}"
Clear filters	"Limpiar todos los filtros"
Did you mean	"Sugerencia: buscar {palabra}"

Evento	Anuncio
Resultados cargados	"{N} resultados para {query}"
Filtro aplicado	"Filtro {nombre} aplicado, {N} resultados"
Cargando mas	"Cargando mas resultados"

7. Metricas¶

7.1. Analytics Events¶

Evento	Parametros
screen_view	screen_name: "search_results"
results_loaded	query, count, time_ms
result_select	medication_id, position, section
filter_apply	filter_type, filter_value
filter_clear	filters_count
did_you_mean_tap	original, suggestion
load_more	page, current_count

8. Referencias¶

Documento generado por MobileUxUiDrone (Eight of Eight)