SlideShare una empresa de Scribd logo
1 de 35
Descargar para leer sin conexión
y soy diseñador de UI.
ITSON
      Novutek
  Internet Brands
      Nearsoft




(también soy freelance)
DISCLAIMER
Soy autodidacta. La universidad no me
enseñó mucho de lo que hago.



         (claro, ese es MI caso)
¿Qué hago?
  Soy diseñador de UI
¿Qué ch#&!)@#s es UI?
Ah, ¿eres diseñador gráfico?


            No.
Ah, ¿eres programador?


         No.
En realidad soy un híbrido entre
diseñador y programador. Mis
actividades cruzan la frontera entre
diseño y programación una y otra vez.
Ok. Ya. ¿Qué haces?


Diseño sitios web
Diseño aplicaciones web
Escribo HTML, CSS y JavaScript
Me peleo con los programadores
Me peleo con los diseñadores gráficos
Ok. Ya. ¿Qué haces?




Trato de lograr que los productos que diseño
sean extremadamente fáciles de usar.
Cambiar esto
Por esto
O esto
Por esto
“Design is not just what it
 looks like and feels like.
 Design is how it works.”



         (Steve Jobs)
Hablemos de sitios web
Malas ideas:


Navegación misteriosa
Contenido en Flash (o cualquier plugin)
Sitios increíblemente "pesados"
Sitios para una sola resolución de pantalla
Sitios que sólo funcionan en un navegador
Buenas ideas:

Planeación
Navegación clara y consistente
Títulos descriptivos
Textos cortos
Sitios que se adaptan a varias resoluciones
Estándares web
Este bato tenía razón.
Bueno, más o menos.
¿Qué necesito para hacer esto
     profesionalmente?
Aprende:


HTML
CSS
JavaScript
Diseño Gráfico
Aprende:


A utilizar un editor de texto. Olvídate de
dreamweaver. Mientras más plano, feo y
aburrido, mejor.
Aprende:



Que tus productos (sitios, aplicaciones) nunca
van a estar terminados.
Aprende:


Que no todo en la vida es Mac OS, iOS,
Windows, GNU/Linux, Android, o lo que sea
que uses.
Olvídate de:


Dreamweaver (si, ya lo dije)
Flash
Odiar a internet explorer (acéptalo, no se va a ir)
Y sobre todo:


Recuerda que NO ERES ARTISTA. Los artistas
son subjetivos, los diseñadores debemos ser
completamente objetivos y generar resultados
medibles.
Gracias... totales.


   (ahora platiquemos)
@axel
         (twitter)

axel@paskola.com
  (email, gtalk, google+)

http://dribbble.com/axel
  http://axelvaldez.mx

Más contenido relacionado

La actualidad más candente

La ventana de dreamweaver new
La ventana de dreamweaver newLa ventana de dreamweaver new
La ventana de dreamweaver new
jiovitha1305
 
La ventana de dreamweaver
La ventana de dreamweaverLa ventana de dreamweaver
La ventana de dreamweaver
jiovitha1305
 

La actualidad más candente (18)

Usabilidad En El DiseñO Web
Usabilidad En El DiseñO WebUsabilidad En El DiseñO Web
Usabilidad En El DiseñO Web
 
Html CSS JAVASCRIPT
Html CSS JAVASCRIPTHtml CSS JAVASCRIPT
Html CSS JAVASCRIPT
 
Actualizamos Tu Sitio Web
Actualizamos Tu Sitio Web
Actualizamos Tu Sitio Web
Actualizamos Tu Sitio Web
 
La ventana de dreamweaver new
La ventana de dreamweaver newLa ventana de dreamweaver new
La ventana de dreamweaver new
 
La ventana de dreamweaver
La ventana de dreamweaverLa ventana de dreamweaver
La ventana de dreamweaver
 
Marketing Vs. Diseño Vs. Desarrollo
Marketing Vs. Diseño Vs. DesarrolloMarketing Vs. Diseño Vs. Desarrollo
Marketing Vs. Diseño Vs. Desarrollo
 
1.páginas web online
1.páginas web online1.páginas web online
1.páginas web online
 
Web Gratis
Web GratisWeb Gratis
Web Gratis
 
Masterclass - Cómo comunicar tu idea al mercado con Wordpress
Masterclass - Cómo comunicar tu idea al mercado con WordpressMasterclass - Cómo comunicar tu idea al mercado con Wordpress
Masterclass - Cómo comunicar tu idea al mercado con Wordpress
 
Programas alternativos para presentaciones online tipan xavier
Programas alternativos para presentaciones online tipan xavierProgramas alternativos para presentaciones online tipan xavier
Programas alternativos para presentaciones online tipan xavier
 
