1.4 Planificacin de aplicaciones web.

Muchos diseadores en algn u otro momento hemos cado en la tentacin de

comenzar a disear un nuevo proyecto sin ningn tipo de planificacin previa. Ya
sea por pecar de novatos, perezosos o simplemente no creer en que la
planificacin debe formar parte de nuestro proceso creativo.

La planificacin debe formar siempre parte de nuestro proceso creativo, no es

algo opcional.

Con planificacin previa no se est sugiriendo numerosas horas de escrupulosa

planificacin y organizacin de todo lo que haremos, ha de ser prctico y en
ningn momento debe ser peor el remedio que la enfermedad, recordad que nos
interesa planificar para ahorrar tiempo y ganar en calidad.
En este proceso previo de planificacin es importante que obtengamos respuesta
a preguntas tan bsicas como:

1. Qu tipo de web voy a crear?

2. Qu clase de pblico visitar la web?
3. Cul es la finalidad / objetivo final de la web?
4. Cumplir el diseo en mente los objetivos? Es usable e intuitivo?

Contestando a este tipo de preguntas (se puede(n) aadir y/o quitar alguna(s)) nos
enfrentamos a problemas que
a
pesar
de
ser
demasiado
obvios
nos ahorrarn ms de un dolor de cabeza cuntas veces hemos no
desechado diseos visualmente atractivos pero que no cumplen los objetivos
bsicos?

Consejos para planificar una aplicacin web

A menudo antes de empezar un proyecto no tenemos claro cal es el objetivo del mismo
o qu pretendemos alcanzar por eso esta pequea lista te puede ayudar a la hora
de planificar un proyecto.

Planificar una aplicacin web implica pensar y definir muchas

cuestiones de importancia:

1. Planificar el futuro
Puede sonar un poco duro que nos tengamos planear el futuro de
algo que an no existe pero es as, que pasa si en un futuro
tuvieramos problemas de escalabilidad, y s tuvieramos que migrar las bases de datos de
MySql a Oracle, de una buena planificacin depende la dificultad en un futuro de
realizar cambios en la plataforma que sostiene nuestra aplicacin.

2. Documentacin
Documenta todo lo que puedas tu aplicacin en especial aquellas partes de la misma
que hayan requerido un mayor tiempo de desarrollo, en un futuro cercano te librar de
ms de un quebradero de cabeza.

3. No empiezes por los pequeos detalles

A menudo es ms sencillo plantearse el desarrollo de pequeos servicios cmo pueden
ser los RSS o una galera de imgenes, pero es fundamental comenzar por lo que
vendr a ser la base de nuestra aplicacin, de este modo podremos ir completando
nuestra aplicacin en un orden lgico, primero los cimientos

4. Diseo de la interfaz
Esta entrada puede que te ayude en esta parte, es importante conseguir un buen
diseo para nuestra interfaz, es importante conseguir un interfaz que se atractivo y til
para la gran mayoria de los usuarios, lo ms importante es llegar a conectar con el
usuario y la mejor manera es ofrecerle la mayor cantidad de informacin posible para que
se llegue a sentir parte del proyecto pero todo esto muchas veces no lo llegamos a
conseguir por una mala eleccin en la combinacin de los colores que se integran en
nuestra interfaz.

5. Evita construirte
innecesarios

libreras

frameworks

Muchas personas siempre sostienen que es mejor que cada desarrollador utilize sus
propias libreras, pero la realidad es que en muchas ocasiones esto supone una gran

prdida de tiempo, es mejor buscar una librera o framework que se parezca lo ms

posible a lo deseado que desarrollarlo por ti mismo.

6. Ten un plan de proyecto

Asegrate de que cada desarrollador que trabaje en el proyecto sepa qu es lo que
debe de hacer y cundo tiene que hacerlo, teniendo todo esto redactado en un
documento te ayudar a identificar problemas.

7. Elige el lenguaje adecuado

Ya sabes que hay numerosas discusiones sobre Cal es el mejor lenguaje de
programacin?, la respuesta a menudo es depende de para que quieras utilizarlo, por
eso asegrate de escoger el lenguaje adecuado.

8. Evita las distracciones

Optimiza tu tiempo, cuando ests trabajando que nada te distraiga, ni llamadas
telefnicas, ni clientes de mensajeras instantneas, proponte un buen nmero de
horas al da de trabajo aislado dedicado al proyecto.

9. Sigue un buen control de calidad

Muchas veces nos equivocamos al planificar los tiempos de proyecto y esto lleva a
menudo a los desarrolladores a tener que escribir cdigo sucio, esta es una buena
opcin si lo que quieres es una demo de la aplicacin funcionando pero ea actitud te
traer problemas en el futuro.

10. Plantate los pasos a seguir despus del

desarrollo
Ten en cuenta que est fase de desarrollo algn da deber acabar, estudia con qu
frecuencia se deber actualizar y que se necesita para que este funcione.

Herramientas para planificacin de diseos web

