Cinebox
15 minutos de lectura
Diseño UX/UI
Aplicación Nativa
Aplicación Nueva
Índice
Contexto
Investigación
Benchmarking
User Persona
POV: Point Of View
MVP: Minimum Viable Product
Cardsorting
Arquitectura de la Información
Taskflow y Userflow
Wireframe: Baja, Media y Alta Fidelidad
Pruebas de Usabilidad
Evaluación Heurística
Análisis
1/14: Contexto
El auge del streaming en 2020:
Al inicio de 2020, los servicios de streaming vivieron un gran crecimiento exponencial. Con el confinamiento, el consumo masivo de contenido digital se disparó, y ver películas o series en tendencia se convirtió en una de las principales formas de entretenimiento diario.
Saturación: Surgieron quejas sobre la cantidad de plataformas disponibles, ya que muchos usuarios desconocían cuántas existían y el costo de todas. Con catálogos interminables, llevó a muchas personas a buscar alternativas para ahorrar y decidir qué plataforma realmente valía la pena.
2/14: Investigación
Para entender mejor qué está pasando con el streaming, investigamos cómo buscan los usuarios plataformas como Letterboxd e IMDb en Google Trends.
También encontramos algunas notas que muestran cómo el streaming creció en los últimos años, tanto en Argentina como en el mundo. Con esta info, podemos ver qué tan relevante es el tema y qué oportunidades hay para mejorar la experiencia de los usuarios.
Búsquedas en Argentina
Fuente: Google Trends
Letterboxd
IMDb
Link al prototipo mobile
Proyecto Académico: Curso de Diseño UX/UI en Coderhouse.
Rol: Diseñadora de Experiencia de usuario y de Interfaces.
Tiempo: 3 meses | julio 2021 - octubre 2021
Más de 25 pantallas
Metodología: El Diseño Centrado en el Usuario (DCU) es un enfoque que prioriza las necesidades del usuario en tres fases:
Análisis: Se investiga y comprende a los usuarios y sus necesidades.
Diseño: Se crean soluciones basadas en los hallazgos del análisis.
Validación: Se prueban y ajustan las soluciones según la retroalimentación de los usuarios.
Sobre el caso
Objetivo: El objetivo de esta aplicación es ayudar a los usuarios a encontrar rápidamente lo que buscan, además de permitirles interactuar con otros para opinar sobre películas o series.
Problema: Las múltiples plataformas de streaming actuales tienen catálogos extensos, lo que hace que elegir algo para ver en el momento sea abrumador. Además, no cuentan con un apartado para interactuar con otros usuarios.
Solución: La solución es una aplicación con un buscador avanzado, rápido y fácil de usar. También está dirigida a la comunidad cinéfila, permitiendo conversar, votar, hacer listas y llevar un seguimiento de sus series o películas favoritas.
100
50
25
75
18 oct 2020
07 oct 2021
30 may 2021
19 sep 2021
Notas periodísticas
Plataformas de streaming ya alcanzaron 25% del mercado televisivo a nivel mundial | La República
El mercado de streaming y video crece en Argentina y proyecta un 2021 aún más positivo | El periódico
2020: el año de streaming; así está cambiando el mundo esta tendencia | El periódico
3/14: Benchmarking
Realizamos un análisis exhaustivo de la competencia a través de un Benchmarking detallado. Evaluamos su trayectoria en el mercado, identificando sus fortalezas y debilidades, lo que nos permitió definir qué aspectos adoptar y cuáles evitar en nuestro proyecto.
Fortalezas
Debilidades
IMDb
IMDb tiene una gran comunidad de cinéfilos por todo el mundo, tiene el mayor feedback a comparación que las otras aplicaciones.
Las notas o entrevistas al reparto o directores no están traducidas.
JustWatch
Es una de las guías de streaming más famosas, tiene muchísimas plataformas incluidas en su aplicación.
Tiene errores a la hora de buscar película y verla, no están actualizadas. No deja hacer comentarios.
Letterboxd
Tiene un buscador súper completo, se puede buscar películas, reviews, listas, actores y demás.
Toda la aplicación está en inglés. El diseño y así como el vocabulario es confuso.
4/14: User Persona
Creamos User Persona es como un personaje basado en usuarios reales. Nos ayuda a entender mejor qué necesitan, qué los motiva y qué les frustra, para crear productos y experiencias que realmente les sirvan. Ahora te presentamos a Nicole y María, dos personas con intereses y necesidades distintas.
Nicole es una profesora de nivel inicial.
GBA - 34 años
“Nada se compara a disfrutar de una buena película con mi hija“
Aplicaciones que más usa:
Relación con el producto
Nicole busca una plataforma que le recomiende contenido según sus gustos y tiempo, con listas personalizadas y acceso a una comunidad de cine y teatro.
Frustraciones
Solo tiene tiempo los fines de semana para ver series o películas.
No quiere pagar todas las plataformas de streaming.
Le cuesta encontrar películas que se alineen con sus intereses sin perder tiempo buscando.
Sobre su entorno
Vive en el GBA con su hija de 7 años, comparte recomendaciones de películas con sus amigos y busca mejorar sus habilidades teatrales.
Metas
Compartir momentos de calidad viendo películas familiares con su hija.
Disfrutar y aprovechar al máximo sus clases de teatro.
Descubrir películas que enriquezcan su conocimiento y experiencia en el teatro.
Aspectos generales
Le interesa el cine, pero aún se considera principiante.
Tiene una rutina ocupada y le cuesta encontrar contenido rápidamente.
Prefiere aplicaciones intuitivas y fáciles de usar.
María es creadora de contenido y se dedica a hacer críticas de películas y series.
CABA - 22 años
“Quiero mejorar mis videos y hacer mejores críticas para mi audiencia“
Aplicaciones que más usa:
Relación con el producto
María busca herramientas para mejorar la edición de sus videos, descubrir contenido relevante y participar en comunidades donde pueda debatir sobre cine y series.
Frustraciones
Las series le consumen mucho tiempo en su día a día.
No cuenta con una buena cámara para grabar sus videos.
Le preocupa que su público no acepte sus críticas sobre ciertos géneros.
Sobre su entorno
Vive en CABA y comparte su pasión por el cine con su novio y su contenido se basa en la interacción con su audiencia, que espera críticas bien fundamentadas.
Metas
Aprender más sobre edición de video para mejorar la calidad de sus críticas.
Crear contenido atractivo y bien estructurado para su público.
Organizar mejor su tiempo para poder disfrutar más con sus mascotas.
Explorar y analizar nuevos géneros, especialmente el terror.
Aspectos generales
Es apasionada por el análisis cinematográfico y busca perfeccionar su estilo crítico.
Prefiere aplicaciones intuitivas
que le permitan ahorrar tiempo en la edición y gestión de contenido.
5/14: POV: Point Of View
El storyboarding en UX es una herramienta clave para visualizar y predecir la experiencia del usuario con un producto, permitiendo comprender su flujo de interacción a lo largo del tiempo. Al integrarlo con el storytelling, se crea una narrativa sólida que conecta con el público y mejora la experiencia del usuario, facilitando el diseño de productos más intuitivos y atractivos.
Storyboard
Recomendación de la película en las clases de teatro.
El usuario investiga en qué plataforma está la película.
El usuario, gracias a Cinebox, encuentra la película en Netflix.
Finalmente, el usuario puede ver la película con su hija.
Storytelling
Nicole tiene 34 años y vive en GBA con su esposo y su hija. Es una persona curiosa, con ganas de aprender algo nuevo cada cierto tiempo. Durante la semana trabaja como maestra, y los fines de semana disfruta de su curso de teatro, donde sus amigos le recomiendan muchas películas. Sin embargo, Nicole necesita saber dónde puede verlas y si son aptas para disfrutar en familia. Además, le motiva intercambiar opiniones en redes sociales junto a sus amigos.
Diseño
6/14: MVP: Minimum Viable Product
Es la versión más simple de un producto, con solo las funcionalidades esenciales para que los usuarios lo prueben y den su opinión. La idea es lanzar rápido, aprender de la experiencia real y mejorar con base en el feedback, en lugar de gastar tiempo en detalles innecesarios desde el principio.
Notificaciones: Dentro y fuera de la aplicación.
Comentarios: Los usuarios podrán participar en comentarios interactuando entre ellos.
Calificación: Posibilidad de calificar por medio de estrellas.
Guardar: El usuario puede guardar el contenido el contenido en una lista personalizada.
Compartir: Posibilidad de compartir cualquier contenido en otras redes sociales.
Buscar: Se podrá buscar el contenido mediante filtros.
Registro y login: El usuario deberá crearse una cuenta para usar la aplicación.
7/14: Cardsorting
Gracias a los resultados del cardsorting, pudimos obtener una mejor clasificación y agrupación de los grupos. Se les pidió a los participantes nombrar y ordenar un total de 13 tarjetas. Participaron 15 personas, de las cuales 8 lograron completar la tarea al 100%.
Según los resultados del dendrograma y la matriz de similitud, se identificaron tres grupos principales, los cuales coincidieron con la propuesta original.
Conclusión: El 63% de los participantes agrupó las tarjetas en las categorías de contenido: Películas y series. Del mismo modo, ubicaron Actores y directores dentro de la categoría Buscar.
El 50% coincidió en que las tarjetas de Terror y Comedia deberían posicionarse dentro de la categoría Géneros.
Otro 50% nombró una categoría Inicio, en la cual ordenaron las tarjetas relacionadas con Mi cuenta. Dentro de esta categoría se incluyeron etiquetas como Mis listas, Mis reviews y Ver más tarde.
Inicio
Mi cuenta:
Mis listas
Mis reviews
Ver más tarde
Buscar
Categorías:
Películas
Series
Directores
Actores
Géneros
Terror
Comedia
Acción y aventuras
Romance
Cardsorting: Tarjetas
Categorías
Películas
Directores
Series
Actores
Terror
Acción y aventuras
Comedia
Ver más tarde
Mi cuenta
Mis listas
Mis reviews
Romance
8/14: Arquitectura de Información
Con AI organizamos y estructuramos los contenidos dentro de la aplicación para que los usuarios encuentren lo que buscan de forma rápida y sencilla. Se define cómo se agrupan las secciones, cómo se navega entre ellas y cómo se presenta la información, asegurando una experiencia clara y fluida. En este caso, buscamos que esta AI que se adapte a las necesidades de Nicole y María, facilitando su acceso a contenido relevante.
Buscar
Recomendaciones
Filtros
Géneros de película/serie
Categorías: Tiempo de reproducción - Actores y directores
Inicio
Tendencias
Nuevo
En cines
Próximamente en cines
Mi cuenta
Ingresar
Mi perfil
Editar perfil
Mis reviews
Watchlist
Ver más tarde
Mis listas
Onboarding
Inicio
9/14: Taskflow y Userflow
Gracias al User Flow, que representa el recorrido que sigue un usuario dentro de un sitio web, podemos visualizar de manera clara y estructurada su interacción con la interfaz, identificando puntos clave como decisiones, acciones y posibles fricciones en la experiencia.
Entra a la web
Entra a la seción de Buscar
Selecciona los filtros
Selecciona una película
Verifica los productos
seleccionados
Abre la sección de comentaroa para dar una reseña
Objetivo: Nicole quiere darle una reseña a una película
10/14: Wireframes
Login - Baja fidelidad
Onboarding - Baja fidelidad
Inicio - Baja fidelidad
Buscador - Baja fidelidad
Película - Baja fidelidad
Login - Media fidelidad
Onboarding - Media fidelidad
Inicio - Media fidelidad
Buscador - Media fidelidad
Película - Media fidelidad
Validación
11/14: Pruebas de Usabilidad
Hicimos pruebas con 4 personas para ver qué tan fácil y clara es la app. Queríamos saber si podían navegar sin problemas, encontrar lo que buscaban y usar funciones como dejar reseñas, calificar contenido y revisar la guía de padres.
Usuario 1: Nicolás E. - 22 años
Usuario 2: Lucas - 21 años
Usuario 3: Nicolás D. - 32 años
Usuario 4: Guillermo - 53 años
Objetivo: Lograr que los usuarios comprendan la navegación de la aplicación y realicen las tareas asignadas sin complicaciones. Evaluar la satisfacción de los participantes al utilizar el prototipo en media fidelidad.
Lo que funcionó:
Posibilidad de dar reviews y puntuar.
Compartir películas, series y actores.
Guía de padres para evaluar el contenido.
Calificación y opción de favoritos para actores.
Lo que no funcionó:
Demasiadas estrellas en la calificación (diez resulta excesivo).
No se puede ver la guía de padres de antemano ni filtrarla.
Tendencias desordenadas.
La información y el reparto deberían estar en la misma pantalla de la película.
Recomendaciones:
Agregar más herramientas sociales: opción de seguir, chatear y comentar entre usuarios.
Incluir usernames con arroba para mayor personalización.
Permitir filtrar por usuarios en las categorías de búsqueda.
Implementar un sistema de prestigio para reseñadores: los usuarios con reseñas más valoradas ganan relevancia y confianza. Si un comentario es destacado, el usuario sube de nivel y se convierte en un crítico reconocido.
Mostrar actores en la misma pantalla que la película para facilitar el acceso a la información.
Destacar en la pantalla de inicio las reseñas de usuarios con más "me gusta" y comentarios.
Organizar y categorizar mejor la sección de tendencias para mejorar la experiencia de navegación.
Escenario Hipotético
Imaginemos que te recomendaron una película de terror para ver con tu hija, pero antes de ponerla, querés asegurarte de que sea apta para niños de 12 años.
Una vez que terminaste de verla, querés puntuarla en la aplicación para dejar tu opinión. Además, el protagonista te pareció increíble (o quizás no tanto), así que también decidís calificar su actuación.
Tareas a realizar:
Usar la app para verificar si la película es apta para menores de 12 años.
Calificar la película una vez vista.
Puntuar al actor o actriz principal.
Eficacia: completó la tarea satisfactoriamente con facilidad
1: tarea copletada con éxito
0: la tarea NO pudo ser completada correctamente
Tarea 1: Encontrar la guía de padres
Tareas
1
Usuario 1
Usuario 2
Usuario 3
Usuario 4
Promedio
1
1
1
1
1
1
1
1
1
1
1
1
1
1
Tarea 2: Calificar una película
Tarea 1: Calificar un actor
Conclusiones:
Todos los usuarios completaron exitosamente la tarea, aunque el usuario 3 dio un comentario que hacer: "Me gusta la idea de la guía de padres, pero igual estaría bueno que, desde la búsqueda, se pueda filtrar por edades".
Eficacia: Cantidad N° de pasos para lorar la tarea
Tarea 1: Encontrar la guía de padres
Tareas
2
Usuario 1
Usuario 2
Usuario 3
Usuario 4
3
2
3
3
3
3
3
3
3
3
3
Tarea 2: Calificar una película
Tarea 1: Calificar un actor
Conclusiones:
Todos lograron encontrar la película, aunque dos usuarios se ahorraron un paso con tan solo tocar la película en "más buscados" y sin tocar la categoría de terror que se encontraba abajo del buscador.
Satisfacción: Completó la tarea satisfactoriamente
Valoración:
Muy difícil (5) - Difícil (4) - Indistinto (3) - Sencillo (2) - Muy sencillo (1)
Tarea 1: Encontrar la guía de padres
Tareas
1
Usuario 1
Usuario 2
Usuario 3
Usuario 4
Promedio
1
1
2
1.25
1
1
1
3
1.5
2
1
2
2
2
Tarea 2: Calificar una película
Tarea 1: Calificar un actor
Conclusiones:
Todos los usuarios coincidieron en que era dinámico y fácil de llegar a donde se quería.
12/14: Evaluación Heurística
Al revisar nuestro diseño y realizar pruebas, detectamos la ausencia de algunas heurísticas claves:
Minimizar el uso de la memoria
Visibilidad del estado del sistema
Flexibilidad y Eficiencia de uso
Consistencia entre el sistema y el mundo real
Diseño minimalista
Control y Libertad para el usuario
Reconocer, diagnosticar y recuperarse de los errores
Consistencia y Estándares
Ayuda y Documentación
Prevención de errores
¡Momento de iterar!
Durante toda la fase de pruebas y validación, se iteró reiteradas veces para mejorar el diseño y la navegación, facilitando la adaptación a las necesidades de los usuarios. Se tomaron en cuenta las dificultades que experimentaron los 4 usuarios en la prueba de usabilidad y la evaluación heurística, lo que permitió realizar cambios y agregar pantallas al prototipo.
Se iteró en:
Cantidad de estrellas: Se ajustó la forma en que se muestran las estrellas al momento de votar.
Reparto: Se añadió la sección de reparto en la pantalla principal de la película.
Tendencias: Se categorizaron las tendencias de películas y series desde el inicio.
Recomendaciones: Junto a las tendencias, se muestran recomendaciones de películas y series.
Username: Se agregó la opción de utilizar un "username" con arroba para el usuario.
Visibilidad del estado del sistema: Animación de carga: Se añadió una animación de carga en el tráiler para mejorar la visibilidad del estado del sistema.
Prevención de errores: Contraseña segura: Se implementó una validación para asegurar que la contraseña tenga al menos 8 caracteres al momento de registrarse.
Minimizar el uso de la memoria: Predicción de palabras: Se optimizó el uso de la memoria con la predicción de palabras en las pantallas del buscador de películas y configuración.
Flexibilidad y Eficiencia de uso: Onboarding: Se añadió la opción de omitir el Onboarding si el usuario lo desea, mejorando la flexibilidad y eficiencia de uso.
Reconocer, diagnosticar y recuperarse de los errores: Pantalla de error: Se implementó una pantalla de error para cuando el usuario selecciona varios filtros o el contenido no se encuentra, facilitando el reconocimiento, diagnóstico y recuperación de errores.
Ayuda y Documentación: Se creó un apartado de ayuda en la sección de configuración de CINEBOX.
Link al prototipo mobile
¡MUCHAS GRACIAS!