miércoles, 11 de abril de 2012

Cristalab

Cristalab

Cristalab


Introducción a Python

Posted: 11 Apr 2012 02:30 AM PDT

En este pequeño tutorial vamos a ver inicialmente qué es Python, cómo descargarlo, porqué utilizarlo y luego daremos paso a crear una aplicación que calcule el área y el perímetro de un triángulo. Este archivo se guardará con extensión .py. Espero que les guste la información.

¿Qué es python?


Es un lenguaje de programación creado por Guido van Rossum con el cual podremos crear tanto aplicaciones para escritorio como para la web utilizando el framework de Django y todo con muy pocas líneas de código lo cual facilita y agiliza nuestro trabajo.



¿De dónde proviene el nombre de Python?


Pues al principio pensaba que hacía honor a la serpiente pitón debido lo poderosa que es pero investigando un poco más me di cuenta que:

"El nombre del lenguaje proviene de la afición de su creador original, Guido van Rossum, por los humoristas británicos Monty Python."

Descargar Python


No hay cosa más fácil y accesible que descargar python lo puedes hacer directamente desde su página oficial: http://www.python.org/getit/

Puedes empezar usando la versión 2.7 que es bastante buena y completa. Al finalizar la descarga podrás ejecutar en típico proceso de instalación (siguiente, siguiente (elije el lugar donde lo vas a guardar, por defecto viene con c:\python27\), terminar) fácil ¿verdad? al final te deben quedar instalados los siguientes archivos:

Idle (python GUI): es el editor de código python que viene junto con la instalación. Pero si no te gusta puedes descargar otro por aparte como por ej: sublime text 2 o notepad++.
  • Module docs: módulo de documentos
  • Python(command line): consola o línea de comandos python
  • Python manuals: cuando tengas una duda puedes consultar este manual (esta en ingles)
  • Uninstall python:desinstalador


¿Por qué python?

  • la sintaxis es bastante clara y sencilla de hecho tiene un gran parecido con el lenguaje natural! lo cual te ayuda a comprender mejor el código y hacer potentes aplicaciones de manera rápida.
  • puedes ahorrarte muchas líneas de código que normalmente harías con php, c++ o java!!
  • es multiparadigma lo cual quiere decir que el desarrollador puede usar más de un método de programación, ej: Orientación a Objetos, Programación Funcional o Programación imperativa.
  • es el lenguaje de programación con más apoyo y aceptación en el mundo!
  • no necesita compilación, sólo basta con tener un editor de texto como el notepad, guardarlo con extensión .py y listo, en mac ya viene instalado y en Windows como acabas de ver su instalación es bastante sencilla.
  • YO lo digo!! :lol:


Nuestra primera aplicación en Python


Lo que vamos a hacer es crear una aplicación que calcule el área y el perímetro de un triángulo:



Solo con este código:

Código :

print "area de un triangulo"  base = float(raw_input("medida de la base: ")) altura = float(raw_input("medida de altura: ")) lados = float(raw_input("medida de los lados: "))  area = base * altura / 2.0 perímetro = lados* 2 + base if lados < altura: print "la medida de los lados debe ser mayor a la altura" else: print "al area es: " , area , "el perímetro es: ", perímetro 


Es bastante fácil, para calcular el área se tiene que realizar la siguiente operación base*altura/2 y el perímetro es ladoA + ladoB + base, la medida debe ser igual en ambos lados (AB) por lo tanto es multiplicada por dos y sumada a la base. ¡Pero no nos olvidemos del código! Que es lo más importante, vamos a explicar cada una de sus partes:


Print


Tenemos a "print" o imprimir con el cual podemos mostrar texto en la consola. Hace una función muy parecida a la de "trace" en actionscript, "document.write" en javascript o "System.out.println" en java. En él podemos escribir textos, números o almacenar datos de variables.

Variables


En las variables podemos guardar cualquier tipo de datos tales como: operaciones, texto, números, datos booleanos… sin embargo estas no se mostraran en pantalla hasta ser llamadas por el nombre asignado. Las variables se declaran así:



