Práctica XIV .- “Ejemplo de Modelo IFML: Online Music Store: Buscar Albúm con Pencil Project y Editor IFML: buscar álbum”

Tienda de música: buscar un álbum

PENCIL PROJECT Y IFML MODEL

Música Online: Buscar un Álbum

https://es.slideshare.net/mbrambil/ifml-interaction-flow-modeling-language-tutorial-ui-ux-modeling-design-icwe-2014-object-management-group-by-marco-brambilla

Práctica XIII .- “Ejemplo de Modelo IFML: Online Book Store con Pencil Project y Editor IFML: proceso de pago”

Tienda de libros en línea: proceso de pago

PENCIL PROJECT

Cuando el usuario decide hacer el pago, debe de capturar su información personal y presionar el botón “Next”.

Ahora procederá a capturar su información bancaria y pagar. Se mostrarán los detalles del pago posteriormente.

IFML MODEL

Cuando el usuario escoge la opción “Checkout”, el contenedor “Custumer Information” se muestra,el usuario captura su información personal. Después, la envía y el contenedor “Payment Information” se muestra, en el captura la información de su tarjeta.el nombre del usuario, enviado anteriormente como “parameter” se envía junto con la información de la tarjeta de crédito (CC) y el total (enviado anteriormente por el contenedor  “ShoppingCart” a la acción “Execute the payment”.

Práctica XII.- "Ejemplo de Modelo IFML: Online Book Store con Pencil Project y Editor IFML: consultar carrito de compra"

Tienda de libros en línea: consultar carrito de compra

PENCIL PROJECT

El carrito de compras es una lista de productos seleccionados previamente por el usuario, se muestran las cantidades y detalles de la orden. El usuario puede actualizar el carrito cambiando las cantidades de X producto, vaciar carrito borrando todos los productos o iniciar el proceso de pago mediante el botón “Checkout”.

Cuando se actualiza el carrito, se recalcula la cuenta total.

Cuando se vacía el carrito se re direcciona a una página de confirmación.

IFML MODEL

Práctica XI.- Tienda de libros en línea: agregar libro a carrito de compra

Modelo IFML de agregar libro a carrito de compra

Aquí se ve el modelo IFML que agrega un producto al carrito, cuando el usuario presiona el botón agregar a carrito, se muestra una ventana modal (pop up) preguntando la cantidad de productos. Este valor junto con el producto seleccionado se envían como parámetros y representan la entrada de la acción “Add to cart”, cuando se ejecuta la acción se muestra una ventada de confirmación.

EJEMPLO OLINE BOOKSTORE CON PENCIL PROJECT E IFML

Pasos del BookStore Pencil Project

Inicio / Home

Página de Books seleccionada

Página del Book/Producto 

Paso del Modelo IFML BookStore

BookStore