He estado viendo un par de ejemplos en la red con flash 10.1 que involucran sonido, -son bastante buenas-, y mientras tanto nosotros trabajamos en nuestra propia aplicación que involucra un poco de lo mismo, sonido y flash 10.1, sin embargo este no es un post en el que quiera hablar de lo que otros están haciendo sino de lo que nosotros estamos empezando a hacer, hace unas horas un cliente vino a nosotros con la esperanza de automatizar una máquina (voila!!!, automatización uno de mis topicos favoritos) y pues como en todo tema de automatización, se cree que la máquina a automatizar se encarga de suministrar el aire limpio del hambiente ( ja ja risa sarcastica).

Pero en realidad lo que esperamos es algo que haga algo interesante e impresionante. Mi sorpresa fue algo de todo, la máquina en cuestion se trata de una productora de calcetas/medias y vaya que si tiene lo suyo, son máquinas de los años 1924 y otras de años más adelante.

Maquina para la creación de calcetines

La imágen anterior es de una de esas máquinas de 1924 aunque esta es digamos con un “cranck” algo asi como manual con cuerda, pero el dueño casi comparado con Ciro Peraloca

Ciro Peraloca

(jajajaja) En fin, el punto es que ese tipo de máquinas ya están automatizadas con motores de 1/4HP y venga ya, nunca creí que los calcetas de niña de primaria eran hechas por una máquina de más de 80 años.

Pasando de topico, la máquina en sí que hay que automatizar es japonesa y francamente no la he encontrado en la red, pero dos cosas que debo comentar de ella son:

El programa de como hacer el dibujo (rayado) esta grabado en un cassette, (si de esos cassettes de los años 70’s)

Cassette donde se guarda el programa

Increible que esos japos supieran como hacer toda la electronica para una máquina y guardar el programa en un cassette, el modulo que reproduce el cassette es el siguiente:

Reproductor de cassette electronico

Este no es reproductor normal, sino que al introducir la cinta, esta se reproduce a alta velocidad y junta los sonidos convirtiendolos en “1″ o “0″ almacenandolos en una EEPROM, acto seguido el programa ya se encuentra en la máquina y empieza a cargar y hacer lo que deba. Quizás alguno se pregunte, y ¿Cómo suena ese cassette si se intenta reproducir? , pues suena un solo sonido (un alto o “1″ muy agudo) y un espacio en blanco (un bajo o un “0″) de modo que es fácil leer, no obstante algunas partes tienen sonidos muy distintos, lo que me hace pensar que no es tan fácil como ponerlo todo a “0″ y “1″.

Aquí es donde entra la parte en flash 10.1, usando el microfono (que es una de las nuevas capacidades del 10.1) se capturan los datos en forma de bytes, algo conocido como “byteArray”. Y se hace que flash interprete todos esos sonidos en forma de bytes a sonido nuevamente( con las clases de microfono y sonido simultaneamente), de forma que sea flash mismo el que reconstruya la cinta pero con calidad superior, digamos que usa la cinta para hacer un mapeo del sonido y luego la analiza para reconstruir su versión totalmente digital, de manera que podamos tener una cadena laaaarga de bytes que nos permitan descompilar el programa y de allí partir a crear un lenguaje ensamblador de la máquina de los calcetines.

Ahora bien, esto quiere decir que la máquina tendrá un panel en el cual se podrá introducir la imágen que deseamos dibujar en la calceta y flash creara el ensamblador necesario para poder portarlo al cassette y de allí a la producción.

El anterior es uno de mis “approaches” pero existe otro, es posible evitarse la parte del “desensamblado” del codigo del cassette y pasar a una parte totalmente digital, con memoria SD y varios microcontroladores (por supuesto AVR) ya que la máquina cuenta con 156 agujas que deben conectarse en paralelo para poder controlar el color del tejido de la calceta para cada aguja. Mi approach aquí es usar varios atXmega ya que tienen la capacidad de trabajar simulataneamente en varias tareas (algo asi como multi-core y además son de 16 bits de procesamiento -un cerebro humano normal debe trabajar a unos 3 bits jaja-)

Parte frontal del lector de SD multiproposito

Anverso del lector SD de multiproposito

Las siguientes dos imágenes pertenecen al mismo lector de tarjetas SD que puede ser accesado desde un AVR (que por cierto tienen un AVR interno para hacerla de driver, -tomate esa PIC-).

Espero publicar algunas noticias de cual fue el “approach” que utilizamos y cuales han/fueron los resultados.

Saludos!

Bookmark It

Es tiempo de publicar algo que ha estado en las puertas de investigación y prototipo, y ahora que esta concluido queremos compartir algunas imágenes de la interface Wolf Jukebox USB que puede ser utilizada para construir el teclado tanto númerico como compacto o “mini” y en conjunto con la liberación de este modulo aprovecharemos para reactualizar algunos detalles en Wolf Jukebox. Dejo algunas imágenes.

USB PCB

