DISEO DE SITIOS WEB - 301122A

DISEO E IMPLEMENTACIN DE UN PORTAL WEB DE LA EMPRESA VENTAS YA

ANLISIS DE CONDICIONES DEL PROYECTO.

GRUPO 301122_1

AMAURY POLO RIOS

LEIDER MARINO CAICEDO OBANDO
CRISTIAN MAURICIO LVAREZ CDIGO 3.087.447
DANIEL HERNNDEZ ALVAREZ

UNIVERSIDAD NACIONAL ABIERTA Y A DISTANCIA - UNAD

FACULTAD DE INGENIERA DE SISTEMAS
INGENIERA DE SISTEMAS
BOGOT D.C.
2014

TABLA DE CONTENIDOS

INTRODUCCIN ................................................................................................................. 4
OBJETIVOS ........................................................................................................................ 5
FASE1. ANALISIS DE LAS CONDICIONES DEL SITIO PARA LA EMPRESA
VENTASYA. ........................................................................................................................ 6
a) Conceptualizacin del problema que sustenta la necesidad de construir el Sitio Web
planteado en el caso de estudio. Sustentar el porqu de la respuesta seleccionada?..... 6
b) Definir los objetivos del Sitio Web. Sustentar el porqu de la respuesta
seleccionada?................................................................................................................... 7
c) Definir las caractersticas generales que tendr el sitio de acuerdo a los parmetros
del cliente y las condiciones establecidas por el equipo de diseo (Grupo Colaborativo).
Sustentar el porqu de la respuesta seleccionada? ......................................................... 7
d) Definir el modelo de desarrollo web que usara el equipo de diseo (grupo
Colaborativo) para el desarrollo e implementacin del sitio web planteado en el Caso de
Estudio. Sustentar el porqu de la respuesta seleccionada? ........................................... 8
e) Definir el tipo o tipos de usuarios que tendr el Sitio Web, se debe hacer claridad de
los roles, derechos y restricciones de estos mismos. Sustentar el porqu de la respuesta
seleccionada?................................................................................................................... 8
f) Definir el tipo de estructura que tendr el Sitio Web. Sustentar el porqu de la
respuesta seleccionada? .................................................................................................. 9
g) Nombre del dominio que registrara para el Sitio Web a crear. Sustentar el porqu de
la respuesta seleccionada? .............................................................................................. 9
h) Extensin del dominio (org. Com. Govedu.) u otras que pueda tener el sitio.
Sustentar el porqu de la respuesta seleccionada? ......................................................... 9
i) Definir el tipo de tecnologa Web adicional que se usara para la implementacin del
Sitio Web, as mismo se deben definir los lenguajes de diseo y desarrollo web con su
versin, adems en cada lenguaje planteado se deber presentar una breve explicacin
del uso que se har del mismo para el caso de estudio planteado Sustentar el porqu
de la respuesta seleccionada? ......................................................................................... 9
j) Definir el o los sistemas de informacin que soporten el servicio innovador que debe
poseer el sitio web. ......................................................................................................... 10
k) Definir si el Sitio Web requiere una conexin a base de datos y definir el tipo de
DBMS que usara para el proyecto. Se debe explicar que lenguajes se usaran para
gestionar los datos del DBMS y la BD a travs de interfaces web. Sustentar el porqu
de la respuesta seleccionada y cul sera el uso especfico de la Base de Datos? ....... 10
l) Definir las cuentas de correo institucionales que se deben crear para el cliente con
el dominio del Sitio Web, definir si se usara un cliente nativo de correo del proveedor de
Hosting o si se usara un servicio de correo por dominio de proveedores como Google o
Outlook. Sustentar el porqu de la respuesta seleccionada, establecer el Numero de