Si bien no estn todas las existentes del mercado (otra cosa no, pero de esto hay
mucho), he querido resaltar aquellas que me han parecido ms interesantes y que
he utilizado en algn momento a modo de prueba o en proyectos reales.

UWE UML

UWE UML (UML-Based Web Engineering) es una herramienta para modelar

aplicaciones web, utilizada en la ingeniera web, prestando especial atencin en
sistematizacin y personalizacin (sistemas adaptativos).
UWE es una propuesta basada en el proceso unificado y UML pero adaptados a la
web. En requisitos separa las fases de captura, definicin y validacin. Hace
adems una clasificacin y un tratamiento especial dependiendo del carcter de
cada requisito.
Consiste en una notacin y en un mtodo.
La notacin se basa en UML (OMG, 2003): para aplicaciones Web en general y
para aplicaciones adaptativas en particular.
El mtodo consta de seis modelos:
Modelo de casos de uso para capturar los requisitos del sistema.
Modelo conceptual para el contenido (modelo del dominio).
Modelo de usuario: modelo de navegacin que incluye modelos estticos y
dinmicos.
Modelo de estructura de presentacin, modelo de flujo de presentacin.
Modelo abstracto de interfaz de usuario y modelo de ciclo de vida del
objeto.

Modelo de adaptacin.

Balsamiq Mockups

Balsamiq Mockups es una herramienta multiplataforma (Linux, Windows, Mac)

que nos permite arrastrar y soltar todo tipo de elementos web, mviles y otros
controles comunes para agilizar el brainstorming y bocetos iniciales de cualquier
tipo de proyectos.

No es casualidad que aparezca de primero en la lista, actualmente es el que utilizo

para la mayora de proyectos en Cokidoo.

Entre otras cosas se nos permite crear documentos con mltiples pginas (algo
as como las hojas de Excel) as como editar los propios elementos pudiendo
aadir de manera rpida y por pseudocdigo contenido a los mismos: items en un
men de navegacin, registros en una tabla etc.

HotGloo

HotGloo Una herramienta de wireframing con un aspecto e interfaz muy cuidada

que no slo est pensada para diseadores, sino tambin para programadores.
Como buen servicio web, no necesitaremos preocuparnos ni de descargas ni
actualizaciones constantes, tan slo crearemos nuestra cuenta y comenzaremos a
disfrutar del servicio.

HotGloo favorece la relacin entre clientes y miembros del mismo equipo pudiendo
editar y comentar casi cualquier parte de nuestro trabajo mediante un sistema en
tiempo real de colaboracin con chat integrado. Por momentos algunas de sus
caractersticas recuerdas aBasecamp (salvando las distancias).

Gliffy

Gliffy es un aplicacin online para la creacin de diagramas, permitindonos crear

de manera fcil y cmoda todo tipo de planos y diagramas con un acabado
bastante profesional.

Lgicamente entre planos de viviendas, grficas, diagramas base, dibujos tcnicos

y otro tipo de diseos podremos esbozar nuestros diseos web.

iPlotz

iPlotz permite crear de manera rpida y cliqueable todo tipo de prototipos web,
pero adems soporta elementos para la planificacin de todo tipo de aplicaciones
de software. Esmultiplataforma pudiendo ser ejecutado en Linux, Windows, Mac
o embebido en navegador web mediante flash.

Incorpora un gestor de proyectos de manera que podamos tener mltiples

proyectos bajo una misma cuenta, adems de incorporar un sistema de
discusin con el que valorar las distintas creaciones con el fin de mejorar el
trabajo final.

Pencil Project

Pencil Project es un plugin para Firefox que nos permite realizar prototipados de
interfaces de usuario directamente en nuestro navegador.
Incluye las herramientas de dibujado tpicas que se pueden esperar de este tipo
de programas, adems de ser multiplataforma y aceptar plantillas
predefinidas por nosotros mismos. Como curiosidad est apoyado por la
fundacin Mozilla.

Lpiz & Papel

Si bien me decanto por Balsamiq Mockups como herramienta de sketching, previo

a su utilizacin siempre hay una ronda de lpiz y papel con la que empezar
a desatascar la mente y empezar a generar buenas ideas.

Por lo general plasmar los primeros bocetos o garabatos en un papel de forma

rpida y cmoda suele ser una buena prctica para luego pasarlos a limpio y
completarlos con uno de estos programas. Posteriormente podremos
enserselos a clientes o resto del equipo de trabajo.

Reflexin final

Realmente no se ha descubierto nada nuevo, la planificacin es siempre una

parte importante de cualquier tipo de tarea o proyecto, dedicando unos pocos
minutos a pensar en los posibles problemas y objetivos podremos minimizar las
horas perdidas y de improvisacin.

En cuanto a las herramientas para la creacin de bocetos y previas a nuestros

diseos web, son realmente interesantes de cara a evitar discusiones
tontas iniciales, ya que nos aleja de formas y colores y nos enfoca en lo
importante, en la estructura y objetivo del diseo final. El tiempo es oro
.