Autor: Carlos Alberto Mrquez Mrquez

Docente: Irving Eyssautier Mndez

Grupo: 6 T B

Tema: Unidad 1 Arquitectura

2

Tabla de contenido

A. Introduccin ......................................................................................................... 3

1.1 Evolucin de las aplicaciones web ................................................................ 4

1.2 Arquitectura de las aplicaciones web ............................................................ 8

1.2.1 Modelo de dos Capas. ........................................................................... 10

1.2.2 Modelo de tres Capas. ......................................................................... 12

1.3 Tecnologas para el desarrollo de aplicaciones web ................................... 14

1.3.1 Tecnologas en la capa de Presentacin ................................................ 14

1.3.2 Tecnologas en la capa de Negocio ....................................................... 16

1.3.3 Tecnologas en la capa de Acceso a Datos............................................ 17

1.4 Planificacin de aplicaciones web ............................................................... 19

B. Conclusin ......................................................................................................... 26

C. Referencias ......................................................................................................... 27

Ilustraciones

FIG. 1 SISTEMA WEB ..................................................................................................... 8

FIG. 2 MODELO 2 CAPAS ............................................................................................. 11

FIG. 3 MODELO 3 CAPAS ............................................................................................ 13

FIG. 4 DIBUJO DE LA APLICACIN ............................................................................... 20

FIG. 5 VERSIN WEB DE EBAY .................................................................................... 21

FIG. 6 VERSIN MVIL DE GOOGLE DOCS. .................................................................. 22

FIG. 7 VERSIN MVIL DE EBAY ................................................................................. 22

FIG. 8 VERSIN WEB DE GOOGLE DOCS. .................................................................... 22

3

A. Introduccin

La programacin web es un trmino adecuado para describir el proceso general que

cubre el diseo y la creacin de un sitio web.

En tiempo atrs, los sitios no eran muy complejos, inclusive podramos hablar que

eran textos planos con imgenes sin vida, actualmente las paginas han ido

evolucionando con el paso del tiempo y con la adquisicin de nuevas necesidades,

tano por parte de las empresas como de las personas.

Con la revolucin que se dio en internet de generar pginas con ms vistas y ms

funciones, los textos planos dejaron de ser una va de comunicacin web, ahora las

aplicaciones web (as las podemos llamar en la actualidad) son complejas a partir de

que el e-commerce ha tenido auge en la web, pues ahora las paginas son autnticos

programas diseados para adquirir datos de un usuario, compra-venta de productos

en lnea, pagos de servicio desde la web, y consultas avanzadas que dan de mucho

de qu hablar.

Ahora las personas encargadas de generar un pgina web se tienen que preocupar por

no hacer solo una pgina con texto e imgenes, sino tambin con campos, quizs que

se conecte a una base de datos, una pgina dinmica en donde el usuario final

interacte con sta, cabe mencionar que ahora las paginas son de necesidad si no

general aun, pero que han ido ganando terreno conforme la gente va encontrando en

ellas practicidad

4

1.1 Evolucin de las aplicaciones web

La Web 1.0 (1991-2003) es la forma ms bsica que existe, con navegadores de slo

texto bastante rpidos ya que es de slo lectura. El usuario no puede interactuar con

el contenido de la pgina (nada de comentarios, respuestas, citas, etc), estando

totalmente limitado a lo que el Webmaster sube a sta.

Algunos elementos de diseo tpicos de un sitio Web 1.0 incluyen:

Pginas estticas en vez de dinmicas por el usuario que la visita2

El uso de framesets o Marcos.

Extensiones propias del HTML como y , etiquetas

introducidas durante la guerra de navegadores web.

Libros de visitas online o guestbooks

botones GIF, casi siempre a una resolucin tpica de 88x31 pixels en tamao

promocionando navegadores web u otros productos.3

formularios HTML enviados va email. Un usuario llenaba un formulario y

despus de hacer clic se enviaba a travs de un cliente de correo electrnico,

con el problema que en el cdigo se poda observar los detalles del envo del

correo electrnico.

