24 Jul

Cambiar el estilo visual de los checkbox con CSS3

El checkbox es uno de esos elementos a los que uno no suele prestarle demasiada atención. Esto se debe a que su función es tan simple que no nos detenemos a analizar como mejorar su aspecto estético. Gracias a CSS3 podemos realizar cambios visuales de manera simple y rápida.

CSS3 Checkbox Styles es un excelente ejemplo de como mejorar y modificar el aspecto visual de un checkbox de forma simple y utilizando solamente hojas de estilo para lograrlo. El resultado, simplemente excelente:


Este fantástico recurso es compatible con la mayoría de los navegadores modernos, salvo Internet Explorer 8. Una lastima.

El funcionamiento de este recurso es muy interesante. Lo que el autor hizo fue ocultar los checkbox originales por lo limitado que resulta la modificación del aspecto visual, en su lugar muestra estos elementos mucho más atractivos y divertidos, los mismos al cambiar su estado hacen lo mismo con el checkbox original que se encuentra oculto. Muy simple pero no por eso menos efectivo

Web: CSS3 Checkbox Styles

Share this
22 Jul

Microblogging en WordPress: Vintage Camera theme

El microblogging se instala cada vez mas dentro del mundo de Internet quizás influído por el hecho de que todos vivimos a mil e inconscientemente trasladamos eso a todo medio.

Sin embargo, mas allá de esto, el formato del microblogging abre puertas a otro tipo de contenido, mas directo y destinado a otro tipo de público.

Actualmente una de las herramientas mas populares dentro de este ámbito es sin dudas Tumblr. Pero para los amantes de WordPress nada es imposible y por ello es bueno saber que navegando por Internet podemos encontrar infinidad de temas preparados para este formato pero aplicables a este CMS.

Vintage Camera es una creación de Caroline Themes ideal para quienes desean adoptar el formato del microblogging en WordPress, en este caso basándonos en la temática de la fotografía (aunque claro, con algo de conocimiento podríamos personalizarlo a cualquiera).

De una columna y estilo vintage, cuenta con seis modelos diferentes que cambiarán tanto paleta de colores como imagen principal, variando entre seis modelos clásicos de cámaras fotográficas.

Por último, cuenta con menú, tres áreas para widgets en la parte inferior y tipografías adecuadas para el entorno del mismo.

Vintage Camera por Caroline Themes – Descargar

Share this
20 Jul

Google+: crea una portada personalizada para tu perfil en Google+

Google+ cada día se está pareciendo más a Facebook, la estética de pagina tiene los aires del nuevo Timeline y eso es inevitable. Ahora, sino te importa la copia y simplemente quieres personalizar tu perfil en Google+ pero crees que no tienes las herramientas, Cover Photo Editor será la mejor solución.

Se trata de un servicio web que, de forma totalmente gratuita y sin requerimientos de suscripción, nos permite crear una portada personalizada con las dimensiones exactas que la gente Google nos pide, de hecho ya tienen también su versión la el timeline de Facebook.

Podemos elegir entre gran cantidad de fondos ya hechos y que sólo requieren descargarlos, pero también podemos elegir una foto o imagen desde nuestro ordenador y editarlo con elementos adiciones como textos o figuras.

Una vez que terminamos la edición simplemente guardamos el resultado en nuestro ordenador, nos dirigimos a nuestro perfil de Google+ y cambiamos las dos fotos. Sencillo y practico, a veces es necesario para quienes quieren efectos y letras pero creen que es necesario Photoshop o cualquier tipo de programa similar.

Visita: CoverPhotoEditor

Share this
18 Jul

Shock 4Way 3D: cambia entre 4 escritorios virtuales con efectos 3D [Windows]

Siempre estamos buscando cómo darle un aspecto diferente a nuestro sistema, desde temas, hasta iconos tenemos gran variedad de opciones. Pero con Shock 4Way 3D (¿por qué siempre nombre tan complicados?) vamos un poco más allá por que no permite crear hasta cuatro escritorios virtuales personalizables y, además, con interfaz 3D a la hora de cambiar entre alguno. Es una aplicación sencilla que sólo requiere de combinaciones de teclas para cambiar entre escritorios.