Crea tu propio motor de videojuegos con backbone y canvas (html5)
Crea tu propio motor de videojuegos con backbone y canvas (html5)Crea tu propio motor de videojuegos con backbone y canvas (html5)
Crea tu propio motor de videojuegos con backbone y canvas (html5)
 
Diseño en Photoshop para principiantes.
Diseño en Photoshop para principiantes.Diseño en Photoshop para principiantes.
Diseño en Photoshop para principiantes.
 
Intimateo
IntimateoIntimateo
Intimateo
 
Diseccion de a Fase De Diseño
Diseccion de a Fase De DiseñoDiseccion de a Fase De Diseño
Diseccion de a Fase De Diseño
 
Conclusiones.
Conclusiones.Conclusiones.
Conclusiones.
 
Capturas de words tipan
Capturas de words tipanCapturas de words tipan
Capturas de words tipan
 
Herramienta tic
Herramienta ticHerramienta tic
Herramienta tic
 
Tritrazos
TritrazosTritrazos
Tritrazos
 

Destacado

Diaporama du show room(1)
Diaporama du show room(1)Diaporama du show room(1)
Diaporama du show room(1)
Yann Mar
 
Lb web mobile_slideshare
Lb web mobile_slideshareLb web mobile_slideshare
Lb web mobile_slideshare
ALTICS
 
Majestic SEO au Seo camp day 2013 Bayonne
Majestic SEO au Seo camp day 2013 BayonneMajestic SEO au Seo camp day 2013 Bayonne
Majestic SEO au Seo camp day 2013 Bayonne
François GOUBE
 
Doce Del Maestro 4
Doce Del Maestro 4Doce Del Maestro 4
Doce Del Maestro 4
Rubén Ortiz
 
Depliant vote-commune-plus-de-mille-habitants
Depliant vote-commune-plus-de-mille-habitantsDepliant vote-commune-plus-de-mille-habitants
Depliant vote-commune-plus-de-mille-habitants
AlainBenard
 
Présentation finale WEB.pdf
Présentation finale WEB.pdfPrésentation finale WEB.pdf
Présentation finale WEB.pdf
maxybeaute
 

Destacado (20)

Intimement Nine
Intimement  NineIntimement  Nine
Intimement Nine
 
Docencia / Investigación, tecnologias y biblioteca: la convergencia en la ges...
Docencia / Investigación, tecnologias y biblioteca: la convergencia en la ges...Docencia / Investigación, tecnologias y biblioteca: la convergencia en la ges...
Docencia / Investigación, tecnologias y biblioteca: la convergencia en la ges...
 
Exposicion de fotos
Exposicion de fotosExposicion de fotos
Exposicion de fotos
 
Diaporama du show room(1)
Diaporama du show room(1)Diaporama du show room(1)
Diaporama du show room(1)
 
Lb web mobile_slideshare
Lb web mobile_slideshareLb web mobile_slideshare
Lb web mobile_slideshare
 
Rosaire Vivant ou "Rotario Ora"
Rosaire Vivant ou "Rotario Ora"Rosaire Vivant ou "Rotario Ora"
Rosaire Vivant ou "Rotario Ora"
 
Scent linq Brosur
Scent linq BrosurScent linq Brosur
Scent linq Brosur
 
La imagen en los medios
La imagen en los mediosLa imagen en los medios
La imagen en los medios
 
Demanda
DemandaDemanda
Demanda
 
Majestic SEO au Seo camp day 2013 Bayonne
Majestic SEO au Seo camp day 2013 BayonneMajestic SEO au Seo camp day 2013 Bayonne
Majestic SEO au Seo camp day 2013 Bayonne
 
Danza Lenta
Danza LentaDanza Lenta
Danza Lenta
 
Acuario Fluvial de Expo Zaragoza 2008
Acuario Fluvial de Expo Zaragoza 2008Acuario Fluvial de Expo Zaragoza 2008
Acuario Fluvial de Expo Zaragoza 2008
 
AREVA, resultats annuels 2008
AREVA, resultats annuels 2008AREVA, resultats annuels 2008
AREVA, resultats annuels 2008
 
Doce Del Maestro 4
Doce Del Maestro 4Doce Del Maestro 4
Doce Del Maestro 4
 
Test developpement v1
Test developpement v1Test developpement v1
Test developpement v1
 
Depliant vote-commune-plus-de-mille-habitants
Depliant vote-commune-plus-de-mille-habitantsDepliant vote-commune-plus-de-mille-habitants
Depliant vote-commune-plus-de-mille-habitants
 