Float()


Es una función de python bastante fácil de entender lo que hace es convertir enteros en números flotantes básicamente lo contrario a la función "int".

Raw_input()


Raw_input espera a que escribamos algo sobre él. En nuestro caso utilizamos dos, una que espere la medida de la base y otra, la medida de la altura. Ésta se encuentra dentro de float lo cual significa que no podemos introducir texto, si lo hacemos la consola nos lanzará error.

If, else


Con if podemos hacer condiciones, Si la condición se cumple (en nuestro caso lados < altura) entonces se imprimirá en pantalla el texto: "la medida de los lados debe ser mayor a la altura",
Pero si no se cumple else que significa "de otro modo" o "de otro caso" pasará a ejecutarse. (En nuestro caso lo que hará es calcular el área y perímetro del triangulo).

Operadores




Espero que esta información te haya servido!
Aquí dejo dos enlaces que podrían interesarte:
http://mejorando.la/videos/aprendiendo-python-en-20-minutos/
http://www.maestrosdelweb.com/editorial/guia-python/

No olvides dejar tus comentarios

Enviar comentario

Introducción a Git y Github

Posted: 11 Apr 2012 01:51 AM PDT

Hola a todos, después de mucho tiempo vuelvo a publicar unos videotutoriales. Pero esta vez no serán de maquetación, quería mostrarles para los que todavía no conocen o quieren comenzar a hacer sus proyectos con un sistema de control de versiones cómo usar Git y Github desde cero con los conceptos básicos de cada uno y cómo se complementan para un mejor desarrollo de nuestros proyectos.

Aquí les dejo los dos primeros. Aún falta, en teoría, un video más donde muestro lo que es Branching y un buen workflow con ssh. Trataré de ponerlo en uno sólo para que no sea algo tan grande. Espero les guste, no puedo esperar a saber sus comentarios al respecto :)

Libro recomendado: Getting Good with Git de Andrew Burgess





Enviar comentario

Efecto de desintegración con CC Pixel Polly en After Effects

Posted: 11 Apr 2012 01:46 AM PDT

En este videotutorial de After Effects descubriremos otro de sus múltiples efectos, el CC Pixel Polly, comprobando que con un trabajo de ajuste y asignación de keyframes mínimo podremos obtener curiosos efectos de desintegración de partículas sin el uso de plugins externos, al mismo tiempo que jugamos con las opciones 3D, las cámaras y ajustamos la animación con el editor gráfico.



Saludos.

Enviar comentario

Video de YouTube como fondo de tu Web con jquery.tubular.js

Posted: 21 Mar 2012 04:33 AM PDT

En esta ocasión quiero compartir un plugin muy interesante de jQuery que encontré navegando por la Web: Tubular Plugin. Éste coloca un video de YouTube cualquiera que elijas como fondo de tu página Web.

Tubular Plugin a su vez nos da la opción de colocar controles para el video, para poder detenerlo, pausarlo o silenciar el audio.

Primero descargamos el plugin Tubular. Dentro de nuestras etiquetas <head> </head>, colocamos o llamamos los archivos que están dentro de la carpeta js del archivo .RAR que bajamos. Entonces llamamos los archivos así:

Código :

<head>       <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>    <script src="js/swfobject.js" type="text/javascript"></script>    <script src="js/jquery.tubular.js" type="text/javascript"></script>    <script src="js/mission-control.js" type="text/javascript"></script> </head>


Creamos las siguientes capas o DIVS dentro de nuestras etiuqetas <body> </body> de la siguiente manera:

Código :

