PAGINA WEB DE LA EMPRESA CORE (Computadoras y

Redes Locales de Michoacn, S.A. de C.V.)

Montelongo Urueta Maria de los Angeles,
Ferreira Escutia Rogelio,
Ibarra Lopez Saul
Depto. De Sistemas y Computacin, Carrera de Ing. Sistemas Computacionales del
Instituto Tecnolgico de Morelia. CORE (Computadoras y Redes Locales de Michoacn,
S.A. de C.V.). E-mail: rogeplus@gmail.com, E-mail: sibarra@core.com.mx, Area Temtica:
Tecnologas
RESUMENWeb
En el presente se describe el desarrollo de la pgina web para la empresa CORE, se describe brevemente la
empresa, la problemtica que tiene, el cmo se pretende solucionar dicho problema y cules son los objetivos
y alcances a los que se pretende llegar. Una parte importante es el desarrollo de la pgina web en lo que se
explica el planteamiento que se tuvo para su elaboracin, lo que se realiz para diseo de la pgina web, el
proceso que se tuvo en su elaboracin, las herramientas y tecnologas que se utilizaron as como tambin
para que fueron utilizadas, y por ltimo los resultados que se obtuvieron en el desarrollo el proyecto.
2. DISEO
INTRODUCCIN
CORE (Computadoras y Redes Locales de Michoacn, S.A. de C.V.) es
una empresa dirigida por gente joven y orientada a brindar apoyo,
asesora, soporte y servicio tcnico a la pequea y mediana industria
en el rea de la computacin e informtica. Actualmente cuenta con
una gran variedad de productos y servicios para las necesidades de
la empresa, la principal forma de promocin de estos son las redes
sociales y una pgina web, lamentablemente estas no reciben ningn
tipo de mantenimiento desde hace gran tiempo. Esto impide que el
nmero de ventas y ganancias incrementen en la empresa, es por
esto que se ha tomado la decisin de desarrollar una nueva pgina
web con un nuevo diseo que permita al usuario
su fcil
manipulacin y que adems dar a conocer al usuario los servicios,
productos que ofrece la empresa as como el contacto, redes sociales
sobre la misma.
El principal objetivo del desarrollo de esta nueva pgina web es
aumentar el nmero de ventas y ganancias en la empresa mostrando
y promocionando los productos y servicios con los que cuenta,
dndose a conocer entre ms gente.
La pgina web es la principal herramienta de mercadotecnia con la
que cuenta CORE, es por esto que se ha optado por una nuevo sitio,
en un comienzo se ha definido que para su arranque sea un 90%
informativa y posteriormente que crezca y se vuelva una aplicacin
web en la que se pretende que el usuario tenga ms interaccin con
la misma, y pueda realizar compras en lnea, solicitar informacin al
instante de aquello que sea de su interese por medio de un chat
online y otros servicios.
CORE es una empresa que tiene ms de 20 aos en el mercado y
actualmente cuenta con un reducido nmero de clientes, lo que
impide que obtenga grandes ganancias y que pueda competir con
otras empresas del mismo tipo en el pas, es por esto que se ha
establecido la creacin de una nueva pgina web, con la que se
DESARROLLO
pretende obtener lo siguiente:
1. PLANEACIN
Dar promocin a sus productos y servicios
Para el desarrollo
la nueva de
pgina,
se realiz una junta con el
Ampliar de
el portafolio
clientes
director de
CORE yganancias
el equipo
de ladesarrollo
Mayores
para
empresa. donde se defini la
estructura de
la pgina (colores,
Reconocimiento
en el contenido,
mercado. diseo y otros), en la que
tambin se ha establecido las herramientas y tecnologas que se
utilizarn para el desarrollo de la pgina como lo son Bootstrap,
HTML, HTML 5, CSS3, JQuery y JSP. Como resultado de lo discutido se
obtuvieron los siguientes requerimientos:
La pgina debe contar con Responsive Desing.
La estructura de la pgina debe ser amigable y fcil de
interpretar para el usuario.
La pgina debe contar con los colores de la empresa.
Para su desarrollo se utilizar el IDE de NetBeans.

CORE cuenta con un diseador el cual es el encargado de realizar

todas las imgenes, bosquejos y todo lo necesario en la empresa
referente al diseo, por esta razn l se encarg de realizar todo lo
referente al diseo de la pgina web, para esto realiz diferentes
maquetados en los que se muestra toda la estructura, diseo,
colores, entre otras cosas. El primer maquetado es el de la pgina
principal en la que contiene la estructura y diseo de esta, en este
maquetado se puede observar un encabezado con el logo, un men y
las redes sociales de la empresa, en el cuerpo de la pgina se
encuentra un slider y diferentes imgenes con informacin sobre las
mismas, para el pie de pgina tenemos diferentes listas con enlaces a
otras pginas de la empresa. En el segundo maquetado se puede
observar los diferentes contenidos que se tendr en el cuerpo de la
pgina, de acuerdo con las opciones del men. Y en el ltimo
maquetado nos muestra el diseo y las opciones que contendr el
men.
3. PROCESO
Ya que se cuentan con todo el maquetado, se comenz con la
programacin, como ya se mencion anteriormente, con HTML y
HTML 5 para formar la estructura de la pgina web formando el
encabezado, cuerpo y pie de pgina, as mismo se utiliz CSS 3 para
aplicarle los diferentes estilos a todos los elementos de la pgina y
algunas libreras de Bootstrap que nos facilitan el acomodo y el
diseo responsivo de los elementos para cada una de las diferentes
pantallas existentes, los puntos de ruptura que aplica para hacer el
cambio de pantalla son: menor a 768 pixeles de ancho para
dispositivos muy pequeos, mayor a 768 pixeles de ancho para
dispositivos pequeos, mayor o igual a 992 pixeles de ancho para
dispositivos medianos y mayor a 1200 pixeles de ancho para
dispositivos ms grandes, esto permite aplicar el Responsive
Desing. Ya que se finaliz con todas las estructuras de la pgina se
le agrego todo la informacin, enlaces, entre otras cosas requeridas.
Finalizada la pgina, se realizaron algunas pruebas de usabilidad en
las que presentaron algunos detalles que posteriormente fueron
Imagen 1.hasta
Resultado
final
solucionados, estas pruebas tuvieron un seguimiento
que
la
(Pgina principal).
pgina fue aprobada.
4. RESULTADOS
CONCLUSIONES
Como
resultados
se
obtuvo
una
pgina
responsiva
con
El desarrollo de esta pgina web me ha dejado una gran aportacin
diferentes estilos para
diferentesnuevas
tipos
profesionalmente
ya cada
que uno
se de
he los
aprendido
tecnologas,
de
pantallas,
as
mismo
tener
una
interfaz
amigable
y
herramientas y lo ms importante, me mostro lo que es el mbito
fcil interpretacin
el de
usuario.
Un ejemplo
es la
laborar,
el formar para
parte
un equipo
de trabajo,
ver todos los
Imagen
1.
donde
se
puede
observar
el
resultado
de
procesos por los que pasa un desarrollo, adems de otras cosas. He
la
pgina
principal
con
el
estilo
para
dispositivos
medianos.
quedado muy satisfecha con el resultado de esta pgina web y la
aportacin que tuve en ella, espero que tenga el gran impacto que
se le ha estimado para que fortalezca y haga crecer a CORE.

Tcnica Progreso de Mxico