Enciclopedias Colaborativas en catalan DiM Trams
Enciclopedias Colaborativas en catalan DiM TramsEnciclopedias Colaborativas en catalan DiM Trams
Enciclopedias Colaborativas en catalan DiM Trams
 
Présentation finale WEB.pdf
Présentation finale WEB.pdfPrésentation finale WEB.pdf
Présentation finale WEB.pdf
 
Fliegen1
Fliegen1Fliegen1
Fliegen1
 
Conocimiento libre
Conocimiento libreConocimiento libre
Conocimiento libre
 

Similar a ULSA Nov/11

Introducción al Diseño web
Introducción al Diseño webIntroducción al Diseño web
Introducción al Diseño web
ciwmx
 

Similar a ULSA Nov/11 (20)

Pixel Perfect Web Design.
Pixel Perfect Web Design.Pixel Perfect Web Design.
Pixel Perfect Web Design.
 
Pulso Digital
Pulso DigitalPulso Digital
Pulso Digital
 
Blogs, Redes Sociales y el Diseño actual SMCMX
Blogs, Redes Sociales y el Diseño actual SMCMXBlogs, Redes Sociales y el Diseño actual SMCMX
Blogs, Redes Sociales y el Diseño actual SMCMX
 
Ux ui, front-end y back-end
Ux ui, front-end y back-endUx ui, front-end y back-end
Ux ui, front-end y back-end
 
Diseño de Páginas Web (Web Design).pdf
Diseño de Páginas Web (Web Design).pdfDiseño de Páginas Web (Web Design).pdf
Diseño de Páginas Web (Web Design).pdf
 
Diseño de páginas web (web design)
Diseño de páginas web (web design)Diseño de páginas web (web design)
Diseño de páginas web (web design)
 
Celebración día del diseñador 27 de abril 2015 #YoDiseñoConAdobe
Celebración día del diseñador 27 de abril 2015 #YoDiseñoConAdobe Celebración día del diseñador 27 de abril 2015 #YoDiseñoConAdobe
Celebración día del diseñador 27 de abril 2015 #YoDiseñoConAdobe
 
INTRODUCCION AL DISEÑO WEB.pptx
INTRODUCCION AL DISEÑO WEB.pptxINTRODUCCION AL DISEÑO WEB.pptx
INTRODUCCION AL DISEÑO WEB.pptx
 
Present 1
Present 1Present 1
Present 1
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Introducción al Diseño web
Introducción al Diseño webIntroducción al Diseño web
Introducción al Diseño web
 
Diseño web ANTONIO.pptx
Diseño web ANTONIO.pptxDiseño web ANTONIO.pptx
Diseño web ANTONIO.pptx
 
Las 5 Reglas de Oro del Diseño Web Responsive
Las 5 Reglas de Oro del Diseño Web ResponsiveLas 5 Reglas de Oro del Diseño Web Responsive
Las 5 Reglas de Oro del Diseño Web Responsive
 
Responsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño webResponsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño web
 
04 Adobe CS Conceptos minimos
04 Adobe CS Conceptos minimos04 Adobe CS Conceptos minimos
04 Adobe CS Conceptos minimos
 
Editor de bloques (Gutenberg) De odiarlo a no poder vivir sin él
Editor de bloques (Gutenberg) De odiarlo a no poder vivir sin élEditor de bloques (Gutenberg) De odiarlo a no poder vivir sin él
Editor de bloques (Gutenberg) De odiarlo a no poder vivir sin él
 
Etapas del desarrollo web
Etapas del desarrollo webEtapas del desarrollo web
Etapas del desarrollo web
 
Diseño de Interfaces
Diseño de InterfacesDiseño de Interfaces
Diseño de Interfaces
 
Taller de Dreamweaver 8
Taller de Dreamweaver 8Taller de Dreamweaver 8
Taller de Dreamweaver 8
 
Buenas prácticas para crear tu página web - Nominalia
Buenas prácticas para crear tu página web - NominaliaBuenas prácticas para crear tu página web - Nominalia
Buenas prácticas para crear tu página web - Nominalia
 

Último

secuencias de los figuras de cuadros y rectangulos
secuencias de los figuras de cuadros y rectangulossecuencias de los figuras de cuadros y rectangulos
secuencias de los figuras de cuadros y rectangulos
RosarioLloglla
 
140254879-Triptico-Color-Dia-de-La-Madre.doc
140254879-Triptico-Color-Dia-de-La-Madre.doc140254879-Triptico-Color-Dia-de-La-Madre.doc
140254879-Triptico-Color-Dia-de-La-Madre.doc
ilvrosiebp
 
