Blog de unique3w » Diseño web http://blog.unique3w.com Blog, recursos, diseño y programación web en unique3w.com Sun, 05 Feb 2012 12:40:48 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 IxEdit, la primera herramienta para crear interacciones ‘al vuelo’http://blog.unique3w.com/ixedit-la-primera-herramienta-para-crear-interacciones-al-vuelo http://blog.unique3w.com/ixedit-la-primera-herramienta-para-crear-interacciones-al-vuelo#comments Tue, 30 Mar 2010 12:55:02 +0000 admin http://blog.unique3w.com/?p=1832

Las interacciones son cambios visuales qué ocurren en la pantalla cuando un usuario actúa sobre los elementos del interface cómo por ejemplo clicks sobre un botón, imágenes qué cambian a otras, etc.

IxEdit es una herramienta de diseño basada en javascript para crear esas interacciones rápidamente en la fase de prototipar tu aplicación web y sin apenas tener qué tocar código.

La edición se realiza directamente en el navegador y puede ser aplicada en tiempo real. Lo mejor es qué las interacciones editadas pueden ser guardadas en un entorno de base de datos local si el navegador lo permite.

Ver video de demostración (en inglés):

Artículos relacionados

]]> http://blog.unique3w.com/ixedit-la-primera-herramienta-para-crear-interacciones-al-vuelo/feed 1 Como añadir un botón de ‘Ir arriba’ en tu wordpresshttp://blog.unique3w.com/como-anadir-un-boton-de-ir-arriba-en-tu-wordpress http://blog.unique3w.com/como-anadir-un-boton-de-ir-arriba-en-tu-wordpress#comments Fri, 29 Jan 2010 16:14:37 +0000 admin http://blog.unique3w.com/?p=1561 Voy a explicar como añadir sencillamente un botón de ‘subir hasta arriba’ en la parte inferior derecha del navegador.

Si incluyes muchos posts o bien estos son largos, la tarea para el usuario para desplazarse de abajo a arriba en un momento determinado puede resultar tediosa. Añade otra pequeña ayuda a la navegabilidad de tu blog con una sencila línea de código.

En primer lugar ve a tu editor de temas, opción editor bajo el menú apariencia y selecciona el archivo index.php (es la plantilla de página principal)

editor de temas1 Como añadir un botón de Ir arriba en tu wordpress

editor de temas2 Como añadir un botón de Ir arriba en tu wordpress
Seguidamente inserta la siguiente línea de código antes (importante) de cerrar el primer DIV:

# código anterior
<a style="position: fixed; bottom: 5px; right: 5px;" title="Ir arrriba" href="#"><img src="LINK A TU IMAGEN" alt="" /></a>

Y nada más, puedes ver el ejemplo de la implementación en este mismo blog.

Artículos relacionados

]]> http://blog.unique3w.com/como-anadir-un-boton-de-ir-arriba-en-tu-wordpress/feed 3 Crear un espectacular ‘login’ de estilo machttp://blog.unique3w.com/crear-un-espectacular-login-de-estilo-mac http://blog.unique3w.com/crear-un-espectacular-login-de-estilo-mac#comments Thu, 28 Jan 2010 14:07:32 +0000 admin http://blog.unique3w.com/?p=1549 Bonito y sencillo tutorial con el qué aprender a crear un sistema de login y darle ese aspecto Mac tan especial. Las animaciones, aunque mínimas resultan muy vistosas; la caja tiembla al introducir una contraseña incorrecta y carga una barra de progreso al introducir un password correcto.

login estilo Mac Crear un espectacular login de estilo mac
Todo ello realizado con jQuery, puedes ver una Demo o Descargar los archivos fuente.