cuentas a crear, cul ser su uso y que cuota de almacenamiento en servidor manejara
cada una? ....................................................................................................................... 10
m)
Definir los parmetros del Servicio de Hosting y Dominio se contrataran el
hospedaje del Sitio Web en la Internet, la respuesta se debe sustentar con la siguiente
informacin: .................................................................................................................... 11
n) Definir la paleta o combinacin de Colores, los tipos y estilos de fuentes y los
posibles estilos que a nivel general define el equipo de diseo para la pgina principal o
Index del Sitio Web. Sustentar el porqu de la respuesta seleccionada? ...................... 11
o) Definir en formato PNG un boceto del LOGO del Sitio web y el Banner propuesto
por el equipo de diseo para el mismo. Sustentar el porqu de la respuesta
seleccionada?................................................................................................................. 12
p) Definir los tems de men, su ubicacin en la pgina principal y subpginas del Sitio
Web y los contenidos generales que tendr el sitio Web para los visitantes. Adems
aqu se deben plantear las exigencias especficas del cliente las cuales se encuentra
registradas en el Caso de Estudio. Sustentar el porqu de la respuesta seleccionada?12
q) Definir los Ganchos o valores agregados propuesto para el Sitio Web por el equipo
de diseo como un requerimiento hecho por el cliente?. Sustentar el porqu de la
respuesta seleccionada? ................................................................................................ 13
r) Definir qu aspectos de accesibilidad web debe poseer el Sitio Web como apoyo a
visitantes que sufran de algn tipo de discapacidad fsica. Se deben establecer como
mnimo 5 elementos o estrategias de accesibilidad web para el sitio, estas se debern
implementar al final del curso en el Sitio Web. Sustentar el porqu de la respuesta
seleccionada?................................................................................................................. 13
s) Definir un presupuesto muy bien estructurado que contemple un plan de gastos
completos y detallados para todas las actividades del proyecto de Diseo del Sitio Web,
este presupuesto debe tener estimado de gastos reales para el desarrollo y ejecucin
del proyecto de diseo del Sitio Web propuesto. Sustentar el porqu de la respuesta
seleccionada?................................................................................................................. 13
CONCLUSIONES .............................................................................................................. 15
BIBLIOGRAFA ................................................................................................................. 16

INTRODUCCIN

Las necesidades que se presentan en el mercado para comercializar un producto han

cambiado, esa manera de llegar al consumidor ya no es la misma de pocas anteriores,
ahora en la actualidad la forma de hacer publicidad, brindar un producto y servicio se hace
utilizando herramientas de la tecnologa como lo es el internet, para lo cual una empresa
busca brindar la facilidad de acceso y atencin a sus clientes, a travs de una pgina web
que ofrezca un entorno de fcil manejo, comunicacin y sobre todo que pueda ofrecer la
informacin necesaria a los clientes de los servicios y productos ofrecidos por la empresa,
as como los mecanismos de interaccin que le permitan al cliente tener comunicacin
sncrona y asncrona con el personal de la empresa.

OBJETIVOS

Objetivo General
Disear e implementar un portal web para la empresa VENTASYA, que le permita ofrecer
a sus clientes la informacin necesaria de su empresa y la opcin de comercializar sus
productos mediante una tienda virtual.

Objetivos Especficos

Disear una plantilla Web y logo para la empresa VENTASYA acorde con su razn de
ser.
Definir la estructura del sitio Web y los mecanismos de interaccin que se ofrecern a sus
clientes.
Desarrollar el portal Web.
Alojar el portal Web en un hosting acorde con las herramientas y tecnologas a utilizar, as
como las necesidades de disponibilidad y rendimiento de la empresa.

FASE1. ANALISIS DE LAS CONDICIONES DEL SITIO PARA LA EMPRESA

VENTASYA.

CASO DE USO: La empresa VENTASYA de Colombia, se dedica a la comercializacin

de productos de tecnologa como: (Smartphones, Tablets, Computadores y televisores
entre otros) esta empresa requiere el diseo e implementacin de un portal web que le
permita administrar una tienda en lnea para sus clientes.
Algunos parmetros
establecidos para el proyecto son:

Se requiere el diseo de un logo para el portal web.

Se deben crear una tienda virtual con carrito de compra.
Se debe crear un Chat de servicio al Cliente.
Se debe crear un formulario de contacto para clientes bajo el nombre de
contctenos.
Se debe crear un espacio de opiniones tipo foro sobre los productos que
comercializa la empresa.
Se deben establecer elementos de accesibilidad web.

a) Conceptualizacin del problema que sustenta la necesidad de construir el Sitio

Web planteado en el caso de estudio. Sustentar el porqu de la respuesta
seleccionada?

La empresa VENTASYA con domicilio en Colombia, dedicada a la comercializacin de