PCB prototipo donde se encuentran las piezas electronicas. El PCB es totalmente USB usando tecnología AVR, (y no, no se comparan con los PICs por que son mucho mejores los AVR asi que estamos proveyendo un driver USB de alta tecnología y con capacidad muy alta de procesamiento).

USB driver soldado.

Driver USB soldado, quiero que noten el tamaño del mismo, nos hemos hecho de tecnología para realizar el “soldering” de este tipo de drivers. Me gusta que las cosas parezcan simples como en todo lo que hacemos, el tamaño del mismo denota que nos esforzamos por ofrecer productos de hardware de alta tecnología.

Cuando se hubo terminado el PCB USB lo primero que se me ocurrio hacer fue algún tipo de “robot” (que también forma parte de otro proyecto). Para conocer los alcances del driver, como siempre el resultado fue positivo y se pudo crear un “robotito” que puede ser controlado utilizando flash (no facilitare más comentarios pero lo presente en la cd de México en el Flash Latin Tour).

M7 Lite prototype .7

No es la gran cosa pero me ha servido para conocer los alcances del driver y son bastante buenos :D, ahora solo estamos trabajando en hacer una versión amigable con Wolf Jukebox y que estaremos publicando a mediados de enero del año entrante. Y claro estare subiendo algunas fotos de eso proximamente.

Saludos!

Bookmark It

Flash catalyst es la herramienta del futuro en cuestión de diseño de interfaces. Como en todo lenguaje decente de programación se necesita un buen diseñador que tenga sentido del diseño para lo que se esta construyendo, por que no es lo mismo diseñar un cartel que dice “Mojitos 2×1 toda la noche” a que diseñe todo el concepto de la aplicación y el look and feel, incluso el diseñador (o aveces junto con el programador) puede(n) sugerir las animaciones o transiciones de movimiento de los elementos.

En html es muuuuy complicado hacer que algo tenga el aspecto que deseas simplemente por que no has practicado lo suficiente con CSS o te la has pasado programando y te cuesta trabajo entender como darle color y estilo a los div o elements en html via CSS.

Es importante no ser TODISTA, el que piensa que puede programar y diseñar al mismo tiempo, se esta limitando asi mismo a un mercado de consumo menos abierto. Y lo mismo sucede con Flash Catalyst y Flash builder 4, Flash Catalyst es para convertir una imágen (o asset) diseñada por (obviamente) el diseñador.

Una vez que el diseñador termina el boceto, lo importa en Flash Catalyst y convierte todos los elementos activos en componentes reales que toman la forma tal y como esta especificada en el boceto. Una prueba de ello es el badge o mini plugin de mtoo a la derecha de esta página, el boceto editado en Fireworks, el diseño creado en Catalyst y finalmente programado en Flash Builder 4.

Flash Catalyst en realidad debería ser parte de Flash Builder 4 o viceversa, no obstante me pregunto por que lo han hecho como programas separados, si Catalyst no exporta a otro programa que no es Flash Builder.

En flash Builder podemos usar todas las librerias y codigo que deseamos ya que Catalyst no permite modificar el codigo sino solo editar el comportamiento de la apicación (o presentación). Sin embargo la última beta de Flash Builder 4 permite conectarse rápidamente con bases de datos usando los wizards integrados y flanquear fácilmente ese bache de comunicación e intercambio de datos entre un servidor y una aplicación. Que será parte de otro tutorial más adelante. Pero adelanto que Flash Builder 4 beta 2 tiene un error en el wizard.

Por último comentare que Flash Builder 4 tiene la capacidad de comunicarse via AMF con php usando el plugin de Zend, pero que me perdonen los chicos de Zend, ya que AMFPHP implementa aun mas seguridad con los roles y es más robusto que la libreria por defecto, en mi comentario personal, debieron haber usado AMFPHP ya que es más fácil de configurar y usar.

Saludos!

Bookmark It

Flash Builder 4, es dos cosas:

• Un SDK (compilador) que interpreta codigo en forma de HTML y lo convierte en código comprensible para el flash player (esto quiere decir en classes y paquetes, ya ahondaremos más en esto)
• Un entorno de desarrollo “IDE” en el cual nos permite programar y crear archivos SWF.

Flash builder se creo para cerrar ese hueco que existe entre Flash y los desarrolladores web con respecto a la forma en que ambos programan, y de hecho los “desarrolladores” web hacen más aplicaciones que interactuan más con datos, por ejemplo formularios, registro de usuarios,compras en linea etc.

Y la única forma de atraer ese mismo ingenio aplicado en HTML puesto en Flash era ofrecerles a todos los desarrolladores con una herramienta que aumentara la experiencia de usuario pero que usara los mismos conocimientos que ya se aplicaban en HTML. Fue cuando nació Flex, que tiempo después ha pasado a convertirse en flash builder.

Cuando programamos en HTML tenemos esta básica estructura de una página:

<html>
<head>
<script language="JavaScript" type="text/javascript">
<![CDATA[
//something of JS here
]]></script>
</head>
</html>

