UNIVERSITAT OBERTA DE CATALUNYA
Anexo 5. Capítulo 5:
Manual de usuario
Naxter
Una plataforma de creación y consumo de contenido social
Autor:
Carlos Otero Franjo
Máster en Desarrollo de Sitios y
Aplicaciones Web
por cualquier medio o procedimiento, comprendidos la impresión, la reprografía, el microfilme, el tratamiento informático o cualquier otro sistema, así como la distribución de ejemplares
Índice general
Anexo 5...1
Manual de usuario...1
Subsistema de seguridad...1
Subsistema de administración...4
Subsistema de perfiles...8
Subsistema de publicaciones...14
Subsistema de mensajería...28
Subsistema de merchandising...30
Índice de figuras
Figura 1: Registro...1Figura 2: Login 1...2
Figura 3: Login 2...3
Figura 4: Administración lista usuarios...4
Figura 5: Administración lista usuarios eliminación...5
Figura 6: Administración usuario...6
Figura 7: Administración bloqueo usuario...7
Figura 8: Perfiles lista 1...8
Figura 9: Perfiles lista 2...9
Figura 10: Perfiles búsqueda...10
Figura 11: Perfil detalle no suscrito...11
Figura 12: Perfil detalle suscrito...12
Figura 13: Cuenta...13
Figura 22: Publicación edición 2...22
Figura 23: Publicación detalle 1...23
Figura 24: Publicación detalle 2...24
Figura 25: Temas lista...25
Figura 26: Tema nuevo...26
Figura 27: Tema edición...27
Figura 28: Chat 1...28
Figura 29: Chat 2...29
Figura 30: Merchandising 1...30
Figura 31: Merchandising 2...31
Figura 32: Merchandising 3...32
Figura 33: Producto nuevo...33
Figura 34: Producto edición...34
Figura 35: Producto detalle...35
Figura 36: Carrito...36
ANEXO 5. MANUAL DE USUARIO
Anexo 5
Manual de usuario
Subsistema de seguridad
Una vez registrado el usuario, el sistema permitirá iniciar sesión en la plataforma a partir del usuario y la contraseña. El sistema validará los datos e iniciará la sesión del usuario con el rol genérico correspondiente. Los roles de los usuarios del sistema son: sin autenticación, genérico, consumidor, moderador, productor y administrador, y cada rol superior tendrá los permisos de este rol y del rol inmediatamente inferior.
En este inicio de sesión el sistema genera el token JWT, lo envía al cliente, y este lo almacena en el Locale Storage. Estos tokens se validarán en cada envío para verificar la autenticidad del usuario y los permisos, para así validar si se permite realizar cada petición
Figura 2: Login 1
ANEXO 5. MANUAL DE USUARIO
En caso de que se introduzca de manera incorrecta los datos el sistema mostrará un mensaje de error indicando que se introduzca el usuario y contraseña correctamente.
Figura 3: Login 2
Subsistema de administración
Los usuarios con rol moderador y administrador tendrá acceso a la sección de administración de usuarios. En esta sección los usuarios moderadores visualizarán únicamente la columna de bloqueo de usuarios, mientras que los administradores visualizarán todas las columnas de acciones, tal y como se muestra en la imagen. Desde esta pantalla de usuarios, se podrá acceder a la edición de usuarios, su bloqueo y eliminación del sistema.
Figura 4: Administración lista usuarios
ANEXO 5. MANUAL DE USUARIO
En caso de seleccionar la opción de eliminación del usuario, se mostrará un modal de confirmación.
Figura 5: Administración lista usuarios eliminación
En el detalle de usuario, se permitirá a los usuarios con rol administrador editar los datos personales e identificadores del resto de usuarios, como también sus roles. Desde esta pantalla también se permitirá bloquear y eliminar al usuario del sistema.
En caso de editar el propio usuario o rol sobre el usuario que ha iniciado la sesión, el sistema deberá realizar el proceso de actualización del token JWT, para tener en la nueva clave cifrada tanto el nuevo nombre como el perfil del usuario, y así permitir realizar las funcionalidades correspondientes a su nuevo perfil, y validando y autenticando cada una de sus nuevas peticiones.
Figura 6: Administración usuario
ANEXO 5. MANUAL DE USUARIO
En caso de editar los datos o bloquear/desbloquear al usuario se mostrará un mensaje informando del estado de la acción.
Figura 7: Administración bloqueo usuario
Subsistema de perfiles
En el módulo de perfiles se permitirá realizar a los usuarios con rol genérico una búsqueda por el nombre de usuario, visualizar las cards de estos, y acceder a su detalle, y a los usuarios con rol consumidor suscribirse, desuscribirse y acceder al chat de mensajería con el resto de usuarios, tal y como se puede observar en la imagen anterior.
Figura 8: Perfiles lista 1
ANEXO 5. MANUAL DE USUARIO
En esta imagen se puede observar el flujo de cards de los perfiles de los usuarios de la plataforma.
Figura 9: Perfiles lista 2
En esta imagen se puede observar el sistema de búsqueda de los perfiles de usuario de la plataforma a través de su nombre.
Figura 10: Perfiles búsqueda
ANEXO 5. MANUAL DE USUARIO
Accediendo al detalle del perfil de usuario se podrán visualizar los datos de usuario, email, nombre, fecha de nacimiento, descripción y valoración, que será la media de las valoraciones de sus publicaciones en caso de tener el rol de productor.
Si el usuario logueado en la plataforma tiene un perfil consumidor, desde esta pantalla también se permitirá suscribirse o desuscribirse al usuario del perfil, en caso de que el usuario del cual se esté observando el detalle de su perfil tenga un rol productor. Y también se podrá visualizar una tarjeta de información en caso de estar o no suscrito al usuario productor.
Figura 11: Perfil detalle no suscrito
En esta imagen se puede observar el estado del perfil en caso de estar ya suscrito al usuario con perfil productor.
Figura 12: Perfil detalle suscrito
ANEXO 5. MANUAL DE USUARIO
Los usuarios con perfil genérico podrá acceder a su cuenta de perfil desde el menú superior de navegación. En este formulario se podrá editar el detalle de sus datos de usuario, email, nombre, descripción y fecha de nacimiento. También se permitirá visualizar el número de visitas al perfil por otros usuarios, el rol actual del usuario y la valoración, la cual será la media de las valoraciones de sus publicaciones en caso de tener rol productor.
En caso de que el usuario tenga perfil genérico podrá actualizar su perfil a consumidor, y viceversa, a través de la opción Permitir suscribirse a los creadores de contenido y valorar y
Figura 13: Cuenta
Subsistema de publicaciones
En la pantalla de inicio el sistema muestra en un slider el top 10 de publicaciones con mejores valoraciones, y la lista de publicaciones con más valoración de los usuarios a los cuales está suscrito. Y en caso de no tener iniciada la sesión, únicamente se mostraría el slider, para todos los usuarios que no han iniciado todavía la sesión.
Figura 14: Home 1
ANEXO 5. MANUAL DE USUARIO
En esta imagen se puede observar la publicación del usuario correspondiente, al cual está suscrito el usuario logueado en el sistema.
Figura 15: Home 2
En la sección de publicaciones el sistema muestra la lista de cards de las publicaciones, con la opción de edición y eliminación en caso de ser creadas por el propio usuario con perfil productor, y la opción genérica en la parte superior de creación de una nueva publicación.
En caso de que el usuario tenga rol genérico únicamente se podrá visualizar la lista de publicaciones sin entrar al detalle, y en caso de tener rol moderador se permitirá tanto la eliminación como la edición de todas las publicaciones. La lista se podrá filtrar por los campos de búsqueda de tema, nombre y autor, y el detalle será accesible a través de los usuarios con perfil consumidor.
Figura 16: Publicaciones lista 1
ANEXO 5. MANUAL DE USUARIO
En la imagen anterior se puede observar la lista de publicaciones del sistema.
Figura 17: Publicaciones lista 2
En este caso se puede observar la búsqueda a través de los campos especificados de las publicaciones resultantes del sistema.
Figura 18: Publicaciones búsqueda
ANEXO 5. MANUAL DE USUARIO
En caso de seleccionar la opción de eliminación de la publicación se mostrará un modal de confirmación al usuario de la plataforma.
Figura 19: Publicaciones lista eliminación
En caso de seleccionar la opción de registro de una nueva publicación, se mostrará un formulario con los datos de nombre, selección de los temas previamente registrados, y una descripción.
Figura 20: Publicación nueva
ANEXO 5. MANUAL DE USUARIO
En caso de seleccionar la opción de edición de una publicación, se mostrará un formulario con los datos ya registrados y editables del nombre, la selección de los temas previamente registrados deshabilitada, y la descripción.
A mayores se mostrará un formulario de registro de etiquetas representativas de la publicación a través del nombre y su descripción. En este formulario de edición también se mostrará la opción de eliminación de la publicación.
Figura 21: Publicación edición 1
Las etiquetas de la sección de edición de una publicación podrán añadirse a la publicación a través del formulario de la imagen mostrada, con el nombre de la etiqueta obligatorio y la descripción de la etiqueta opcional. A mayores se muestra la opción de eliminación de cada una de las etiquetas registradas previamente en la tabla mostrada inmediatamente inferior al formulario de registro.
Figura 22: Publicación edición 2
ANEXO 5. MANUAL DE USUARIO
En el acceso al detalle de una publicación por un usuario con perfil consumidor, se mostrarán los datos de los campos de la publicación de autor, tema, etiquetas, descripción y fecha de registro. A mayores se tendrá la opción de insertar una valoración de la publicación en caso de no estar registrada por el usuario que inició sesión en el sistema, la cual se registrará en el sistema, e inmediatamente después se mostrará actualizada en la publicación a través de la media de todas la valoraciones del resto de usuarios sobre esta publicación.
En la parte inferior de la publicación se muestra la lista de comentarios y un formulario de Figura 23: Publicación detalle 1
La sección de comentarios de una publicación se basa en un formulario de texto para el registro de comentarios de un usuario de perfil consumidor. Este campo es obligatorio, y una vez registrado, se mostrará el comentario en la parte superior de la lista como comentario más reciente.
En caso de ser un comentario registrado por el propio usuario podrá ser editado y eliminado, y en caso de ser un usuario con perfil moderador también podrá eliminar estos comentarios.
Figura 24: Publicación detalle 2
ANEXO 5. MANUAL DE USUARIO
En la pantalla de publicaciones se puede acceder a la sección de temas a través de la opción de la gestión de temas, en caso de tener un perfil productor. En esta pantalla únicamente se mostrarán los temas del usuario que ha iniciado sesión, y se permite realizar una búsqueda a través del filtro del nombre del tema, acceder al detalle de los temas y registrar uno nuevo en la plataforma.
Figura 25: Temas lista
En caso de seleccionar la opción de registro de un nuevo tema se mostrará un formulario con el nombre del tema y su descripción.
Figura 26: Tema nuevo
ANEXO 5. MANUAL DE USUARIO
En caso de acceder al detalle de un tema se mostrará un formulario con el nombre del tema deshabilitado y su descripción.
Figura 27: Tema edición
Subsistema de mensajería
Los usuarios con perfil consumidor podrán acceder al chat de mensajería con otro usuario a través de la opción de chat que se muestran en cada una de las cards de la sección de perfiles. En esta pantalla se muestra la lista de mensajes ordenados y ya realizando automáticamente un scroll a la parte inferior del chat donde se encuentran los mensajes más recientes.
En esta sección existe un proceso de actualización periódica cada 5 segundos en el componente del chat en caso de haber recibido algún mensaje del otro usuario, y también cada vez que se envía un mensaje nuevo. A mayores se tiene en el sistema la funcionalidad de
Figura 28: Chat 1
ANEXO 5. MANUAL DE USUARIO
En esta pantalla se puede observar la lista de mensajes más recientes de la conversación entre los dos usuarios de la plataforma.
Figura 29: Chat 2
Subsistema de merchandising
La sección de merchandising es solo accesible para usuarios con perfil consumidor y a través de esta se realizará la gestión de los productos en venta de la plataforma.
En esta sección se permite realizar una búsqueda a través de la selección de las áreas previamente registradas, el nombre del producto y su vendedor. La lista de productos, los cuales son de los usuarios productores que tienen su sección de merchandising activa, se muestran a través de cards con los datos de nombre, área, precio, stock y descripción, y con las
Figura 30: Merchandising 1
ANEXO 5. MANUAL DE USUARIO producto, en caso de tener perfil productor y la sección de merchandising activa, y el acceso a la lista de productos añadidos al carrito de la plataforma.
En esta imagen se muestra la lista de productos de merchandising de la plataforma.
Figura 31: Merchandising 2
En esta imagen se puede observar la búsqueda de productos a través de los filtros especificados y los productos resultantes de la plataforma.
Figura 32: Merchandising 3
ANEXO 5. MANUAL DE USUARIO
En caso de seleccionar la opción registro de un nuevo producto se mostrará un formulario con los campos de nombre, área de merchandising, precio, stock disponible y descripción.
Figura 33: Producto nuevo
En caso de seleccionar la opción edición de un producto, la cual se mostrará para los productos registrados previamente por el usuario logueado, permitirá visualizar un formulario con los campos editables de los datos del producto de nombre, área de merchandising con el campo deshabilitado, precio, stock disponible y descripción del producto. La opción de eliminación del producto estará disponible para el usuario con rol productor que registró el producto y para los usuarios con perfil de moderador de la plataforma.
Figura 34: Producto edición
ANEXO 5. MANUAL DE USUARIO
En el detalle del producto, accesible para los usuarios con perfil consumidor, se permite visualizar los datos de nombre, vendedor, área de merchandising, precio, stock, descripción y fecha de registro. A mayores también se podrá visualizar en una tarjeta si este producto se encuentra ya disponible o no en el carrito del usuario de la plataforma.
Figura 35: Producto detalle
En caso de seleccionar la opción de visualización de la lista actual de productos del carrito del usuario con rol consumidor de la plataforma, se mostrará una lista de cards con el detalle de cada uno de los productos y la opción de quitar el producto del carrito, y en la parte superior de la lista, el precio total sobre todos los productos añadidos al carrito del usuario de la plataforma.
Figura 36: Carrito