<body>  <div id="wrapper">      <p id="video-controls"><span class="azulita">Controles:</span> <a class="videoPaused" href="" id="videoPause">Pausar / Reproducir</a> | <a href="" id="videoMute">Sonar / Silenciar</a> | <a href="" id="videoStop">Detener Video</a></p> <div id="contenido">   <p>Bienvenidos a esta demo !</p>   <p>El Plugin <a href="http://www.seanmccambridge.com/tubular/" target="_blank">Tubular</a> de jQuery me hace pensar decir que: jQuery es impresionante y no tiene limites.</p>   <p>VIDEO: Go Let it Out - Oasis</p> </div>       </div>  </body>



Creamos nuestra Hoja de estilos CSS, para los nombres o id de las capas o divs correspondientes:

Código :

<style type="text/css">         #video-controls {    color: #FFF;    background-color: #F06;    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;    text-align: center;    position: absolute;    padding-top: 5px;    padding-right: 20px;    padding-bottom: 5px;    padding-left: 20px;    left: 19px;    top: 40px; }  #video-controls a:link {color: #FFF; text-decoration:none;} #video-controls a:visited {color: #FFF; text-decoration:none;} #video-controls a:hover {color: #FFF; text-decoration:none;} #video-controls a:active {color: #FFF; text-decoration:none;} .azulita {    color: #039;    font-weight: bold; } body {    margin-left: 0px;    margin-top: 0px;    margin-right: 0px;    margin-bottom: 0px;    background-color: #000; } #contenido {    font-family: Tahoma, Geneva, sans-serif;    font-size: 16px;    color: #FFF;    position: absolute;    left: 23px;    top: 118px;    width: 622px;    background-image: url(img/bg-texto.png);    background-repeat: repeat;    padding: 15px; } a:link {    color: #F06;    text-decoration: none; } a:visited {    text-decoration: none;    color: #F06; } a:hover {    text-decoration: underline;    color: #F06; } a:active {    text-decoration: none;    color: #F06; } </style> 



Abrimos nuestro archivo mission-control.js que vino dentro del archivo RAR que descargamos de la página del Plugin, y nos fijamos en la 2da línea donde dice:

Código :

$().ready(function() {    $('body').tubular('[b]AzNZaIYce-U[/b]','wrapper');


AzNZaIYce-U : es el ID del video de youtube que vamos a reproducir.

Por ejemplo:

Si tenemos el siguiente video:

:

http://www.youtube.com/watch?v=AzNZaIYce-U


la ID sería lo que esta después de v= : AzNZaIYce-U o lo que está en negrita. El video por defecto carga sin sonido, el cual lo podemos activar con el botón Sonar/Silenciar.

Y listo! con eso ya hemos finalizado y todo queda listo para usar!

Acá les dejo un demo:

DEMO

Espero les haya gustado.

Enviar comentario

Diseñar iconos para Web con Pixel Art en Photoshop

Posted: 20 Mar 2012 07:15 AM PDT

En este videotutorial de nuestra serie de diseño Web, diseñaremos estos útiles iconos en miniatura, que nos ayudarán a mejorar la interfase de nuestra Web.

Crearemos la base de nuestro icono utilizando la herramienta pincel para colocar cada píxel en su posición, tal como haríamos con un diseño Pixel Art, además de jugar con los colores para recrear sombras y luces y trabajar en capas para añadir nuevos elementos, que nos permitirán crear bibliotecas de forma rápida.



Saludos.

Enviar comentario

Crea el Rigging de una mano en 3D Maya

Posted: 20 Mar 2012 06:56 AM PDT

En este videotutorial de 3D Maya vamos a crear un sistema de huesos para terminar la zona del brazo, recreando la mano y los dedos, para controlar todo posteriormente utilizando las propiedades de los canales y los atributos, a través de conexiones y la herramienta Set Driven.

Generaremos el bloque de la mano con el Joint tool, asignando las jerarquías y añadiendo atributos adicionales, crearemos conexiones entre los nuevos canales y la rotación de las falanges para controlarlo todo de forma sencilla y nombraremos los elementos, organizando el conjunto para posicionar más fácilmente los manejadores y los ajustes necesarios.



Saludos.

Enviar comentario

No hay comentarios:

Publicar un comentario