Page 1

introducciテウn al...

DISEテ前 WEB

ciw.mx


Diferencias entre Diseño Gráfico y Diseño Web?


Que es el Dise単o Web?


Que es el Diseño Web? No es crear gráficos estéticos No es presentar información de manera agradable No es Photoshop, Flash o Dreamweaver No es acomodar elementos No es diseño gráfico


Descargar un template y modificarlo

Jamais! (Nunca)


Diseño Web=Diseño Gráfico

El diseño gráfico es tan sólo una parte del diseño web


Navegabilidad como se mueve en la web

Usabilidad como se utiliza una web

Arquitectura de la Informaci贸n Composici贸n y Estructuraci贸n del Contenido

Interactividad


Aplicaci贸n del Dise帽o a la Web Multimedia

Audio

Texto

Video

Imagen


Objetivo del Dise帽o Web? Mostrar informaci贸n de una manera facil y Accesible para todo tipo de usuario permitir establecer comunicaci贸n efectiva con el usuario.


Función del Diseñador Web Crear un traje a la medida de las necesidades del cliente o de la empresa!

•Establezca comunicación con el usuario •Presente contenido relevante •Que sea eficiente •Que tenga un diseño agradable y sencillo •Que proyecte la esencia del sitio, producto o empresa.


Como funciona? C贸digo HTML

Navegador

Usuario


Etapas del Diseño Web... Diseño de la Información

Diseño del Sitio

Diseño de Páginas

Desarrollo

•Objetivo sitio

Estructura

Layout

HTML y CSS

•Objetivo usuario

Navegación

Prototipo en papel

Flash e Imágenes

•Audiencia

Interacción

Multimedia

•Contenido

Funcionalidad

Prototipo Photoshop

•Copywriting

Usabilidad

Prototipo Web (en imagen)

Validación

Programación Pruebas


1. Diseño de la información •¿Qué queremos lograr con el sitio? •¿Qué queremos proyectar? •¿Quiénes son nuestros usuarios? •¿Qué contenido vamos a presentar? * •¿De que manera lo vamos a hacer?


2. Diseño del Sitio ¿Qué secciones tendrá el sitio? ¿Qué tipo de navegación se utilizará? ¿Cómo va a utilizar el usuario el sitio? ¿Qué funciones va a tener? Reglas de usabilidad *


3. Diseño de Páginas Las interfaces El prototipo en papel El prototipo en Photoshop Simulación con mapa de imágenes Se acepta el diseño final


3. DiseĂąo de PĂĄginas

Prototipo en Photoshop


4. Desarrollo Se crean los archivos finales Se optimizan y cortan im谩genes Se programan las funciones del sitio Se crean validaciones para formas Se hacen pruebas y correcciones

Contenidos + Presentaci贸n

XHTML

CSS

(Contenidos)

(Presentaci贸n)


Reglas de Usabilidad Reglas Básicas: No me hagas pensar. Diseña para escaneo no para lectura Omite palabras innecesarias Elimina instrucciones Deja claro donde se hace clic Usa una Jerarquía Visual Clara No reinventes la rueda, sigue los estándares Si lo entiende tu abuela funciona Haz pruebas de usabilidad


Diferencias entre Dise単ador Web y Desarrollador Web? FrontEnd y BackEnd


Herramientas del Dise単ador Web


Ventajas y Beneficios Mercado muy explotable Puede ser Autodidacta Comunidades de apoyo en Internet Muchas areas de especializacion


Oportunidades de Empleo Instituciones Empresas Startups (Emprendimiento) Empresas de Software Freelance Comercio Electr贸nico


Oportunidades y Modos de expansi贸n


Oportunidades y Modos de expansi贸n


Dificultades y Retos comunicaci贸n con Desarrolladores Problemas T茅cnicos Constante actualizaci贸n Comunicaci贸n con el cliente


Alumno:Valverde Paz Soldan Jesus Seccion:V - A-10 eh

Diseño web y diseño grafico  

Diferencias entre el diseño web y el diseño grafico

Advertisement