Crear una ventana de imagen ampliada

En esta introducción veremos varios ejemplos de "buenas prácticas" de comercio electrónico que analizaremos para conocer sus características

Analizaremos detenidamente la composición en páginas de un sitio de comercio electrónico, qué páginas son básicas y qué otras páginas pueden ayudar a la venta, aportando valor al usuario.

Vista rápida del primer ejercico de este curso

Presentación del segundo ejercicio propuesto para este curso

Diseñamos la página de listado de una categoría partiendo de la home ya creada

Crearemos el espacio donde se va a situar al carro de la compra

Completamos el carro incluyendo una tabla con el contenido de la compra

Diseñamos los efectos de rollover sobre los elementos del carro

Exportamos los archivos JPG para su validación por el cliente

A partir de una réplica de la página principal vamos a crear la página de detalle de producto, para ello eliminamos todos los componentes que no son necesarios

Incluimos el texto sobre el producto en al zona central y las miniaturas de fotografías secundarias

Agregamos los iconos para completar la página, asi como un desplegable para seleccionar las unidades de producto que el usuario quiere comprar

Exportamos los archivos JPG para su validación por el cliente y realizamos un repaso al estado de nuestro diseño hasta el momento

Utilizamos un archivo existente para cerrar la página de formulario limpiando aquello que no nos hace falta

Diseñaremos el contenido del formulario, con los campos de texto necesarios

Agregamos otro tipo de elementos de formulario como desplegables y checklist de selección única

Indicaremos qué campos de los solicitados son obligatorios y mostraremos cómo deseamos integrar el diseño de los mensajes de error

Exportamos los archivos JPG para su validación por el cliente

Resumen del ejercicio

Analizaremos las diferencias entre una tienda creada en flash y una que no lo es y veremos algunos ejemplos de tienda flash. También conoceremos sitios de enlaces para localizar otros sites que nos puedan servir de inspiración

Repaso a los contenidos del segundo ejercicio y las distintas pantallas que vamos a diseñar

Para ahorrar tiempo, trabajaremos en la página de listado a partir de un archivo existente, limpiando aquellos componentes que no vamos a necesitar. También diseñaremos la introducción a la sección y delimitaremos la zona en la que se va a situar el listado

Creamos el primer elemento de listado

Completamos el listado de productos replicando el elemento inicial hasta cubrir el espacio disponible

Rematamos los pequeños detalles del listado, para ello, y diseñamos una barra de scroll y creamos la vista de foto ampliada para un producto

Exportamos los archivos JPG para su validación por el cliente

Trabajaremos sobre la página de listado anteriormente creada, la cual limpiamos hasta tener solo los elementos necesarios

Crearemos la introducción al carro con las intrucciones de envío y la selección de provincia

Diseñaremos la tabla de lista de productos del carro con los botones para eliminar elementos, y procesar el pedido

Mostraremos el aspecto de la zona de login cuando el usuario está logado (paso necesario para acceder al carro de la compra, en este caso)

Exportamos los archivos JPG para su validación por el cliente