Artículos relacionados

]]> http://blog.unique3w.com/crear-un-espectacular-login-de-estilo-mac/feed 2 Tres tutoriales para diseñar layouts con Photoshop qué hacen un uso intensivo del color azulhttp://blog.unique3w.com/tres-tutoriales-para-disenar-layouts-con-photoshop-que-hacen-un-uso-intensivo-del-color-azul http://blog.unique3w.com/tres-tutoriales-para-disenar-layouts-con-photoshop-que-hacen-un-uso-intensivo-del-color-azul#comments Wed, 27 Jan 2010 14:22:47 +0000 admin http://blog.unique3w.com/?p=1535 Esta es una minirecopilación de tutoriales para crear interfaces con Photoshop qué hacen un uso especial del color azul.

tutorial diseño layout azul 1 Tres tutoriales para diseñar layouts con Photoshop qué hacen un uso intensivo del color azul
tutorial diseño layout azul 2 Tres tutoriales para diseñar layouts con Photoshop qué hacen un uso intensivo del color azul
tutorial diseño layout azul 3 Tres tutoriales para diseñar layouts con Photoshop qué hacen un uso intensivo del color azul

Artículos relacionados

]]> http://blog.unique3w.com/tres-tutoriales-para-disenar-layouts-con-photoshop-que-hacen-un-uso-intensivo-del-color-azul/feed 1 19 combinaciones de fuentes qué crean un alto nivel estéticohttp://blog.unique3w.com/19-combinaciones-de-fuentes-que-crean-un-alto-nivel-estetico http://blog.unique3w.com/19-combinaciones-de-fuentes-que-crean-un-alto-nivel-estetico#comments Mon, 25 Jan 2010 11:39:34 +0000 admin http://blog.unique3w.com/?p=1519 En el documento PDF qué adjunto, Douglas Bonneville realiza 19 combinaciones con 19 fuentes intercambiando estilos h1 y h2 para conseguir estéticos conjuntos de títulos – parágrafos. Una buena idea a la hora de buscar inspiración al escojer nuestras tipografías.

Combinaciones de fuentes 19 combinaciones de fuentes qué crean un alto nivel estético
Combinaciones de fuentes (454)

Artículos relacionados

]]> http://blog.unique3w.com/19-combinaciones-de-fuentes-que-crean-un-alto-nivel-estetico/feed 1 Guía de soporte CSS para clientes de emailhttp://blog.unique3w.com/guia-de-soporte-css-para-clientes-de-email http://blog.unique3w.com/guia-de-soporte-css-para-clientes-de-email#comments Sun, 06 Dec 2009 07:13:12 +0000 admin http://blog.unique3w.com/?p=1230 Guia de soporte CSS en clientes de email Guía de soporte CSS para clientes de email

Si necesitas crear plantillas html para email te vendrá bien esta guía creada por campaignmonitor con la que de un simple vistazo podrás conocer que estilos y elementos CSS están permitidos por cada uno de los clientes de email del mercado, tanto para sus versiones de escritorio como online.

Diseñar plantillas de este tipo que corran a través (o en la gran mayoría) de clientes es algo que puede consumirte mucho tiempo ya que las diferencias entre clientes llegan a ser realmente considerables.

Soporte CSS para clientes de email (284)

Artículos relacionados

]]> http://blog.unique3w.com/guia-de-soporte-css-para-clientes-de-email/feed 0 Kit de elementos de diseño ‘todo en un uno’http://blog.unique3w.com/kit-de-elementos-de-diseno-todo-en-un-uno http://blog.unique3w.com/kit-de-elementos-de-diseno-todo-en-un-uno#comments Sat, 05 Dec 2009 09:10:46 +0000 admin http://blog.unique3w.com/?p=1211 En el link de descarga encontrareis una colección de elementos de diseño variados en formato Photoshop listos para ser utilizados en el desarrollo de interfaces de usuario.

kit all in one de elementos web Kit de elementos de diseño todo en un uno
Set de elementos de diseño 'todo en uno' (148)

Artículos relacionados

]]> http://blog.unique3w.com/kit-de-elementos-de-diseno-todo-en-un-uno/feed 0 Íconos sociales preparados para ser modificadoshttp://blog.unique3w.com/iconos-sociales-preparados-para-ser-modificados http://blog.unique3w.com/iconos-sociales-preparados-para-ser-modificados#comments Sat, 05 Dec 2009 09:10:30 +0000 admin http://blog.unique3w.com/?p=1214 Este set de íconos sociales es ideal para poder ser modificado y adaptado a diversos botones y estilos, contienen para ello la base de la imagen característica de cada servicio social.