GRUPO 1.pptx problemas oportunidades objetivos
GRUPO 1.pptx problemas oportunidades objetivosGRUPO 1.pptx problemas oportunidades objetivos
GRUPO 1.pptx problemas oportunidades objetivos
CristianGmez22034
 
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docxPLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
Leo Florez
 

Último (20)

Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientes
 
Torre agbar analisis arquitectonico.....
Torre agbar analisis arquitectonico.....Torre agbar analisis arquitectonico.....
Torre agbar analisis arquitectonico.....
 
guia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfguia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdf
 
secuencias de los figuras de cuadros y rectangulos
secuencias de los figuras de cuadros y rectangulossecuencias de los figuras de cuadros y rectangulos
secuencias de los figuras de cuadros y rectangulos
 
140254879-Triptico-Color-Dia-de-La-Madre.doc
140254879-Triptico-Color-Dia-de-La-Madre.doc140254879-Triptico-Color-Dia-de-La-Madre.doc
140254879-Triptico-Color-Dia-de-La-Madre.doc
 
Planificación del mes de afrovenezolanidad2024.doc
Planificación del mes de afrovenezolanidad2024.docPlanificación del mes de afrovenezolanidad2024.doc
Planificación del mes de afrovenezolanidad2024.doc
 
Fundamentos de la Ergonomía y sus características principales
Fundamentos de la Ergonomía y sus características principalesFundamentos de la Ergonomía y sus características principales
Fundamentos de la Ergonomía y sus características principales
 
GROPUIS Y WRIGHT DIPOSITIVA ARQUITECTURA DISEÑO MODERNIDAD
GROPUIS Y WRIGHT DIPOSITIVA ARQUITECTURA DISEÑO MODERNIDADGROPUIS Y WRIGHT DIPOSITIVA ARQUITECTURA DISEÑO MODERNIDAD
GROPUIS Y WRIGHT DIPOSITIVA ARQUITECTURA DISEÑO MODERNIDAD
 
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdfINICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
 
Slaimen Barakat - SLIDESHARE TAREA 3.pdf
Slaimen Barakat - SLIDESHARE TAREA 3.pdfSlaimen Barakat - SLIDESHARE TAREA 3.pdf
Slaimen Barakat - SLIDESHARE TAREA 3.pdf
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio
 
Afiche de arquitectura manierista Paola Perez
Afiche de arquitectura manierista Paola PerezAfiche de arquitectura manierista Paola Perez
Afiche de arquitectura manierista Paola Perez
 
Portafolio Santiago Agudelo Duran 2024 -30
Portafolio Santiago Agudelo Duran 2024 -30Portafolio Santiago Agudelo Duran 2024 -30
Portafolio Santiago Agudelo Duran 2024 -30
 
DISENO_FACTORIAL_2_2_EXPOSICION_pptx.pptx
DISENO_FACTORIAL_2_2_EXPOSICION_pptx.pptxDISENO_FACTORIAL_2_2_EXPOSICION_pptx.pptx
DISENO_FACTORIAL_2_2_EXPOSICION_pptx.pptx
 
SESION 05 MOBILIARIO Y EQUIPAMIENTO.pptx
SESION 05 MOBILIARIO Y EQUIPAMIENTO.pptxSESION 05 MOBILIARIO Y EQUIPAMIENTO.pptx
SESION 05 MOBILIARIO Y EQUIPAMIENTO.pptx
 
POESÍA ERÓTICA DEL SIGLO XVIII - SERIA Y CARNAL
POESÍA ERÓTICA DEL SIGLO XVIII - SERIA Y CARNALPOESÍA ERÓTICA DEL SIGLO XVIII - SERIA Y CARNAL
POESÍA ERÓTICA DEL SIGLO XVIII - SERIA Y CARNAL
 
GRUPO 1.pptx problemas oportunidades objetivos
GRUPO 1.pptx problemas oportunidades objetivosGRUPO 1.pptx problemas oportunidades objetivos
GRUPO 1.pptx problemas oportunidades objetivos
 
Arte textil: Tejidos artesanos en la frontera hispano-lusa
Arte textil: Tejidos artesanos en la frontera hispano-lusaArte textil: Tejidos artesanos en la frontera hispano-lusa
Arte textil: Tejidos artesanos en la frontera hispano-lusa
 
Arquitectos del Movimiento Moderno Pt. 2.pdf
Arquitectos del Movimiento Moderno Pt. 2.pdfArquitectos del Movimiento Moderno Pt. 2.pdf
Arquitectos del Movimiento Moderno Pt. 2.pdf
 
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docxPLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
 

ULSA Nov/11