Listado de las mejores fuentes echas a mano para diseños.Parte II
Posted on August 22, 2009 by DamianNo Comments
Siguiendo el hilo del post anterior aca les dejo el resto del listado de fuentes tipográficas echas a mano.
Archive for the Recursos Category
Listado de las mejores fuentes echas a mano para diseños.Parte I
Posted on August 20, 2009 by Damian1 Comment
De la mano de Smashing magazine llega este listado impresionante de fuentes tipográficas de estilo “echas a mano”. Algunas de ellas echas a mano realmente y escaneadas luego a la computadora. Son ideales para inspirarse o para el diseño creativo usando un estilo diferente al que estamos acostumbrados.
jqTransform : Aplica estilo a tus formularios de una forma sencilla
Posted on August 15, 2009 by Damian1 Comment
Con jqTransform nunca fue tan facil modificar el aspecto de un formulario dandole un aire elegante en cualquier navegador.
La forma de implementarlos es como siempre super sencilla:
1- Añadir el plugin a la cabezera de tu web
<script src="js/jquery.js" type="text/javascript"></script> <script src="js/jquery.jqtransform.min.js" type="text/javascript"></script>
2- Escribir un formulario y añadirle la clase correspondiente
<form class="jqtransform">
<label for="name">Name: </label>
<input name="name" type="text" />
<input type="submit" value="send" />
</form>
<label for="name">Name: </label>
<input name="name" type="text" />
<input type="submit" value="send" />
</form>
3- Activar el plugin
<script type="text/javascript">
$(function() {
//Todos los formularios con clase jqtransform
$("form.jqtransform").jqTransform();
});
</script>
$(function() {
//Todos los formularios con clase jqtransform
$("form.jqtransform").jqTransform();
});
</script>
Como ven , super sencillo de usar. Para descargarlo visiten la página del autor.
Para ver un ejemplo online pueden ver el usado en este tutorial
Tags: jquery.plugin
Hermosas fuentes tipográficas gratuitas para tus diseños
Posted on August 10, 2009 by DamianNo Comments
Se que últimamente los tengo abandonados pero es que ando muuuuuy escaso de tiempo. Espero esta semana y la que viene estar un poco más tranquilo para poder terminar un par de tutoriales que tengo en mente.
Hoy lo que les traigo es una pequeña colección de fuentes tipográficas totalmente gratuitas que podrán usar en sus diseños. Todos sabemos que la cantidad de fuentes que se encuentran es enorme y muchas veces es una pérdida de tiempo buscar las que tienen una calidad más que aceptable. Por eso voy a ir reuniendo las que crea a mi criterio que son fuentes que vale la pena tener o al menos echar un vistazo.
En esta selección podemos encontrar fuentes como Calluna, Andika Basic, Mentone, Sovereign Regular, Medio y Tiresias Infopoint entre otras. Igualmente hay que leer cuidadosamente las lisencias ya que pueden cambiar de un tiempo a otro
Crear gráficos dinámicos con JQuery Visualize
Posted on July 26, 2009 by Damian1 Comment
Hoy dando una vuelta por la web de Andrés Nieto me encontre con este peculiar plugin llamado JQuery Visualize que se encarga de formar gráficas a partir de los datos de una tabla. Entre sus posibilidades podemos encontrar desde barras normales , areas, gráficas en queso , etc y lo mejor de todo es que si el visitante no dispone de Javascript podra ver la tabla en vez de la gráfica.
La forma en que funciona es muy sencilla. Dada una tabla cualquiera como :
<table>
<caption>2009 Individual Sales by Category</caption>
<thead>
<tr>
<td></td>
<th>food</th>
<th>auto</th>
<th>household</th>
<th>furniture</th>
<th>kitchen</th>
<th>bath</th>
</tr>
</thead>
<tbody>
<tr>
<th>Mary</th>
<td>150</td>
<td>160</td>
<td>40</td>
<td>120</td>
<td>30</td>
<td>70</td>
</tr>
<tr>
<th>Tom</th>
<td>3</td>
<td>40</td>
<td>30</td>
<td>45</td>
<td>35</td>
<td>49</td>
</tr>
...Las columnas repetidas las saco por brevedad
</tbody>
</table>
<caption>2009 Individual Sales by Category</caption>
<thead>
<tr>
<td></td>
<th>food</th>
<th>auto</th>
<th>household</th>
<th>furniture</th>
<th>kitchen</th>
<th>bath</th>
</tr>
</thead>
<tbody>
<tr>
<th>Mary</th>
<td>150</td>
<td>160</td>
<td>40</td>
<td>120</td>
<td>30</td>
<td>70</td>
</tr>
<tr>
<th>Tom</th>
<td>3</td>
<td>40</td>
<td>30</td>
<td>45</td>
<td>35</td>
<td>49</td>
</tr>
...Las columnas repetidas las saco por brevedad
</tbody>
</table>
Tan solo hay que llamar al plugin de la siguiente forma y el plugin se va a encargar de generar la gráfica a partir de los datos introducidos.
$('table').visualize({options});
Además podemos definir las siguiente opciones:
- type: string. Valors aceptados ‘bar’, ‘area’, ‘pie’, ‘line’. Default: ‘bar’.
- width: number. Ancho de la gráfica. Por defecto el tamaño de la tabla.
- height: number. Altura de la gráfica. Por defecto el tamaño de la tabla.
- appendTitle: boolean. Añadir título a la gráfica. Default: true.
- title: string. Título de la gráfica. Por defecto se usa el
de la tabla. - appendKey: boolean. Añadir color principal. Default: true.
- colors: array. Array de colores usados. Default:['#be1e2d','#666699','#92d5ea','#ee8310','#8d10ee','#5a3b16','#26a4ed','#f45a90','#e9e744']
- textColors: array. Array de colores para el texto. Default: [].
- parseDirection: string. Dirección de parseo de datos de la tabla Acepta ‘x’ e ‘y’. Default: ‘x’.
- pieMargin: number.Espacio alrededor de la gráfica tipo “Pie”. Default: 20.
- pieLabelPos: string. Posición del texto de etiqueta en la gráfica tipo “Pie”. Acepta ‘inside’ y ‘outside’. Default: ‘inside’.
- lineWeight: number. Tamaño de la línea de la gráfica. Default: 4.
- barGroupMargin: number. Espacio entre barras. Default: 10.
- barMargin: number.Margenes de la gráfica. Default: 1
Pueden ver una gráfica dinámica desde este enlace o descargar el plugin directamente.
Un saludo a todos.
Tags: graficas, jquery.plugin
30 paquetes de íconos sobre comercio electrónico para descargar
Posted on July 9, 2009 by DamianNo Comments
PuntoGeek es una de mis webs favoritas en cuanto a recursos se trata. Sobre todo en el tema de vectores e íconos , siempre se las ingenian para encontrar y publicar lo que ando buscando.
En el caso de hoy se trata de una compilación realizada por SixRevisions con más de 30 paquetes diferentes con íconos para el comercio electrónico o e-commerce. Desde Paypal , carritos, tarjetas de creditos hasta descuentos. Todo lo que necesitemos para una tienda online.
Pueden ver y descargar los paquetes desde su web.
Con tu lector preferido.
Via Email.
Por Twitter.