No se podian adherir comentarios ni nada parecido

Todas sus pginas se creaban de forma fija y muy pocas veces se actualizaban.

No se trata de una nueva versin, sino de una nueva forma de ver las cosas.

El trmino Web 2.0 comprende aquellos sitios web que facilitan el compartir

informacin, la interoperabilidad, el diseo centrado en el usuario1 y

lacolaboracin en la World Wide Web. Un sitio Web 2.0 permite a los usuarios

interactuar y colaborar entre s como creadores de contenido generado por usuarios

5

en una comunidad virtual, a diferencia de sitios web estticos donde los usuarios se

limitan a la observacin pasiva de los contenidos que se han creado para ellos.

Ejemplos de la Web 2.0 son las comunidades web, los servicios web, las aplicaciones

Web, los servicios de red social, losservicios de alojamiento de videos,

las wikis, blogs, mashups y folcsonomas.

Servicios asociados:

Blogs: Un blog es un espacio web personal en el que su autor puede escribir

cronolgicamente artculos, noticias...(con imgenes y enlaces).

Wikis: Una wiki es un espacio web corporativo, organizado mediante una

estructura hipertextual de pginas donde varias personas elaboran contenidos

de manera asncrona.

Redes sociales: Sitios web donde cada usuario tiene una pgina donde publica

contenidos y se comunica con otros usuarios. Ejemplos: Facebook, Twitter,

Tuenti, Hi5, Myspace, etc.

Entornos para compartir recursos: Entornos que nos permiten almacenar

recursos o contenidos en Internet, compartirlos y visualizarlos cuando nos

convenga. Existen de diversos tipos, segn el contenido que albergan o el uso

que se les da:

Documentos: Google Drive y Office Web Apps (SkyDrive), en los

cuales podemos subir nuestros documentos, compartirlos y

modificarlos.

Videos: Youtube, Vimeo, Dailymotion, Dalealplay... Contienen miles

de vdeos subidos y compartidos por los usuarios.

Fotos: Picassa, Flickr... Permiten disfrutar y compartir las fotos tambin

tenemos la oportunidad de organizar las fotos con etiquetas,

separndolas por grupos como si fueran lbumes, podemos seleccionar

y guardar aparte las fotos que no queremos publicar.

6

Agregadores de noticias: Digg, Meneame... Noticias de cualquier medio

son agregadas y votadas por los usuarios.

Almacenamiento online: Dropbox, Google Drive, SkyDrive

Presentaciones: Prezzi, Slideshare.

Plataformas educativas

Aulas virtuales (sncronas)

Encuestas en lnea

Web 3.0 es una expresin que se utiliza para describir la evolucin del uso y la

interaccin de las personas en internet a travs de diferentes formas entre los que se

incluyen la transformacin de la red en una base de datos, un movimiento social hacia

crear contenidos accesibles por mltiples aplicaciones non-browser, el empuje de las

tecnologas de inteligencia artificial, la web semntica, la Web Geoespacial o la Web

3D.

Se basa en la idea de aadir metadatos semnticos y ontolgicos a la World Wide

Web. Esas informaciones adicionales que describen el contenido, el significado y

la relacin de los datos se deben proporcionar de manera formal, para que as sea

posible evaluarlas automticamente por mquinas de procesamiento. El objetivo es

mejorar Internet ampliando la interoperabilidad entre los sistemas informticos

usando "agentes inteligentes". Agentes inteligentes son programas en las

computadoras que buscan informacin sin operadores humanos. Con la web 3.0 se

busca que los usuarios puedan conectarse desde cualquier lugar, cualquier

dispositivo y a cualquier momento.

Entre sus innovaciones destacan:

Bases de datos

Inteligencia artificial

7

Web semntica y SOA

Evolucin al 3D

En la Web 4 las aplicaciones ya no estarn en nuestras PCs, estarn en la internet

y por ende en todos lados. Pasaremos de una red tonta a una red inteligente donde

el objetivo primordial ser el de unir las inteligencias donde tanto las personas como

