Daily UI semana 1 (retos 001–008)

Maite Antolin
5 min readDec 17, 2017

--

He empezado con el reto de DailyUI para, como dicen en su web: “ser un mejor diseñador en 100 días”. Se trata de subscribirse y recibir un mail diario (o casi, que los fines de semana te dejan descansar y todo) con pequeños retos que hacer y compartir en redes como Dribbble o Twitter.

Así que aquí estamos. He decidido hacer un post semanal con los retos que hecho durante esa semana, así concentraditos, como pildoritas, e ir mostrando mi evolución. En este caso es un poco más largo porque empecé a medidados de semana y he juntado dos en uno, ofertaca de Navidad :)

Mi idea es intentar hacer todos en la misma línea, pensando en un proyecto que tengo en mente del que os hablaré más adelante. Básicamente es un catalogador de juegos de mesa, llamado provisionalmente Boardland, así, en plan megaresumen. Habrá algunos Daily que encajen y otros que no, eso lo iré viendo sobre la marcha.

Medium, a veces, resta calidad a las imágenes al ajustarlas al ancho, así que dejo abajo un link a drive con los archivos con buena calidad por si quieres echarles un ojo.

Como no me gusta sólo enseñar el resultado final, pongo una mini explicación de lo que he hecho o de las dudas que me han podido asaltar, según el caso.

¡Empezamos!

Reto 001

Diseño de una página de registro.
App móvil

Dudas que he tenido a la hora de realizarlo: No sabía si poner desde el principio el formulario del ‘sign up’ y un botón de registro, o poner las dos acciones a elegir, que ha sido el resultado final. ¿Por qué me decanté por esta solución? Pues porque creo que si se pone el inicio de sesión directamente es más cómodo para el que ya está registrado pero para el que no lo ha hecho todavía puede resultarle confuso, pensando que ahí es donde te registras por primera vez, así que evitamos esa frustración haciendo elegir qué es lo que quiere hacer. De todas formas la app guarda al usuario, no teniendo que pasar por este proceso otra vez.

Reto 002

Diseño de la parte del pago del proceso del checkout.
Web

Este es uno de los casos que no cuadra con el proyecto Boardland, pero he usado la misma estética. Es un check out faseado donde seguimos mostrando el carrito para que no pierda de vista qué es lo que está comprando. Si hubiera más producto se haría scroll down. Damos la opción de guardar los datos de la tarjeta para hacer más rápida y cómoda su próxima compra.

Reto 003

Diseño de una Landing page.
Web

Considero importantes las funcionalidades de la app, así que es lo primero que se ve después de hacer scroll.

El elemento hexagonal se repite a lo largo de toda la landing. Muchos tableros de juegos de mesa se forman a partir de losetas y éstas a menudo tienen forma de hexágono, así que es una manera de representar a los juegos de mesa de manera que los ameris y euros (términos que se usan dentro del mundillo para distinguir tipos de juegos) se sientan identificados.

De igual manera, los miembros del equipo están representados con cartas de personajes, siempre representando a los juegos de mesa.

Reto 004

Diseño de una calculadora.
App móvil

Es una calculadora… poco que decir de este reto, salvo que mantengo la misma estética y le doy más importancia al botón del resultado para que sea más rápido pulsarlo.

Reto 005

Diseño de un icono de una app.
App móvil

Seguimos con la idea de losetas para mostrar la creación de un tablero.

Reto 006

Diseño de un perfil de usuario.
App móvil

El perfil de usuario es muy sencillo. Tienes tu colección de juegos, los juegos que tienes en tu wishlist, los juegos que has patrocinado en kickstarter, para saber cuando está previsto que salga, y el listado de partidas que has echado a tus juegos con la cantidad de partidas ganadas. Tienes acceso a tus ajustes personales, puedes cambiar el modo de visualizar los juegos y ordenarlos por nombre, fecha de inclusión en tu perfil, tipo de juego, número de jugadores, dificultad y fecha de llegada (en el caso de los kickstarter).

Reto 007

Diseño de unos ajustes.
App móvil

En este caso he decido hacer los ajustes del perfil del reto anterior. Al ser de un perfil de usuario consisten en cambiar el alias, el correo y la contraseña principalmente. También gestionar el uso de las notificaciones (si quieres que te avise cuando haya un juego de tu lista de buscados que esté en oferta o algún mensaje del mercadillo, lanzamiento de un juego que sigas, eventos, kickstarter a punto de salir,…). Si hacemos scroll down podemos ver las opciones de desconexión o de borrar tu cuenta de Boardland.

Reto 008

Diseño de una página de error 404.
Web y app móvil

Seguimos haciendo referencia a los juegos de mesa para mostrar el error 404. En este caso es un tablero al que le falta una loseta, como simbología a un link que no se encuentra en el servidor. También he hecho la versión de la app de Boardland.

Aquí termina la primera tanda de DailyUi. La próxima semana más.

Para ver los daily posteriores: Semana 2 | Semana 3

Archivos para ver en detalle.

¡Muchas gracias!

Puedes localizarme en Twitter, LinkedIn o escribiendo a maitea83@gmail.com.

--

--

Maite Antolin

UX designer at Secuoyas. Before at Garaje de ideas and Erretres.