Una vez instalado Shock 4Way 3D, con combinar “Ctrl + Alt + 1 o 2, 3, 4″ vamos a poder cambiar entre los cuatro espacios que podemos configurar con diferente aspecto.

En la sección de configuración tenemos la posibilidad de elegir si queremos cambiar la personalización de teclas para cambiar entre teclado. También es posible cambiar la transición, es decir, lo efectos que hará el programa al cambiar de escritorio.

Es una aplicación bastante complete, de hecho es ligera y no consume demasiada memoria del sistema. La personalización podría ser su fuerte pero está un limitada, sin embargo el efecto de transición es lo que más llama la atención. Es compatible con Windows XP/Vista/7.
Descarga: Shock 4Way 3D

Share this
14 Jul

Fotografías pegadas con cinta adhesiva en HTML/CSS

En la búsqueda de opciones originales para presentar galerías fotográficas, se pueden encontrar diferentes métodos técnicos o se puede optar por opciones vistosas que solo cumplan con una función decorativa.

Al utilizar este tipo de elementos, debemos tener en cuenta que poseen una estética propia y generan un entorno en consecuencia, es por ello que si necesitan realizar algún proyecto extremadamente sobrio, puede que no sea la mejor opción.

Descargar Taped Image Corners | PixelsDaily

En cambio, si lo que desean es simplemente destacar una galería de forma fácil y rápida, este efecto de cintas puede resultarles muy útil. Como podrán ver cuando descarguen el recurso, el funcionamiento es muy simple y no posee mayores complicaciones para su utilización. Hay siete opciones con diferentes posiciones de cinta adhesiva en sus esquinas, todo elaborado en html y css.

Share this
12 Jul

5 extensiones utiles de Facebook para Chrome

Si eres adicto a facebook y te gusta estar pendiente de todas las notificaciones, noticias, fotos etc, estas extensiones te serán muy útiles, siempre y cuando tu navegador favorito sea Chrome.

Notificaciones en Facebook

Si estas siempre cambiando de pestaña para ver si tienes nuevas notificaciones o mensajes, esta extensión te sera de mucha ayuda.
Facebook Notificacions es una extension de Chrome que se conecta a tu facebook y te mantiene actualizado sobre lo que esta pasando en tu cuenta de facebook, incluso cuando estas en otras pestañas en el navegador. Puedes ver los me gusta y comentarios en tus post, eventos, solicitudes de amistad.

La extensión integra un pequeño boton en Chrome, la cual te mantiene constantemente informado de tu cuenta de Facebook. Actualiza tu estado de facebook en una pequeña ventana emergente, donde puedes ver tus notificaciones.

FB Photo Zoom

Ahora que existen muchos grupos donde se suben imágenes graciosas o de alguna organización, es muy molesto tener que echar un vistazo teniendo que abrir el feo visor de imágenes de facebook.

FB Foto Zoom es una sencilla extensión, que te permite ver las imágenes de los ambumes en grande, con solo poner el cursor encima de ella.

Facebook Ads Hider

Los anuncios de facebook son molestos. Solo desordenan la pagina y se meten en todos lados. Facebook Ads Hider es una extensión para Chrome que oculta los anuncios y hace ver a facebook más limpio. Solo instala la extensión y estas listo.

Facebook Chat Smiley

Si te gusta enviar caritas en tus conversaciones de chat de facebook, pero no te sabes la combinación de teclas para cada una de ellas, Facebook Chat Smiley te ayuda mucho en eso. La extensión agrega una barra de caritas arriba en cada ventana de conversación que tengas de facebook, así solo das click sobre la carita y listo.

fPrivacy

Muchas aplicaciones piden permisos a tu cuenta de facebook para poder ser utilizadas. Muchos de estos permisos pueden traer problemas, es por eso que rechazar algunos permisos son necesarios.
fPrivacity te deja seleccionar que privilegios quieres proporcionarle a una aplicación en particular. Después de entrar alguna pagina donde te pida privilegios, aparecerá una barra en la parte superior de la pagina para mencionarte cada uno de los permisos requeridos, con una casilla de verificacion. Solo debes desmarcar el permiso que no deseas conceder y listo.

Share this
10 Jul

Set gratuito de micro iconos

Me encantan los iconos, me parecen un recurso fundamental para la mejora de la experiencia del usuario, son pequeñas guías gráficas que orientan a las personas a utilizar mejor las herramientas. Unos iconos que me fascinaron son los que encontré en 365psd.