las cosas se comuniquen entre s para generar la toma de decisiones. Para el 2020 o

quizs antes se espera que haya agentes en la Web que conozcan, aprendan y

razonen como lo hacemos las personas.La Web Ubicua es un concepto que est an

en desarrollo, pero me llama curiosamente la atencin como se van complementando

algunas tecnologas que nos permiten imaginar o soar lo que podemos esperar en

un futuro no muy lejano. Imagnese recibir informacin en su celular en la calle por

la que camina y que su propio equipo le haga una reservacin en el restaurant de la

esquina con solo saber sus gustos.

(Mauricio, 2011)

8

1.2 Arquitectura de las aplicaciones web

Una aplicacin Web es proporcionada por un servidor Web y utilizada por

usuarios que se Conectan desde cualquier punto va clientes Web (browsers o

navegadores). La arquitectura de un Sitio Web tiene tres componentes principales:

Un servidor Web

Una conexin de red

Uno o ms clientes

El servidor Web distribuye pginas de informacin formateada a los clientes que las

solicitan. Los requerimientos son hechos a travs de una conexin de red, y para ello

se usa el protocolo HTTP. Una vez que se solicita esta peticin mediante el protocolo

HTTP y la recibe el servidor Web, ste localiza la pgina Web en su sistema de

archivos y la enva de vuelta al navegador que la solicit.

fig. 1 Sistema web

Las aplicaciones Web estn basadas en el modelo Cliente/Servidor que gestionan

servidores web, y que utilizan como interfaz pginas web.

9

Las pginas Web son el componente principal de una aplicacin o sitio Web. Los

browsers piden pginas (almacenadas o creadas dinmicamente) con informacin

a los servidores Web. En algunos ambientes de desarrollo de aplicaciones Web,

las pginas contienen cdigo HTML y scripts dinmicos, que son ejecutados por

el servidor antes de entregar la pgina.

Una vez que se entrega una pgina, la conexin entre el browser y el servidor Web

se rompe, es decir que la lgica del negocio en el servidor solamente se activa por la

ejecucin de los scripts de las pginas solicitadas por el browser (en el servidor, no

en el cliente). Cuando el browser ejecuta un script en el cliente, ste no tiene acceso

directo a los recursos del servidor. Hay otros componentes que no son scripts,

como los applets (una aplicacin especial que se ejecuta dentro de un navegador)

o los componentes ActiveX. Los scripts del cliente son por lo general cdigo

JavaScript o VBSscript, mezclados con cdigo HTML.

La coleccin de pginas son en una buena parte dinmicas (ASP, PHP, etc.), y estn

agrupadas lgicamente para dar un servicio al usuario. El acceso a las pginas est

agrupado tambin en el tiempo (sesin). Los componentes de una aplicacin Web

son:

1. Lgica de negocio.

Parte ms importante de la aplicacin.

Define los procesos que involucran a la aplicacin

Conjunto de operaciones requeridas para proveer el servicio.

2. Administracin de los datos.

Manipulacin de BD y archivos.

3. Interfaz

Los usuarios acceden a travs de navegadores, mviles, PDAs, etc.

10

Funcionalidad accesible a travs del navegador.

Limitada y dirigida por la aplicacin.

Las aplicaciones web se modelan mediante lo que se conoce como modelo de capas,

Una capa representa un elemento que procesa o trata informacin. Los tipos son:

Modelo de dos capas: La informacin atraviesa dos capas entre la

interfaz y la administracin de los datos.

Modelo de n-capas: La informacin atraviesa varias capas, el ms habitual es

el modelo de tres capas.

1.2.1 Modelo de dos Capas.

Gran parte de la aplicacin corre en el lado del cliente (fat client).

Las capas son:

Cliente (fat client): La lgica de negocio est inmersa dentro de la aplicacin

que realiza el interfaz de usuario, en el lado del cliente.

Servidor: Administra los datos.

Las limitaciones de este modelo son.

Es difcilmente escalable

Nmero de conexiones reducida

Alta carga de la red.

La flexibilidad es restringida