productos de tecnologa como: (Smartphones, Tablets, Computadores y televisores entre
otros) ha tomado la decisin de ofrecer sus productos va Web por medio de una tienda
en lnea, con el propsito de ampliar sus servicios tanto en lo presencial como en lo
virtual.
El sitio Web a realizar debe ser eficiente, interactivo y eficaz, buscando que los clientes
tengan una herramienta al alcance desde sus casas con ingreso de forma rpida al sitio
va Web, en donde visualizar los diferentes productos por medios de catlogos virtuales.
Es importante que el portal cuente con la capacidad de administrar los contenidos
publicados, los productos ofrecidos mediante la tienda virtual, permitir a los clientes
realizar sus compras en lnea, as como ofrecer mecanismos de comunicacin como un
servicio de chat al cliente, foros de opinin con el objetivo de ofrecer mecanismos de
retroalimentacin de sus clientes y con ello poder crear estrategias para prestar un buen
servicio.

b) Definir los objetivos del Sitio Web. Sustentar el porqu de la respuesta

seleccionada?

Definidos en el tem de objetivos de esta propuesta.

c) Definir las caractersticas generales que tendr el sitio de acuerdo a los parmetros
del cliente y las condiciones establecidas por el equipo de diseo (Grupo
Colaborativo). Sustentar el porqu de la respuesta seleccionada?

Las caractersticas del sitio web se fundamentan por los requerimientos dados por el
cliente:
Logo sitio Web:

Un hombre apresurado cargando un reloj en su costado y el nombre de la empresa, el

logo estara ubicado en la parte superior izquierda de la pgina web, con un vnculo a la
pgina principal.

Tienda virtual con carrito de compras:

Cada producto de la tienda virtual, tendr un acceso por medio de un botn al carrito de
compras, el cual sucesivamente se ir llenando hasta completar todo el pedido.

Chat de servicio al Cliente:

El chat ir ubicado al costado izquierdo en la parte inferior en una barra, en donde se
podr interactuar con personal de la empresa en las horas estipuladas para tal fin,
brindando comodidad al usuario y agilidad.
Formulario de contacto para clientes:
El formulario de contactos tendr una pestaa en la parte superior, la cual estar ligada a
un correo electrnico.

d) Definir el modelo de desarrollo web que usara el equipo de diseo (grupo

Colaborativo) para el desarrollo e implementacin del sitio web planteado en el
Caso de Estudio. Sustentar el porqu de la respuesta seleccionada?

El modelo de desarrollo Web que se usar para la empresa VENTASYA es el de cascada,

teniendo en cuente que el sitio es nuevo y se cuentan con los requerimientos, las etapas
de este ciclo son:
-

Planificacin
Anlisis y Diseo de Requerimientos
Diseo
Implementacin
Operacin y Mantenimiento
Crecimiento y cambio

Figura. 1, Modelo de Cascada. Tomada de: http://ingenexescom.blogspot.com/2012/02/modelo-en-cascada.html

Las etapas nos permitirn llevar un orden y poder detectar a tiempo fallas en el diseo.

e) Definir el tipo o tipos de usuarios que tendr el Sitio Web, se debe hacer claridad
de los roles, derechos y restricciones de estos mismos. Sustentar el porqu de la
respuesta seleccionada?

En el sitio Web de la empresa VENTASYA, se manejaran los siguientes tipos de usuarios:

Administrador General: Tendr derecho a suministrar y visualizar toda la informacin
publicada en la pgina Web, como noticias, eventos, promociones, registrar y administrar
clientes, creacin de permisos, catlogos de productos y administracin de usuarios
finales.
Administrador del Chat: Tendr la labor de dar solucin a las inquietudes de los clientes
brindando informacin oportuna y eficaz, con solo acceso a esta funcin.
Administrador de Contactos: Tendr la labor de la creacin de las bases de datos de los
clientes y el envo de informacin relevante de la empresa. Sin acceso a la informacin
del Administrador de Chat y Administrador General.

Usuarios visitantes: Pueden acceder a todas las secciones pblicas del sitio: Informacin
corporativa, chat, catlogo de productos, adicionar productos al carrito de compras.
Usuarios registrados: Pueden acceder las mismas opciones del visitante y adems
pueden registrar pedidos en el sistema de acuerdo a lo que tengan en su carrito de
compras.

