GiftedMotion. Creación de gifs animados

GiftedMotion es una sencilla aplicación multiplataforma escrita en java para la creación de gifs animados. Está pensada para su usabilidad, por lo que su interface es clara y no presenta complejidad alguna. Para usarla, es necesario tener instalado java 1.5 o superior.

Características de la versión actual:

  • * Funciona en Linux, Mac OS y Microsoft Windows.
  • * Soporte multilenguaje
  • * GPL software
  • * KISS approach. No hay curva de aprendizaje.
  • * No requiere instalación. Sólo hay que poner el archivo jar en el escritorio (o cualquier otro lugar) y ponerlo en marcha.
  • * Soporta los formatos de entrada siguientes: PNG, JPG / JPEG, BMP y GIF.
  • * Fácil de ajustar la posición de las imágenes dentro de los marcos y el tamaño de la imagen resultante.
  • * Función de vista previa.
  • * Capaz de editar las imágenes existentes

El siguiente gráfico indica la función de cada uno de los componentes de la interface

Sitio oficial: http://www.onyxbits.de/giftedmotion
Sencillo tutorial de uso: http://www.onyxbits.de/content/book/using-giftedmotion

Videotutoriales

Anuncios

WDT. Web Developer Tools

WDT (Web Developer Tools) es un conjunto de herramientas útiles para desarrolladores web. Podemos crear botones, estilos y demás utilidades para nuestra web. Se encuentra en una versión de desarrollo por lo que el editor html es muy básico. No obstante, hay que destacar su elegante diseño y sencillez de uso. Podemos instalar desde las fuentes, aunque también hay ya sus repositorios en launchpad.
El paquete de fuentes está en Gnome-look
Para usuarios de ubuntu, podemos añadir el repositorio:

sudo add-apt-repository ppa:petrakis/wdt-main
sudo apt-get install wdt

Es un programa que promete. Habrá que esperar desarrollos futuros.
Incluye:

  • Task Manager
  • Dean Edwards Javascript Compressor
  • JSMin
  • Css Minifier
  • Css Type Set Generator
  • Css Button Generator
  • Cool Button Generator
  • RGB / HEX Color chart
  • VTE Terminal
  • WYSIWYG HTML 5 Editor
  • Website Analyzer (Yslow PageSpeed)
  • 3 x online W3C validators
  • ScriptBook
  • Customizable menu for other apps

Swftools. Creación y manipulación de ficheros flash (.swf) desde una terminal

SWFTools es una colección de programas (ejecutables desde una terminal) bajo licencia GPL para la creación y/o manipulación de ficheros Flash (.swf). Se encuentran en los repositorios de Ubuntu, por lo que basta teclear en una terminal para instalarlos sudo apt-get install swftools. Podemos encontrar diversos ejemplos de las posibilidades, entre ellas educativas, de swftools, aquí. Incluye diversas herramientas, cuya sintaxis y opciones pueden consultarse desde una terminal). Son:

swf-logo

pdf2swf
Convierte un archivo pdf a swf. Genera un fotograma por cada página del documento. Permite incluir texto completamente formatado, incluyendo tablas, fórmulas, gráficas, etc dentro de la película en Flash.  Para ver las diferentes opciones, podemos teclear en una terminal man pdf2swf y pdf2swf –help.
Sintaxis:
pdf2swf [opciones] archivo.pdf [-o archivo.swf]

Ejemplos:
pdf2swf archivo.pdf (genera un archivo swf a partir del archivo.pdf)
pdf2swf -p 1-3 archivo.pdf (genera un archivo swf que contiene las 3 primeras páginas del archivo.pdf)
pdf2swf -p 1,3,6 archivo.pdf (genera un swf con las páginas 1,3 y 6 solamente)

Más información sobre pdf2swf en http://www.jesusda.com/blog/index.php?id=372

jpeg2swf
Genera una presentación swf a partir de varias imágenes jpeg.
Sintaxis:
jpeg2swf [-opciones [valores]] imagen1.jpeg imagen2.jpeg […]
La opción más interesante es -r seguida del número de imágenes por segundo.