La funcionalidad es limitada.

11

fig. 2 modelo 2 capas

12

1.2.2 Modelo de tres Capas.

Esta diseada para superar las limitaciones de las arquitecturas ajustadas al modelo

de dos capas, introduce una capa intermedia (la capa de proceso) Entre presentacin

y los datos, los procesos pueden ser manejados de forma separada a la interfaz

de usuari o y a los datos, esta capa intermedia centraliza la lgica de negocio,

haciendo la administracin ms sencil a, los datos se pueden integrar de mltiples

fuentes, las aplicaciones web actuales se ajustan a este modelo.

Las capas de este modelo son:

1. Capa de presentacin (parte en el cliente y parte en el servidor)

Recoge la informacin del usuario y la enva al servidor (cliente)

Manda informacin a la capa de proceso para su procesado

Recibe los resultados de la capa de proceso

Generan la presentacin

Visualizan la presentacin al usuario (cliente)

2. Capa de proceso (servidor web)

Recibe la entrada de datos de la capa de presentacin

Interacta con la capa de datos para realizar operaciones

Manda los resultados procesados a la capa de presentacin

3. Capa de datos (servidor de datos)

Almacena los datos

Recupera datos

Mantiene los datos

segura la integridad de los datos

13

fig. 3 Modelo 3 capas

(Instituto Tecnologico de Matehuala, s.f.)

14

1.3 Tecnologas para el desarrollo de aplicaciones web

1.3.1 Tecnologas en la capa de Presentacin

1.3.1.1 Java Server Faces (JSF)

La tecnologa Java Server Faces es un marco de desarrollo de los componentes de la

interfaz de usuario, vlido para todas aquellas aplicaciones web basadas en la

tecnologa Java.

1.3.1.2 Richfaces

RichFaces es un marco de cdigo abierto que aade a las aplicaciones capacidad de

Ajax en JSF, sin recurrir a Java Script. RichFaces aprovecha el framework Java

Server Faces, incluyendo su ciclo de vida, la validacin, los medios de conversin y

la gestin de los recursos estticos y dinmicos. Los componentes de RichFaces con

soporte Ajax y aspecto altamente personalizable pueden ser fcilmente incorporados

a aplicaciones JSF.

1.3.1.3 Ajax

Es el acrnimo para Asynchronous Java Script + XML y el concepto es: Cargar y

renderizar una pgina, luego mantenerse en esa pgina mientras scripts y rutinas van

al servidor buscando, en background, los datos que son usados para actualizar la

pgina solo re-renderizando la pgina y mostrando u ocultando porciones de la

misma. [2]

AJAX incorpora:

Presentacin basada en estndares usando XHTML y CSS.

Exhibicin e interaccin dinmicas usando el Document Object Model.

Intercambio y manipulacin de datos usando XML y XSLT.

Recuperacin de datos asincrnica usando XML Http Request.

15

1.3.1.4 Ajax4Jsf

Es una librera open source que se integra totalmente en la arquitectura de JSF y

extiende la funcionalidad de sus etiquetas dotndolas con tecnologa Ajax de forma

limpia y sin aadir cdigo Java Script. Mediante este framework se puede variar el

ciclo de vida de una peticin JSF, recargar determinados componentes de la pgina

sin necesidad de recargarla por completo, realizar peticiones al servidor automticas,

control de cualquier evento de usuario, etc. En definitiva Ajax4jsf permite dotar a la

aplicacin JSF de contenido mucho ms profesional con muy poco esfuerzo. [3]

1.3.1.5 Facelets

Es un framework simplificado de presentacin, en donde es posible disear de forma

libre una pgina web y luego asociarle los componentes JSF especficos. Aporta

mayor libertad al diseador y mejora los informes de errores que tiene JSF. Permite

que JSP (Java Server Pages) y JSF (Java Server Faces) puedan funcionar

conjuntamente en una misma aplicacin web. Estos no se complementan

naturalmente. JSP procesa los elementos de la pgina de arriba a abajo, mientras que