f) Definir el tipo de estructura que tendr el Sitio Web. Sustentar el porqu de la

respuesta seleccionada?

El tipo de estructura que tendr la pgina Web VENTASYA ser jerrquico o mixto que
ayude a navegar dentro de los subtemas principales, a los que se accede a travs del
panel lateral.
El sistema de mens consiste generalmente en un men situado en un panel lateral, que
nunca cambia, desde el que se accede a las diferentes secciones principales del sitio,
cuyas pginas inciales se cargan en el panel central, que suele ser el de mayor tamao.
Para acceder a las diferentes subsecciones y pginas se suelen establecer los enlaces
adecuados bien como submens en el panel lateral, bien como mens individuales dentro
de cada pgina de entrada a las secciones, dentro del panel principal.

g) Nombre del dominio que registrara para el Sitio Web a crear. Sustentar el porqu
de la respuesta seleccionada?

El dominio que se va a utilizar es el .CO, ya que identifica al pas, en este caso a

Colombia.

h) Extensin del dominio (org. .com .gov .edu.) u otras que pueda tener el sitio.
Sustentar el porqu de la respuesta seleccionada?

La extensin del dominio sera .com, ya que refuerza la actividad de la empresa que es la
comercial, tambin por ser un dominio conocido es ms fcil de recordar por los usuarios.

i) Definir el tipo de tecnologa Web adicional que se usara para la implementacin del
Sitio Web, as mismo se deben definir los lenguajes de diseo y desarrollo web con
su versin, adems en cada lenguaje planteado se deber presentar una breve
explicacin del uso que se har del mismo para el caso de estudio planteado
Sustentar el porqu de la respuesta seleccionada?

El tipo de tecnologa web es la CMS, se pretende utilizar el Sistema Administrador de

Contenidos Joomla por la facilidad que nos da en la automatizacin total del trabajo del
diseo y la rapidez en el diseo de una pgina web, como tambin que el cliente final
puede realizar las modificaciones de la web con facilidad, en donde se pueden cumplir
con los requerimientos que hace la empresa.
Lenguajes de diseo:
HTML versin 5
CSS 3
Lenguajes de desarrollo (depende de los requisitos tcnicos del CMS)
PHP Versin 5.3.+

j) Definir el o los sistemas de informacin que soporten el servicio innovador que

debe poseer el sitio web.

k) Definir si el Sitio Web requiere una conexin a base de datos y definir el tipo de
DBMS que usara para el proyecto. Se debe explicar que lenguajes se usaran para
gestionar los datos del DBMS y la BD a travs de interfaces web. Sustentar el
porqu de la respuesta seleccionada y cul sera el uso especfico de la Base de
Datos?

La base de datos a utilizar sera MySql en su versin 5.1 o superior, debido a que es una
de las bases de datos que podemos encontrar con mayor frecuencia en los hosting, su
velocidad de respuesta es altamente recomendada para proyectos Web y es soportada
por el CMS propuesto.

l) Definir las cuentas de correo institucionales que se deben crear para el cliente con
el dominio del Sitio Web, definir si se usara un cliente nativo de correo del
proveedor de Hosting o si se usara un servicio de correo por dominio de
proveedores como Google o Outlook. Sustentar el porqu de la respuesta
seleccionada, establecer el Numero de cuentas a crear, cul ser su uso y que
cuota de almacenamiento en servidor manejara cada una?

Se utilizar el cliente nativo de correo del proveedor de hosting, debido a que estos
ofrecen la creacin y posibilidad de administracin de cuentas de correo, estos productos
y servicios normalmente vienen incluidos en el plan de hosting, con lo cual no se incurrir
en gastos adicionales para la empresa como lo sera adquirir un plan de correo
electrnico personalizado como lo ofrece Google o Outlook.
Se proponen tener las siguientes cuentas:
contacto@ventasya.com, contacto general para visitantes del sitio
ventas@ventasya.com, contacto especfico para el tema de ventas
administrador@ventasya.com, contacto del administrador del sistema

m) Definir los parmetros del Servicio de Hosting y Dominio se contrataran el