Ejemplos:
jpeg2swf -r 0.5 *.jpeg (genera un swf a partir de todas las imágenes jpeg existentes en la carpeta con una duración de 2 segundos cada una)
jpeg2swf -r 2 *.jpeg (genera un swf a partir de todas las imágenes jpeg existentes en la carpeta a razón de 2 imágenes por segundo)
jpeg2swf -r 0.5 -X 300 -Y 200 -f *.jpg (genera un swf  de dimensiones 300×200 a partir de todas las imágenes, con 2 segundos cada una, ajustándo cada imagen al tamaño de la presentación)

png2swf
Igual que jpeg2swf pero con imágenes png.
Sintaxis:
png2swf [-X width]  [-Y  height]  [-o  file.swf]  [-r  rate]  file1.png [file2.png…]

Ejemplos:
png2swf -r 0.5 -s 30 *.png (genera un swf a partir de todas las imágenes png existentes en la carpeta con duración de 2 segundos redimensionándolas al 30% de su tamaño)

Otras herramientas:

  • gif2swf: Convierte gif a swf.
  • swfcombine: Una herramienta multifunción para insertar varios SWF dentro de otros, concatenando, superpoñendo, o permitiendo manipulación básica de parámetros (cómo, como por ejemplo, cambios en el tamaño).
  • swfstrings: Busca cadenas de texto dentro de ficheiros SWF.
  • swfdump: Muestra información sobre ficheiros SWF, como las imágenes/tipografía/sonidos que contienen, etc.
  • wav2swf: Convierte ficheiros de sonido WAV a SWF, empleando la biblioteca de codificación MP3 LAME.
  • font2swf: Convierte ficheiros de tipografías (TTF, Type1) a SWF.
  • swfbbox: Permite leer, optimizar y reajustar las cajas contedoras (bounding boxes) de los ficheiros SWF.
  • swfc: Una herramienta para crear ficheiros SWF a partir de ficheiros simples de script. ES compatíbel con ActionScript 2.0 y también con ActionScript 3.0.
  • swfextract: Permite extraer clips de vídeo, sonidos, imágenes, etc, de los ficheiros SWF.
  • las3Compile: Un compilador de ActionScript 3.0 independiente. Compatíbel en su mayor parte con Flex.

Edición en html

mec_htmlEn la página del Ministerio de Educación y Ciencia del Gobierno de España, podemos encontrar diversos tutoriales y materiales de formación, que cualquiera puede bajarse como imagen ISO, y todos ellos bajo licencia Creative Commons.  Uno de ellos, “Edición en Html“, contiene gran parte del desarrollo dedicado al aprendizaje de Kompozer. Este es el motivo por el que ponemos aquí los pdfs del curso. La ISO puede bajarse desde aquí.

Los objetivos que se plantea el curso son:

  • Que conozcas la estructura básica de un documento HTML.
  • Que aprendas a construir una página HTML utilizando los recursos elementales y algunos de nivel intermedio.
  • Que adquieras las bases necesarias para poder continuar de forma autónoma el aprendizaje sobre elementos avanzados de lenguaje HTML.

Tutoriales del curso Edición en Html

  1. Introducción
  2. La base-Entorno de trabajo
  3. La base-Texto
  4. La base-Colores y fondos
  5. La base-Etiquetas meta
  6. Tablas
  7. Multimedia-Imágenes
  8. Multimedia-Sonidos
  9. Vínculos
  10. Validación
  11. Plantillas
  12. Formularios
  13. Marcos
  14. Xhtml
  15. Estilos-Introducción
  16. Estilos-Aplicar estilos
  17. Estilos-Texto y fuentes
  18. Estilos-Fondos, bordes, márgenes y rellenos
  19. Estilos-Listas
  20. Estilos-Diseño visual
  21. Estilos-Ténicas
  22. Estilos-Menús
  23. Publicación
  24. Recursos
  25. Accesibilidad
  26. Errores