Tenemos los tags de html y head, asi como un lenguaje que nos ayudara a interactuar con los distintos elementos en caso de ser necesario, ese lenguaje es JavaScript. Ahora bien, si nos enfocamos en el codigo en Flash Builder notaremos algunas similitudes:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768" width="514" height="316">
<fx:Script>
<![CDATA[

//something of AS3.0

]]>
</fx:Script>
<fx:Declarations>
<!– Place non-visual elements (e.g., services, value objects) here –>
</fx:Declarations>
</s:Application>

Lo primero que salta a la vista son los tags y que cada uno de los ejemplos tiene una parte de “Script”, en donde se utiliza codigo respectivo al entorno (JS o AS).

En flash builder a diferencia de html, es posible usar tags que no tienen elemento visual y estos se deben escribir dentro del tag “declarations” ya que en HTML todos los tags son elementos visuales, lo que complica usar un tag para que almacene datos o que no aparezca, incluso estos tags pueden mal deformar una página web (creo que la mayoría sabe a lo que me refiero).

Si notan, en la parte que empieza la aplicacion de Flash Builder tiene unas direcciones, bueno esas direcciones se conocen como NameSpaces y son librerias que se importan y que pueden ser usados en forma de tags, por ejemplo:xmlns:mx="library://ns.adobe.com/flex/halo", significa que hay una libreria que se llama “ns.adobe.com/flex/halo” y que podemos accesar a sus elementos mediante “la variable” -mx-, permitiendonos hacer el siguiente codigo:

<mx:Button x=”109″ y=”206″ text=”Servo 3″/>

Eso es en formato MXML (o HTML version flash), pero para que quede totalmente comprendido vamos a aclarar que una cosa es usar el namespace para que puedan usarse componentes en los tags como el boton anterior y otra muy distinta es importar las clases necesarias en la parte del codigo para acceder a componentes que no tienen forma de aparecer con tags, como es el caso de un componente alerta:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768" width="514" height="316">
<fx:Script>
<![CDATA[

import mx.controls.Alert;

Alert.show("Hello World","Hello");

]]>
</fx:Script>
<fx:Declarations>
<!– Place non-visual elements (e.g., services, value objects) here –>
</fx:Declarations>
</s:Application>

Hasta aqui lo fundamental de la estructura en Flash Builder 4, espero que haya quedado masomenos claro la estructura y el por que de la creacion de Flash Builder alias Flex.

Saludos!

Bookmark It

Quiero empezar con un tutorial que hace tiempo escribí para una página en donde me pidieron fuera colaborador.
La plataforma flash se caracteriza por tener su propio código, y la ventaja de no depender de un esquema muy estrecho es su capacidad para perfeccionar el lenguaje. Actualmente flash tiene 3 versiones de su lenguaje, estos son ActionScript 1.0, ActionScript 2.0 y ActionScript 3.0

Conforme fue avanzando el tiempo el lenguaje también fue evolucionando y en cada una de las versiones se agregaron metodos para escribir aplicaciones más complejas. Las versiones 1.0 y 2.0 en escencia son la misma, el salto a la versión 2.0 fue un incremento en las funciones de trabajo del reproductor (oooops palabra nueva) AS1.0 fue creado primariamente para las animaciones, AS2.0 para la programación orientada a objetos pero AS3.0 fue reescrito para convertirse en un lenguaje estricto que acelera el trabajo y propagación de eventos con una estructura muy similar a Java.

Aclarado el punto de que flash tiene su propio lenguaje, queda señalar los distintos tipos y sabores de flash:

• Flash player: Encargado de la reproducción de los archivos hechos en formato SWF (pronuncia suif). En otras palabras es como una videocasetera en forma de programa, le metemos una pelicula (también se le llama pelicula a un archivo SWF) y esta la reproduce en pantalla.
• Flash: Es el entorno de programación en el cual desarrollamos animaciones, programas, formularios, juegos etc.
• Flash Builder ó Flex: es una forma especial de Flash que permite programar Flash en un estilo HTML o XHTML para todos los programadores de la DISQUE Web2.0
• Flash Catalyst: En realidad catalyst debería formar parte de Flash Builder, ya que este programa se encarga de convertir dibujitos (sip dibujitos tal cuales y viles) en componentes como botones, sliders, scrollbars, etc.
• Adobe AIR: Es un runtime (o emulador) que permite simular un archivo SWF como si fuera un programa normal de PC o MAC dandole capacidades de acceso al sistema.

La versión más reciente del Flash Player hasta la fecha es la 10.1 con la versión de programación ActionScript 3.0 y que puede usarse en Flash CS4 y CS5 asi como Flash Builder 4.

Una cosa que me encanta recalcar, es que la plataforma Flash existe en todos los sistemas operativos comerciales como Windows, OSX,Linux,iPhone,Windows Mobile,Android y Symbian. Si me salte alguno me dicen.

Algo que ningún otro lenguaje puede abarcar, y todo con las mismas herramientas y versiones del codigo SIN alterar la forma de programar.

Saludos!

Bookmark It