hospedaje del Sitio Web en la Internet, la respuesta se debe sustentar con la
siguiente informacin:

Plan shared para iniciar, con la posibilidad de migrar a un plan mejor de acuerdo a las
estadsticas de uso del sitio.

Nombre del Proveedor de Hosting seleccionado.

BLUE HOST (http://www.bluehost.com)

Nombre del Plan de Hosting seleccionado.

Starter

Tipo de servidor (Compartido o Dedicado).

Compartido

Tipo de SO del servidor (Linux o Windows).

Windows

Ancho de banda para transferencia mensual que ofrece el Plan.

Ilimitado

Espacio de almacenamiento en servidor que ofrece el plan.

100 GB

Numero de dominios y sub dominios que permite crear y gestionar el plan

seleccionado
1 dominio, 25 subdominios

Numero de base de datos que permite crear y gestionar en el servidor, el plan

seleccionado.
100

Numero de cuentas de correo que permite crear y gestionar en el servidor el plan

seleccionado.
100

El plan ofrece el paquete de aplicaciones Fantstico o Deluxe?

No

n) Definir la paleta o combinacin de Colores, los tipos y estilos de fuentes y los

posibles estilos que a nivel general define el equipo de diseo para la pgina
principal o Index del Sitio Web. Sustentar el porqu de la respuesta seleccionada?

Para esta pgina podemos combinar los colores negro, violeta, naranja y blanco que son
colores acorde con el logo y el banner diseados.

Estos colores se pueden combinar y aplicarles unos efectos luminosidad para obtener
gamas de colores que podamos utilizar.
Fuente: Trebuchet MS Texto con la fuente indicada
Color de la fuente: 252525, gris oscuro
Se propone utilizar para los elementos del sitio una gama de colores segn los utilizados
en el logo, por ellos se partira de los siguientes cdigos e ir jugando con la iluminacin
para crear diferentes tonos:
Violeta: 2F368f
Naranja: f1511B
Negro: #000000
Blanco: #FFFFFF
o) Definir en formato PNG un boceto del LOGO del Sitio web y el Banner propuesto
por el equipo de diseo para el mismo. Sustentar el porqu de la respuesta
seleccionada?

La seleccin del logo representa seriedad, agilidad y eficacia de la empresa

p) Definir los tems de men, su ubicacin en la pgina principal y subpginas del

Sitio Web y los contenidos generales que tendr el sitio Web para los visitantes.
Adems aqu se deben plantear las exigencias especficas del cliente las cuales se
encuentran registradas en el Caso de Estudio. Sustentar el porqu de la respuesta
seleccionada?

Estos seran los tem que irn en el men principal, inicio, contctenos o productos y
partes, promociones, domicilios o envos, carrito de compra y chat en lnea.
Este men se ubicara en la pgina principal en la parte lateral izquierda o superior
centrado.
Cada tem del men direcciona a una pgina secundaria o subpgina.
En el tem de productos y partes aparecer un listado de todos los sitios o puntos de
ventas en todo el pas.
En la pestaa de inicio es para regresar a la pgina principal en caso que estemos en
otras pginas.
En promociones aparecern los combos y las promociones del da de cada restaurante.
En domicilios, envos o carrito de compra aparecer un formulario para diligenciar con los
datos del cliente que va a solicitar el servicio y por medio del carrito se realiza el pedido.

q) Definir los Ganchos o valores agregados propuesto para el Sitio Web por el equipo
de diseo como un requerimiento hecho por el cliente?. Sustentar el porqu de la
respuesta seleccionada?
Los ganchos tendrn que ser discutidos por los integrantes del trabajo colaborativo.

r) Definir qu aspectos de accesibilidad web debe poseer el Sitio Web como apoyo a
visitantes que sufran de algn tipo de discapacidad fsica. Se deben establecer
como mnimo 5 elementos o estrategias de accesibilidad web para el sitio, estas se
debern implementar al final del curso en el Sitio Web. Sustentar el porqu de la
respuesta seleccionada?
Se propone implementar las siguientes pautas definidas por la w3c para la creacin de
sitios web accesibles:
-