iconos sociales Íconos sociales preparados para ser modificados
Iconos sociales listos para ser modificados (128)

Artículos relacionados

]]> http://blog.unique3w.com/iconos-sociales-preparados-para-ser-modificados/feed 0 Plantilla PSD con elementos de diseño para crear interfaces de usuariohttp://blog.unique3w.com/plantilla-psd-con-elementos-de-diseno-para-crear-interfaces-de-usuario http://blog.unique3w.com/plantilla-psd-con-elementos-de-diseno-para-crear-interfaces-de-usuario#comments Sat, 31 Oct 2009 10:57:40 +0000 admin http://blog.unique3w.com/?p=1098 Artdesigner ha realizado un bonito set en formato Photoshop con elementos de diseño para la creación de interfaces de diseño. La plantilla contiene más de 100 elementos y todos completamente editables.

plantilla con elementos de diseño Plantilla PSD con elementos de diseño para crear interfaces de usuario

Artículos relacionados

]]> http://blog.unique3w.com/plantilla-psd-con-elementos-de-diseno-para-crear-interfaces-de-usuario/feed 0 Traducción al castellano del plugin WPTouch para versiones móviles de wordpresshttp://blog.unique3w.com/traduccion-al-castellano-del-plugin-wptouch-para-versiones-moviles-de-wordpress http://blog.unique3w.com/traduccion-al-castellano-del-plugin-wptouch-para-versiones-moviles-de-wordpress#comments Sun, 27 Sep 2009 15:09:44 +0000 admin http://blog.unique3w.com/?p=981 WPtouch Traducción al castellano del plugin WPTouch para versiones móviles de wordpress

Recientemente he instalado el plugin WPTouch para optimizar la navegación desde dispositivos móviles y trás unos ligeros retoques de personalización he decidido traducirlo al castellano para completar la instalación.

El plugin no dispone de un sistema de traducciones, tal vez en sucesivas versiones lo implementen pero en tanto la única manera es editar los archivos de los temas ‘a la brava’.

traduccion WPTouch archivos Traducción al castellano del plugin WPTouch para versiones móviles de wordpress

En la descarga encontrarás la carpeta wptouch/themes/default con los archivos traducidos, tan solo tienes que sobreescribir los que tienes en tu servidor. Con esto tendrás todo el sistema traducido a excepción del texto del interruptor de tema móvil / tema normal que viene en el footer.

wpTouch interruptor Traducción al castellano del plugin WPTouch para versiones móviles de wordpress

Para traducir este último punto necesitarás sobreescribir el archivo core-functions.php que también adjunto en la descarga situado en wptouch/themes/core.

traduccion WPTouch archivos 2 Traducción al castellano del plugin WPTouch para versiones móviles de wordpress

En una sucesiva revisión terminaré de traducir los textos del core, por el momento esto deja el interface de navegación completamente funcional. Aquí puedes ver unas muestras tomadas desde mi HTC Magic con Android:

wpTouch inicio2 Traducción al castellano del plugin WPTouch para versiones móviles de wordpress
wpTouch menu1 Traducción al castellano del plugin WPTouch para versiones móviles de wordpress
wpTouch articulo2 Traducción al castellano del plugin WPTouch para versiones móviles de wordpress
wpTouch articulo 21 Traducción al castellano del plugin WPTouch para versiones móviles de wordpress

wpTouch comentario Traducción al castellano del plugin WPTouch para versiones móviles de wordpress
wpTouch comentario sociales Traducción al castellano del plugin WPTouch para versiones móviles de wordpress
Traducción al castellano del plugin WPTouch (184)

Artículos relacionados

]]> http://blog.unique3w.com/traduccion-al-castellano-del-plugin-wptouch-para-versiones-moviles-de-wordpress/feed 3