¿Proceso para la creacion de una web?
5 seguidores
cual es el proceso normal para la creación de una web basica? he leido en el foro gente que se horroriza cuando leen que diseñan la web con photoshop, que programa es ideal para esto? y despues de tener el diseño cual es el paso siguiente y que programa usan? gracias de antemano por sus respuestas
abn Profesor Plus
En mi caso, primero hago una especie de brainstorming pensando en todo lo que debería llevar y contener la web. Posteriormente, descargo la idea en uno o varios bocetos/sketches en papel, rápidos, que sirvan para plasmarlo todo y luego poder decidir. Más adelante realizo los wireframes en base a cómo pienso que debería presentarse la información (y qué información) para que sea efectiva al usuario. También en este proceso intento meter los copies y textos definitivos… no me espero a hacer un mockup con Lorem Ipsum. Para acabar, realizo la ejecución de la UI con Photoshop y eso es lo que ya se envía a cliente/jefe para ir iterando.
Si el proyecto es muy gordo y el cliente no sabe muy bien lo que quiere, intento enviarle también los wireframes para que valide la idea. No quiero malgastar horas de ejecución para nada.
Linton
El comienzo de una web: un buen boceto.
andellamarche
ohh ya ahora si todo tiene sentido no habia notado que faltaba fireworks cc en la suite
Alex Bailon
Hola @andellamarche,
Antes Fireworks era un programa de Adobe que venía incluido en la suite adobe o se podía comprar por separado, creo que desde la actualización CS6 de la suite de Adobe, prescindieron de Fireworks, por que a mi parecer, debía de ser un programa usado por muy pocos para diseñar y por tanto paralizaron el desarrollo en pro de Photoshop, pero esto ya son suposiciones mias.
andellamarche
muchas gracias chicos me aclararon un montón de dudas, ando emprendiendo un proyecto web y bueno voy poco a poco, tratando de seguir los pasos correctos y evitando las malas practicas, por cierto ya he leido eso de que "adobe se cargo fireworks" me pueden ayudar a entender esa frase? como era antes y como es ahora?
Usuario desconocido
Yo ataco el diseño de una web en tres etapas fundamentales:
Una primera en la que defino el concepto gráfico. Esto suelo hacerlo sin encorsetarme en las dimensiones de la web. Elijo tipografías, paletas de color, recursos visuales, composición. Es un ejercicio de creatividad. Para ello trabajo en photoshop. Sin problema.
A partir de aquí, la cosa se vuelve más técnica en función de los requisitos del trabajo. La envergadura del proyecto, si el diseño ha de ser responsive y un largo etcétera que te impone el briefing definen los pasos a seguir. De todos modos, en general, hay que pasar por una fase de prototipado (todo esto te lo digo de forma muy superficial. Esta parte es fundamental en proyectos complejos y hay que definir muy bien todos los procesos y tareas que un usuario tenga que hacer en la web) En tu caso puedes empezar con los wireframes de tu web usando para ello balsamiq o axure (algo más complejo y con más funcionalidades)
Para el diseño de interfaz, que es lo que yo hago después, basicamente, transformo esos wireframes en pantallas. Aquí es dónde trabajar con photoshop no es lo más efectivo. En webs tochas es muy útil usar programas que te permitan automatizar ciertos flujos de trabajo y tareas recurrentes. En este caso puedes usar Fireworks (aunque adobe se lo haya cargado) o alguno de los progamas de diseño de interfaz más específicos y que ahora están tomando fuerza, como Sketch (para mac) De cualquier modo, si lo haces en photosop, de nuevo sin problema. Y el que no lo haga/haga hecho, que tire la primera piedra.
Estos son, grosso modo, los pasos para diseñar una web. Cómo te digo esto es un pequeño resumen en el que no he tenido en cuenta los aspectos técnicos que hay que tener en cuenta en todas las fases.
Después y/o durante el diseño hay que programar, pero ese ya es otro mundo aparte.
ponchi
Los pasos básicos son lo que te ha dicho Alex
Mírate este post de hace poco en el que se habla de programas para maquetar
Alex Bailon
Boceto > Photoshop > Editor de texto
Por ejemplo.
Cada uno las diseña como quiere o como mejor le va, pero desde que fireworks ya no está se suele usar photoshop, yo uso Photoshop + Slicy, la combinación de los dos me ahorra muchas horas de trabajo.