Uso del atributo alt para describir la funcin de cada imagen o animacin.
Subttulo a los videos y posibilidad de ver la transcripcin y descripcin de los
sonidos y videos.
Utilizacin de CSS para la maquetacin de la pgina.
Habilitar la utilizacin del teclado para acceder a las funcionalidades del sistema.
Proveer de script del lado cliente que permitan validar la informacin que este
ingrese, detecte automticamente los errores y describir por medio de texto estos
errores.

s) Definir un presupuesto muy bien estructurado que contemple un plan de gastos

completos y detallados para todas las actividades del proyecto de Diseo del Sitio
Web, este presupuesto debe tener estimado de gastos reales para el desarrollo y
ejecucin del proyecto de diseo del Sitio Web propuesto. Sustentar el porqu de
la respuesta seleccionada?

Para la actividad del negocio virtual no incurre en gastos de producciones grandes o

demasiados, bsicamente el negocio funciona con el gasto en mano de obra y lo que
involucra el manejo de esta dentro de Internet.
El campo virtual al cual este plan de negocio desea trabajar no hay un manejo de precios
actuales donde pueda existir una competencia de precios es por esta razn que el plan
plantea un sobre costos a la compaa inscrita por domicilio realizado a travs de esta de
$ 500 un costo que no es elevado, un costo fcil de manejar, el cual puede traer muchas
ventajas a la compaa involucrada en este proceso, como lo es un manejo de base de
datos, estadsticas, promociones y la venta personalizada, entre otras, que en el camino
se pueden ir creando.
Mano de obra directa
Ingeniero de sistemas.................... $ 2.200.000.oo mensuales.
Coordinador de Calidad
$ 1.000.000.oo mensuales
Mano de obra indirecta

Diseador grfico..........................$ 2.000.000.oo (Diseo de la pgina web)

1 vez, al crear la pgina.
Diseador grfico..........................$ 600.000.oo (Actualizaciones pgina web
Semestralmente)
Costos directos
Conexin a red..............................$ 145.500.oo mensual
Hosting..........................................$ 300.000.oo anual

CONCLUSIONES

La empresa VENTASYA se podra beneficiar enormemente al contar con una pgina web,
con la cual lograra un reconocimiento a nivel mundial.
As mismo tendra la habilidad de poder promocionar y vender sus productos de una
forma gil, permitiendo al cliente la comodidad de poder adquirir los servicios de la misma.
En este trabajo se puedo encontrar un estudio dedicado a la factibilidad de una empresa
comercializadora de los productos de tecnologa como: (Smartphones, Tablets,
Computadores y televisores entre otros) permiti determinar la utilizacin de las TIC.
Ilustrando a travs de estudios de mercadeo, localizacin y financieros. El camino a
seguir para llegar al objetivo del diseo e implementacin de un portal web y su puesta en
marcha, teniendo como valor agregado la calidad, durabilidad y originalidad de los
productos. A partir de esto, se identific la magnitud de las inversiones necesarias y el
origen de los recursos para llevar a cabo el proyecto.

BIBLIOGRAFA

Perdomo, M (Junio 2014) - Gua Integrada de Actividades. La Plata Huila., Colombia:

Escuela de Ciencias Bsicas, Tecnologa e Ingeniera UNAD.
Salazar, J Puentes, O (Diciembre 2009) Mdulo Diseo de Sitios Web. La Plata Huila.,
Colombia: Escuela de Ciencias Bsicas, Tecnologa e Ingeniera UNAD.
Teja, L (Octubre 2012) - JOOMLA 3.0 DESCARGAR Y INSTALACION , PRIMEROS
PASOS
EN
ESPAOL
--HD--.
Recuperado
de
https://www.youtube.com/watch?v=QwSoB_4oY3k
Gua
breve
para
crear
sitios
webs
accesibles,
http://www.w3.org/WAI/References/QuickTips/qt.es.htm, Accedido 28 agosto de 2014.

Technical Requirements for Supported Software,

requirements.html, Accedido 28 de agosto de 2014.

http://www.joomla.org/technical-

Los 6 mejores hosting para Joomla, http://www.los6mejores.com/los-6-mejores-hostingpara-joomla/, Accedido 28 de agosto de 2014.

Cmo combinar colores en diseo Web, http://www.cristalab.com/tutoriales/comocombinar-colores-en-diseno-web-c113076l/, Accedido 28 de agosto de 2014.