JSF dicta su propio re-rendering (ya que su ciclo de vida est dividido en fases

marcadas). Facelets llena este vaco entre JSP y JSF, siendo una tecnologa centrada

en crear rboles de componentes y estar relacionado con el complejo ciclo de vida

JSF.

Las principales ventajas de Facelets son:

Construccin de interfaces basadas en plantillas.

Rpida creacin de componentes por composicin.

Fcil creacin de funciones y libreras de componentes.

Facelets provee un proceso de compilacin ms rpido que JSP.

Provee templating, lo cual implica reutilizacin de cdigo, simplificacin de

desarrollo y facilidad en el mantenimiento de grandes aplicaciones.

16

1.3.1.6 Lenguaje de Marcado de Hipertexto Extensible (XHTML)

Es una versin ms estricta y limpia de HTML, que nace con el objetivo de remplazar

a HTML ante su limitacin de uso con las cada vez ms abundantes herramientas

basadas en XML. XHTML extiende HTML 4.0 combinando la sintaxis de HTML,

diseado para mostrar datos, con la de XML, diseado para describir los datos. [4]

1.3.1.7 Extensible Markup Language (XML)

No es solo un lenguaje, es una forma de especificar lenguajes, de ah el trmino de

extensible. Es un leguaje de etiquetas no predefinidas previamente, es decir, el

programador es el que las crea en cada caso. El XML ahorra tiempos de desarrollo y

proporciona ventajas, dotando a webs y a aplicaciones de una forma realmente

potente de guardar la informacin. Se ha convertido en un formato universal para el

intercambio de informacin estructurada entre diferentes plataformas. En la

actualidad permite la compatibilidad entre sistemas para compartir la informacin.

1.3.1.8 Java Script

Es un lenguaje de programacin interpretado, es decir, no requiere de compilacin

ya que el lenguaje funciona del lado del cliente, los navegadores son los encargados

de interpretar estos cdigos. Tiene la ventaja de ser incorporado en cualquier pgina

web, puede ser ejecutado sin la necesidad de instalar otro programa para ser

visualizado. Tiene como principal caracterstica ser un lenguaje independiente de la

plataforma.

1.3.2 Tecnologas en la capa de Negocio

1.3.2.1 Servidor de Aplicaciones

JBoss es un servidor de aplicaciones para Java. Es muy reconocido por ser de los

primeros servidores de aplicacin empresarial gratuito y open source. Al estar basado

en Java, puede ser utilizado en cualquier sistema operativo que lo soporte, ofreciendo

17

una plataforma de alto rendimiento para aplicaciones java, aplicaciones Web y

Portales.

1.3.2.2 Enterprise Java Beans (EJB)

Es una plataforma para construir aplicaciones de negocio portables, escalables, y

reutilizables utilizando el lenguaje de programacin java. Permite a los

desarrolladores enfocarse en la lgica del negocio sin tener que emplear tiempo en

la conformacin del cdigo de la infraestructura. Desde el punto de vista del

desarrollador es un pedazo de cdigo java que se ejecuta en un entorno especializado

denominado contenedor EJB que proporciona un conjunto de servicios. El servicio

de persistencia es proporcionado por un framework especializado denominado

proveedor de persistencia.

