Wireframing: Youtube

Irene Garcia Garin
3 min readSep 24, 2020

--

Antecedentes

Youtube se trata probablemente de uno de los sitios webs dedicado a compartir videos más conocidos del planeta. Presenta gran cantidad de clips de películas, programas de televisión, videos musicales e incluso contenido propio creado por personas conocidas como youtubers.

Esta plataforma goza de un público muy amplio ya que en ella podrás encontrar todo tipo de contenido como se ha mencionado con anterioridad. Esto hace que tanto el sitio web como la aplicación tengan que ser muy intuitivas y que la información esté muy organizada para facilitar su uso. Es por ello que he querido replicar esta aplicación y entender un poco más a fondo su funcionamiento pues soy consumidora diaria de ella.

Elementos de UI

Los elementos que vamos a encontrar a lo largo del user flow en Youtube son los siguientes:

  • Botones
  • Iconos de selección
  • Desplegables
  • Imagenes

User Flow

Este user flow se inicia una vez estas dentro de la aplicación y aparecen los videos de los canales a los que estás suscrito. A partir de ahí se diseñan los wireframes en el que seleccionas un video, visualizas el contenido del apartado de información, decides compartir dicha publicación y lo haces a través de la copia del enlace.

Wireframes

Para la correcta comprensión del flujo de usuario se ha desarrollado un prototipo de la aplicación utilizando la herramienta de InVision. Podrás visualizarlo en el siguiente enlace.

Conclusión

La realización de este challenge ha hecho que me de cuenta de la necesidad de simplificar el diseño de una aplicación a la hora de crear prototipos pues, en comparación con tener que incorporar todos y cada unos de las imágenes e iconos, la diferencia en tiempos y recursos es abismal.

Espero que os haya parecido interesante este articulo. Gracias por vuestro tiempo.

Irene G Garín

--

--