Este set esta compuesto por más de 100 micro iconos, su tamaño es de apenas unos 16×16 pixeles. Estas dimensiones lo transforman en un recurso perfecto para utilizar en espacios reducidos, por ejemplo en menú de navegación o botonera.

Muestra de los algunos micro iconos:

Estos iconos pertenecen a un trabajo del diseñador Matt Gentile. Son gratuitos y no presentan ninguna restricción para su utilización en cualquier sitio web.

Exactamente en la descarga van a encontrar 110 iconos, los mismos se encuentran en formato PSD listos para ser editados con Photoshop.

Web: Micro icon Set

Share this
08 Jul

Sets de iconos sociales Pinterest

Cada nueva red social que surge y se instala entre nosotros, provoca que nuevos sets de íconos surjan para cubrir todas las opciones sin necesitar hacer una mezcla entre varios paquetes.

Es así como varios sets de íconos de la recientemente lanzada Pinterest han visto la luz y aprovecho que encontré algunos paquetes para compartirlos con ustedes.

Descargar Relay Social Icon Set | DesignDeck

El primer set es genérico, contiene iconos de las redes sociales principales incluído el de Pinterest. Los otros dos son variaciones del botón hacia esta red social, con diferentes formatos y tamaños. En uno de ellos se incluye también la versión HTML funcional.

Descargar Pinterest Button & Icon Set HTML | DesignDeck

Descargar Pinterest Buttons | DesignDeck

Todos se encuentran en formato .psd para utilizar sobre cualquier fondo o textura, editar su tamaño y forma. Un buen recurso para tener a mano y enlazar sus sitios al perfil en la nueva red social.

Share this
06 Jul

Elementos UI gratuitos en negro

El desarrollo de una aplicación no es para nada sencilla, algo de lo cual pueden dar fe quienes se dedican a ello. Sin embargo, es una rama que no deja de ser apasionante y por eso cada día mas profesionales deciden arriesgarse y comenzar a crear la propia. Como con toda herramienta o aplicación, una de las etapas principales es la del diseño de la misma.

Para esto es que en el caso de no ser especialistas en lo gráfico los miles de recursos que diseñadores increíbles ponen a nuestra disposición de forma gratuita son de ayuda.

En la imagen vemos un gran set de elementos UI negros y en gris oscuro que incluyen desde botones destinados a diferentes redes sociales hasta barras de progreso, sliders, etiquetas y campos variados.

El mismo se encuentra en formato PSD para que podamos editar y personalizar a gusto sin mayores problemas utilizando Photoshop.

Free Dark UI Kit en Webbyarts – Descargar

Share this
04 Jul

Reemplazar los iconos sociales de: Facebook, Twitter, y Google +

Koottam Social es un plugin jQuery para reemplazar los iconos de las distintas redes sociales, de esta manera vamos a poder homologar totalmente el estilo y formato de los distintos widgets, algo que en la actualidad es un gran problema a la hora de diseñar.

Koottam utiliza el API de los distintos servicios para mostrar las cantidades, de esta manera nos garantizamos una correcta correspondencia entre lo que se muestra y la actividad relacionada con la red social. Ademas el plugin permite personalizar el aspecto de los botones, sin ir más lejos al momento de descargarlo el mismo cuenta con 7 temas distintos para seleccionar, ampliando considerablemente el abanico que nos proveen las redes sociales que en general cuentan con no más de 2 o 3 alternativas.

Los botones se ven de la siguiente manera:

No olviden visitar la demostración online

Ejemplo de uso:

HTML:

< a class="fb" href="http://facebook.com/jobysblog">Facebook< /a>

Inicialización del plugin:


< script type="text/javascript">//

El plugin funciona perfectamente en los navegadores más modernos, el mismo se encuentra testeado en IE, Firefox, Chrome, Safari y Opera.

Koottam se encuentra liberado bajo licencia MIT, por lo que no vamos a tener problemas para incluirlo en nuestro sitios web.

Web: Koottam Social jQuery Plugin ~ Visto en: WebAppers

Share this
Contáctenos
(0351) 157 - 626959
BLOG

© 2006 Miracle Design. Todos los derechos reservados