1.3.2.3 Plain Old Java Object (POJO"s)

Son las siglas utilizadas por programadores java para enfatizar el uso de clases

simples y que no dependen de un framework en especial.

1.3.3 Tecnologas en la capa de Acceso a Datos

1.3.3.1 Java Persistence API (JPA)

El Java Persistence API fue desarrollado por el grupo de expertos de EJB 3.0, aunque

su uso no se limita a los componentes software EJB. Tambin puede utilizarse

directamente en aplicaciones web y aplicaciones clientes; incluso fuera de la

plataforma Java EE.

En su definicin, se han combinado ideas y conceptos de los principales frameworks

de persistencia como Hibernate, Toplink y JDO y de las versiones anteriores de EJB.

Todos estos cuentan actualmente con una implementacin JPA.

18

1.3.3.2 Framework Hibernate

Hibernate es una capa de persistencia objeto/relacional y un generador de sentencias

SQL. Permite disear objetos persistentes que podrn incluir polimorfismo,

relaciones, colecciones, y un gran nmero de tipos de datos. De una manera muy

rpida y optimizada se puede generar bases de datos en cualquiera de los entornos

soportados: Oracle, DB2, MySql, etc. Y lo ms importante de todo, es open source,

lo que supone, entre otras cosas, que no se tiene que pagar nada por adquirirlo.

Hibernate ofrece tambin un lenguaje de consulta de datos llamado HQL (Hibernate

Query Language). Puede ser usado para desarrollar y distribuir aplicaciones de forma

gratuita. Es utilizado en las aplicaciones Java EE.

1.3.3.3 JBoss Seam

JBoss Seam es una nueva y poderosa aplicacin para la construccin de la prxima

generacin de aplicaciones Web 2.0 de la unificacin y la integracin de tecnologas,

como Java Script asncrono y XML (AJAX), Java Server Faces (JSF), Enterprise

Java Beans (EJB3), Java Portlets y Business Process Management (BPM).

Es un framework que integra y unifica los distintos estndares de la plataforma Java

EE, pudiendo trabajar con todos ellos siguiendo el mismo modelo de programacin.

Ha sido diseado intentado simplificar al mximo el desarrollo de aplicaciones,

basando el diseo en POJOs con anotaciones. Estos componentes se usan desde la

capa de persistencia hasta la de presentacin, poniendo todas las capas en

comunicacin directa. El ncleo principal de Seam est formado por las

especificaciones EJB3 y JSF.

(Daz., s.f.)

19

1.4 Planificacin de aplicaciones web

Si se tienen un idea sobre alguna aplicacin web, primero se tiene que planificar

cuidadosamente los pasos a seguir. Esta parte no puede ser omitida, pues de ello

depender la calidad del software as como los menos errores posibles en nuestra

aplicacin o modificacin de alguna mas.

Una declaracin de intensiones

Para empezar se debe anotar A quien esta dirigida la aplicacin, Cul es su

funcin? Y Cul es el pblico objetivo de la aplicacion?, de la forma mas precisa

posible, y se debe pensar en el contexto/situacin en la que el pblico utilizara al

aplicacin. Ejemplo:

Funcionalidad.

Obtener la ubicacin de un dispositivo con la mayor precisin posible.

Ingresar la ubicacin en un mapa de google.

Grupo de usuarios.

Desarrolladores que quieran aprender acerca de aplicaiones web abiertas y su

desarrollo para ser usada probablemente en una oficina o en un tren.

Cualquier persona que quiera saber cmo funciona, o para usarla al aire libre.

Lo ideal sera que se hiciera la aplicacin lo ms sencillo posible, centrarse en

conseguir que haga una cosa o un par de cosas, estrechamente relacionadas. Si se

tienen muchas ideas que desea alcanzar, es posible que desee dividirlas en diferentes

aplicaciones. Si la aplicacin requiere de experiencias diferentes para cada

plataforma, es probable que necesite tener listas separadas de aplicaciones para

escritorio y mviles (o incluso Tablet o TV).

20

A continuacin, intente escribir un resumen del uso de la aplicacin, que atraer a

las personas a descargarlo y probarlo. Si usted puede resumirlo en una frase,

entonces su idea es probablemente una buena opcin para una aplicacin!. Ejemplo

Para "Location Finder", escribimos:

Location Finder utiliza la geolocalizacin para saber dnde te encuentras, y

muestra un mapa de los alrededores, haciendo uso de los mapas de Google.

Pero quizs para una aplicacin solamente destinada a los usuarios finales seria as:

Location finder Localiza tu ubicacin y muestra lo que hay alrededor.

Primer dibujo de la aplicacin

Una vez que haya decidido sobre la intencin y el objetivo del pblico al usar su

aplicacin, siempre es una buena idea empezar con papel o bocetos, intente dibujar

lo que la aplicacin va a mostrar, y vea como el usuario usara su aplicacin.

Probablemente querr hacer un conjunto separado de dibujos para escritorio, mvil,

Tablet, TV, etc, si su lista de funcionalidades as lo requieren.

Siempre, incluya notas sobre lo que se necesita sean: grficos, funciones, etc, en cada

etapa, ya que al llegar a las etapas de diseo y desarrollo, sera necesario incluirlas y

as sera menos propenso al olvido de interesantes funcionalidades. Para "Location

Finder", hice solo un dibujo por lo sencillo de la aplicacin:

fig. 4 dibujo de la aplicacin

21

Para una aplicacin compleja dibujemos las diferentes reas de la aplicacin, intente

representar las diferentes reas de trabajo, tambin intentemos pensar en lo que busca

el usuario con su aplicacin.

Puede cualquier programa convertir una pgina en una aplicacin abierta?

Toda pgina o documento se puede convertir en una aplicacin Web abierta, pero en

algunos casos tales como procesadores de texto, o complicados sistemas de ventas

en lnea, no se puede convertir fcilmente, para estos casos es necesario hacer una

versin diferente para mviles, lo mejor es hacer algo parecido a lo que hizo el

servicio de ventas en lnea eBay, como podemos ver en su pgina web de escritorio

contiene complicados sistemas que seran un verdadero caos en un mvil, lo que hizo

eBay es dividir toda la informacin y hacer que sea lo ms fcil de ver, logro hacer

que deslizando hacia abajo la pantalla se vea el resto de la informacin, adems eBay

puso lo ms relevante arriba y las funcionalidades menos utilizadas abajo, o ms

escondidas, intento hacer las mnimas interacciones con el teclado.

fig. 5 versin web de eBay

22

Google Docs. Es otro interesante ejemplo, en su versin de escritorio goza de

funcionalidades que en un mvil seran un verdadero caos, lo que hizo fue dejar solo

el visualizador de texto, en una interfaz simple, bonita y amigable.

fig. 8 versin Web de google Docs.

fig. 7 versin mvil de eBay fig. 6 versin mvil de google Docs.

23

En esta etapa ya se debe pensar en las diferentes versiones de la aplicacin, para

mviles, tablets, y escritorio, que se incluir y que no, En la mayora de las

situaciones solo necesitaras fcilmente convertir tu web, o una web en una

aplicacin, en otras situaciones tendrs que disear un entorno totalmente nuevo para

mviles, o tablets y a veces ser necesario crear una aplicacin especialmente para

su uso en una determinada plataforma.

Si vas a hacer un entorno totalmente diferente al clsico, preocpate de dar la

opcin a los usuarios de cambiar entre el clsico y tu entorno, no creas que a todos

los usuarios les gustara lo que tu hagas.

(Mozilla Developer Network and individual contributors, 2015)

Pensar sobre las tecnologas que se usaran.

Muchas personas creen que llenar su aplicacin de funcionalidades la hace cada vez

mejor, y probablemente sea as, pero no olvides que el diseo y separar los

contenidos, es muy importante, para que tu aplicacin llegue a ser popular, si

integraras tecnologas de ltima generacin, preocpate de que para el usuario sea

fcil usar la aplicacin.

En general lo ms importante es la funcionalidad, el diseo, y los requisitos de la

aplicacin, adems de integrar nuevas y alucinantes tecnologas. Ejemplos de

preguntas que te ayudaran:

Es necesario el almacenamiento offline? si tu aplicacin necesita conectarse a

internet frecuentemente, para guardar datos, lo ms probable es que necesites una

conexin cliente-servidor-base de datos. Si tu aplicacin necesita guardar los datos

en el dispositivo, lo mejor sera que se instale en el sistema. Si necesitaras que la

informacin este en el mvil y en la red, tu necesitaras un mecanismo especial

cliente-servicio de almacenamiento en lnea, tales como IndexedDB o localStorage.

24

(La informacin proporcionada en estas lneas es bsica, se necesitara un grado

mayor de conocimiento, para la implementacin de su aplicacin)

Necesitas reproducir o manipular videos, fotos etc.? Probablemente necesitemoas

funciones de HTML5 tales como , , o .

Para obtener informacin acerca de lo que sucede alrededor del dispositivo

necesitaras API's. Tales como: API del estado de la batera, API del sensor de

proximidad, o API de la orientacin del dispositivo.

Plan de pruebas

Quizs esto se considere obvio pero es una de las partes ms importantes de un

proyecto, pues el plan de pruebas permite la correccin de errores antes de la

liberacin de la aplicacin al pblico, recuerda probar cada caracterstica de tu

aplicacin en periodos cortos de tiempo, para as no quedar con muchos errores,

tiempo y dinero desperdiciado. Un resumen del plan de pruebas:

Crea una versin bsica de tu aplicacin y entrgasela a tus familiares, amigos,

colegas, que ellos te den la primera impresin y te digan si les gusta o no, y si

tienen alguna idea para agregar a la aplicacin o si hay un error, tambin

pregntales sobre el diseo, si est bien si le falta algo, si es muy aburrido, o

si tiene mucho color, todo esto te servir para solucionar los primero

problemas.

Comparte tus dibujos, y haz preguntas tales como, le falta algo?, qu les

gustara que incluya en mi aplicacin?, qu diseo les gusta ms?

Despus de esto es una buena idea compartir tu aplicacin con personas fuera

del equipo de diseo, desconocidos, y que te digan realmente lo que es tu

aplicacin para ellos, y si la descargaran o no, por qu si y por qu no.

Haz diversas pruebas con tu aplicacin, hazla funcionar bajo estrs (varias

aplicaciones al mismo tiempo) y hazla funcionar en diversos dispositivos,

25

puede que solo en tu dispositivo funcione correctamente, tambin pruebala en

momentos de escaza memoria, y en navegadores antiguos, si quieres hacer una

aplicacin geneal, preocupate de que funcione en todos los dispositivos.

Antes de enviar la aplicacin al pblico en general, prueba todas las funciones

nuevamente, corrige todos los errores restantes, y termina de solucionar los

problemas, aunque despus actualizes la aplicacin a una nueva versin, no

puedes asegurarte de que todos la actualizaran.

26

B. Conclusin

La evolucin de las aplicaciones web ha ido incrementando con el paso del tiempo y

de las necesidades de la personas.

Quizs, ahora sea el motivo por el cual las personas exigen ms de las aplicaciones

que ven en internet, pues de manera tajante y dura las personas no visitan unapgina

de texto plano, si la pgina no logra lo que en resumen proyecta no sera de gran valor

tenerla activada, pues los visitantes harn caso omiso de sta.

Por ello los expertos en el rea, estudiantes en tecnologas de la informacin y dems

personas involucradas en el mbito de desarrollo web, debemos estar conscientes de

mejorar da con da, ampliar los conocimientos, todo aparitr de conocer las

estructuras de las aplicaciones web, si cimentamos bien esos conocimientos,

podremos evolucionar con la tecnologa a la par.

Es importante tener en cuenta nuestra planificacin, de ello depende la calidad y la

utilidad de nuestra pgina web.

27

C. Referencias

Daz., I. Y. (s.f.). Monografias. Obtenido de

http://www.monografias.com/trabajos98/tecnologias-y-herramientas-

desarrollo-aplicaciones-web-java/tecnologias-y-herramientas-desarrollo-

aplicaciones-web-java.shtml#tecnologia

Instituto Tecnologico de Matehuala. (s.f.). Programacion web. Obtenido de

https://programacionwebisc.wordpress.com/2-1-arquitectura-de-las-

aplicaciones-web/

Mauricio. (julio de 2011). Blogspot.mx. Obtenido de Desarrollo de Aplicaciones

Web: http://appsdelweb.blogspot.mx/2013/02/11-evolucion-de-las-

aplicaciones-web.html

Mozilla Developer Network and individual contributors. (2015). Centro de

aplicaciones. Obtenido de

https://developer.mozilla.org/es/Apps/Design/Planning_your_app