¡Bienvenidos una vez más, compañeros!

Hoy vamos a explorar en detalle la creación de un prototipo para el apartado de actualidad en la web de la conocida revista ¡Hola!, sumergiéndonos en el proceso meticuloso que implica la materialización de un prototipo y su precursor esencial, el wireframe, pues es esencial comprender su papel fundamental. Podemos imaginar el wireframe como el esqueleto de una estructura digital. Es un componente esencial del proceso de diseño y se centra en la disposición y organización de elementos, dando prioridad a la funcionalidad por encima de la estética. Se trata de una representación esquemática en la que se establece la jerarquía y la distribución de contenido, proporcionando así una visión clara de la arquitectura de la información antes de entrar en detalles visuales.

El wireframe sirve como un plano que delinea las interacciones y la navegación del usuario, asegurando de esta manera que cada elemento cumpla su propósito de manera efectiva. Es en esta etapa donde se toman decisiones cruciales sobre la ubicación de botones, la estructura de menús y la disposición general de la interfaz. Este enfoque en la funcionalidad cruda sienta las bases para el desarrollo del prototipo, permitiendo una comprensión profunda de la experiencia del usuario antes de que la estética entre en juego.

En definitiva, antes de que los colores y las imágenes cobren vida en el prototipo, el wireframe actúa como el cimiento racional y estructural del diseño, asegurando que la forma siga a la función.

Aquí abajo podéis ver algunas capturas del prototipo realizado en Figma, construido en base al wireframe inicial. Podéis hacer click en ellas si queréis verlas más grandes. Si queréis disfrutar de la experiencia completa, podéis pinchar aquí para ver el prototipo y aquí si queréis ver los componentes. Si tenéis alguna sugerencia o crítica constructiva, no dudéis en comentarlo.

¡Nos vemos en la próxima!

Wireframe de una publicación

Figma

Una visita al traumatólogo

Antecedentes

El recorrido que aquí describo son las interacciones que vivencié al ir al traumatólogo el pasado martes. Hace tres semanas me accidenté y debido a ello fui llevada a Urgencias porque tenía un dolor intenso que me impedía caminar luego de tropezar en la vía pública. Luego dada de alta y al ver que no había una mejora notable, llame a urgencia nuevamente. Esta vez me pidieron una resonancia magnética para ver qué había de malo en mi rodilla. A los pocos días fui realizarme la resonancia y era necesario volver al traumatólogo, esta vez en consulta externa para ver los resultados y que me pautara el tratamiento, operación o lo que me dijeran que debía de hacer. Una semana antes del día que describo, solicité la cita vía telefónica.

¡El día y la hora ha llegado!

Estos días han sido bastante poco habituales. El cansancio hace que me despierte más tarde de lo habitual y con menos energía. El día martes a las 12 horas debía de estar en el hospital para pasar la visita. Por esa razón, me comencé a prepararme antes (10:30). Una vista en GoogleMaps en mi móvil describía el recorrido, el tiempo, y las opciones que mejor podía tener para poder ir por transporte público. Con una sencilla acción había podido determinar a qué hora era necesario que saliera de mi casa para llegar a tiempo a la cita. Igualmente, era necesario duplicar los tiempos en los desplazamientos a pie que Google marcaba. No encontré una opción para calcular para una persona con baja movilidad.

Lista para comenzar el recorrido, la siguiente interacción fue tener que cerrar la puerta, y finalmente concentrarme para poder bajar las cuatro plantas de la finca en la que vivo. La velocidad tan lenta, para poder bajar uno por uno los peldaños, daban la sensación de estar fuera de tiempo.

Ya fuera de casa la ruta hasta la parada del bus fue una experiencia plena de interacciones. El duelo de las calles del centro de Barcelona son bastante irregulares y con el dolor del impacto, estuve muy atenta a donde pisaba. LA obras que en este momento se hacen en la Vía Laietana, muy cerca de mi casa, la causa de mi accidente, hacían que el llegar a la parada pareció una gran caminata. Llegado el bus, lamentablemente las personas en muletas no podemos pedir la rampa para sillas de ruedas.

Ya en el interior del bus, las interacciones son bastante diversas, lo primero era picar el billete en la máquina para marcarlo. Bastante complicado porque tuve que equilibrar un poco para poderlo picar. Solicité los asientos preferentes par persona con movilidad reducida y me presté a llamar al hospital, luego de observar que Google Maps me marcaba ya un retraso de 10 min.  Llama, llama…ocupado….marque 1…marque 2…

El bus demoraba con el tráfico de mediodía. Finalmente,  llegó, pero llegó muy tarde. Caminar nuevamente era un problema. La zona alta de Barcelona no es tan plana como el centro. No había grietas, pero sí bastante pendientes en el camino. Quedaba poco, así que el ánimo no decaía ni con el sol de mediodía y el esfuerzo de llevar las muletas.

En el hospital también hay muchas interacciones. Lo primero fue ubicar el consultorio, un módulo de información y una asistenta me ayudó a saber a donde ir. Ascensor a la primera planta. Seleccionar el número y llegar a la consulta. Había algo que también debía hacer para ser atendida. Dar la tarjeta de la mutua. Esperarpacientemente, ver mi movil y estudiar mientras…

…Y finalmente… el diagnóstico!

¡Buenas tardes!

El recorrido escogido es uno que realizamos cada día sobre las 14 horas: comer en la oficina. Las fases son realmente sencillas pero, sin embargo, disponen de un amplio abanico de distintas interacciones.

Fase 1.

Fichaje de salida

Fase 2.

Sacar comida del frigorífico

Calentar comida en el microondas

Llenar botella de agua

Fase 3. Comida

Encender el aire acondicionado

Escoger entretenimiento

Fase 4. Café

Rellenar el depósito de la cafetera

Cafetera

Fase 5. Regreso

Luz del baño

Fichaje de entrada