presentacion diseño web con jquery
DESCRIPTION
TRANSCRIPT
Diseño web con jQuery
Miguel Angel Alvarez
DesarrolloWeb.com
@alvarezmiguelan
1) Tendencias diseño 2012
2) Recursos jQuery en el diseño web
3) Casos prácticos de uso
zzzzz
jQuery es la esencia de la vida
Diseño según estándares
Grids fluidos
Menos Flash, hover, pixel perfect
Más Responsive Design
Desplazamiento horizontal
http://www.weshootbottles.com/
http://deanoakley.com/
http://vanityclaire.com/
Aplicaciones HTML5 para
dispositivos móviles
Animaciones CSS3
http://tutorialzine.com/2009/11/hovering-gallery-css3-jquery/
http://www.anthonycalzadilla.com/css3-ATAT/
Scroll Parallax – Sitios de 1 página
http://www.hyundai-veloster.eu/http://www.redirectdigital.com.br/
Interfaces enriquecidas
Diseños con componentes 3D
Slides – presentación de diapositivas
Infografías
Aplicaciones en el navegador
Tipografías
2) Recursos jQuery en el diseño web
Diseño
Programación
2) Recursos jQuery en el diseño web
Interacción + comportamientos
Menús dinámicos, ¿Solo CSS3?
http://css3menu.com/
http://codecanyon.net/item/menu-with-css3-effects-and-notification-bubbles/1147974
http://net.tutsplus.com/tutorials/html-css-techniques/how-to-create-a-drop-down-nav-
menu-with-html5-css3-and-jquery/
Animaciones CSS3
http://transformjs.strobeapp.com/
http://ricostacruz.com/jquery.transit/
Animaciones “cargando”
CSS3 + jQuery
http://fgnass.github.com/spin.js/
Interfaces de usuario para apps
http://jqueryui.com
http://www.kendoui.com/
http://wijmo.com/
Formularios, campos mejorados,
validación, ajax, etc.
http://demos.kendoui.com/web/validator
http://jquery.malsup.com/form/
http://textextjs.com/
Slides - Presentaciones
http://slidesjs.com/
http://nivo.dev7studios.com/
http://thiagosf.net/projects/jquery/skitter/
http://www.slidedeck.com/
http://buildinternet.com/project/supersized/
Efectos 3D
http://transformjs.strobeapp.com/
http://hakim.se/projects/reveal-js
http://lab.smashup.it/flip
http://www.zachstronaut.com/projects/rotate3di/
Tipografías
http://letteringjs.com/
http://fittextjs.com/
http://workshop.rs/2010/01/jqisotext-jquery-text-effect-plugin/
Scroll Parallax
http://jonraasch.com/blog/scrolling-parallax-jquery-plugin
http://www.davecranwell.com/content/jquery-scroll-parallax-plugin
http://webdev.stephband.info/parallax.html
https://github.com/imakewebthings/jquery-waypoints/
3) Casos de uso
http://www.intacto10years.com/
http://www.intacto10years.com/
jQuery
QueryLoader jQuery Plugin
https://github.com/Gaya/QueryLoader2
scrollTo jQuery Plugin
http://flesler.blogspot.com/2007/10/jqueryscrollto.html
scrolling Paralax jQuery Plugin
http://jonraasch.com/blog/scrolling-parallax-jquery-plugin
http://www.reverenddanger.com
http://www.reverenddanger.com
jQuery, Modernizr, jQueryUI, Easing
Flip jQuery Plugin
jquery-animate-css-rotate-scalehttps://github.com/zachstronaut/jquery-animate-css-rotate-scale
scrollTo
jQuery Waypoints
https://github.com/imakewebthings/jquery-waypoints/
Typekit
http://www.weareempire.co.uk/
http://www.weareempire.co.uk/
jQuery
jQuery Carousel
http://thomaslanciaux.pro/jquery/jquery_carousel.htm
Easing
TwitterJS
http://code.google.com/p/twitterjs/
http://www.redirectdigital.com.br/
http://www.redirectdigital.com.br/
jQuery
ScrollTo
jSizes
http://www.bramstein.com/projects/jsizes/
¿Diseño?