autores-02

Amaya. Editor web

Amaya es una herramienta combinada del W3C compuesta por un navegador web y una herramienta de autor. Cualquier página web que se abra puede ser editada inmediatamente. Se pueden ver y generar páginas HTML y XHTML con hojas de estilo CSS, expresiones MathML y dibujos SVG. Una gran característica consiste en que puede ver los enlaces que se crean con el editor.

Renderiza imágenes, por ejemplo en PNG y un subconjunto del formato de Gráficos Vectoriales Escalables (SVG), como figuras básicas, texto, imágenes y foreignObject (el último es útil para incluir fragmentos HTML o expresiones MathML en los dibujos). Los gráficos están escritos en XML y pueden ser mezclados libremente con HTML y MathML.

Es software libre, disponible para sistemas tipo Unix, Linux, Mac OS X, Windows y otras plataformas. La última versión liberada es la 11, que fue lanzada el 16 de diciembre de 2008. Esta versión soporta HTML 4.01, XHTML 1.0, XHTML Basic, XHTML 1.1, HTTP 1.1, MathML 2.0, muchas características CSS 2, e incluye soporte para gráficos SVG (transformación, transparencia y animación SMIL), además se puede, no sólo visualizar sino además editar, de manera parcial, documentos XML (Wikipedia)

Sitio oficial: http://www.w3.org/Amaya/
Curso online de páginas web con Amaya: http://www.mclibre.org/consultar/amaya/
Podemos descargar el curso para estudiarlo offline desde aquí o desde aquí:

Videotutoriales:

EDITOR WEB AMAYA

WEB SENCILLA CON AMAYA

EDICIÓN HOJAS DE ESTILO CSS CON AMAYA

Kompozer. Editor web

KompoZer es un editor HTML WYSIWYG opensource basado en Nvu. Es mayormente mantenido por una comunidad de usuarios. Este programa permite el diseño de nuestra propia página web sin necesidad de conocimientos de html, como si se tratase de un simple procesador de texto, insertando tablas, imágenes, botones, diseño de página, diseño de tablas y celdas, etc. en una interface sencilla y bien estructurada.

Entre sus características más destacadas, destacan:

  • * Editor web WYSYWIG con la representación del motor Gecko 1.7
  • * Opciones especiales para la inserción de imágenes, tablas, formularios…
  • * Generador automático de tablas de contenido basado en los niveles de encabezado.
  • * Editor CSS avanzado, con capacidad de crear y usar tanto archivos CSS externos como hojas incrustadas en el archivo HTML mediante etiquetas .
  • * Posibilidad de definir y usar plantillas.
  • * Admite etiquetas PHP sin alterar su contenido.
  • * Limpiador de código HTML.
  • * Enlace directo con el validador HTML de W3C.
  • * Completa ayuda incorporada en el programa.

Sitio oficial: http://kompozer.net
Para ponerlo en español, entramos en la página de kompozer y sección locales, descargamos el archivo kpz-langpack-esES.xpi. Abrimos el programa kompozer. Entramos en Herramientas/Complementos/Idiomas/Instalar. Seleccionamos el fichero descargado. Y reiniciamos. Debemos llevar cuidado de que el fichero de idiomas descargado corresponda con la versión instalada. Ah! no olvidemos poner en Opciones del programa (Configuración para las nuevas páginas) el conjunto de caracteres ISO-8859-1, si deseamos visualizar nuestras páginas sin caracteres indeseables.

Tutoriales en español

Podemos encontrar ayuda sobre el programa y el diseño de webs en el foro de Mozilla Hispano
Algunos tutoriales avanzados de Kompozer en: http://joaclintistgud.wordpress.com/category/tutoriales/kompozer/

Videotutoriales:
(Pese a “la voz”, creo que merece la pena el esfuerzo)

WEB SENCILLA CON KOMPOZER I

WEB SENCILLA CON KOMPOZER II

WEB SENCILLA CON KOMPOZER III