Comunidad de diseño web y desarrollo en internet

¿Olvidaste tu usuario o clave? «
registrate

Cerrar

Desarrollo de videojuegos: Entrevista a Xklibur

En esta oportunidad pude entrevistar a la genial Xklibur acerca del desarrollo de videojuegos, los procesos y dificultades, así como también lo que significa abordar un videojuego desde lo creativo, la lógica misma, la temática y planificación completa del mismo. Espero que lo disfruten!

Desarrollo de videojuegos: Entrevista a Xklibur


¿Cómo comenzaste a crear videojuegos?

Desde que mis padres me regalaron un Nintendo surgió mi irracional deseo de desarrollar videojuegos. Este deseo fue creciendo a lo largo de los años junto con horas de juegos en otras consolas y plataformas, combinado con mi pasión por el dibujo. Así, aunque no estudié una carrera relacionada con la computación o el dibujo, el deseo de desarrollar videojuegos perduró.

Mi primer videojuego fue un RPG realizado con RPG Maker, una aplicación con la que puedes desarrollar un videojuego de ese género sin muchos conocimientos. Pero no me gustó, sentía que no había hecho casi nada…porque en efecto así había sido, sólo los diálogos eran de mi invención. Yo quería hacer mis propios dibujos, diseñar y programar mi juego desde cero.



The Ninth Corpse - juego en desarrollo.


Un día descubrí Flash, junto con Flash descubrí Cristalab, me registré, estudié Actionscript 2 por mi cuenta y realicé mi primer jueguito en Flash sobre dicha comunidad. Curiosamente, las personas lo jugaron a su manera y les gustó. Posteriormente, un usuario llamado Conejo me pidió el archivo .fla para migrar mi videojuego al Nintendo DS. A raíz de eso surgió la idea de desarrollar otro juego para esa plataforma y yo participé en el diseño de fondos e ítems en Pixel Art. Me gustó mucho la experiencia y dejé de lado lo que hacía para dedicarme principalmente al desarrollo de videojuegos.


¿Cómo es el proceso creativo detrás de un videojuego?, ¿qué aspectos trabajas vos y cuáles delegas?

Todo comienza con varias ideas, generalmente ambiguas. Luego se selecciona la mejor en base a la experiencia, tendencias actuales y sobre todo, en base a la emoción que genera en el equipo de desarrollo, puesto que es muy importante trabajar en una idea que te motive. A partir de esa idea se toman decisiones respecto a todos los elementos del juego como: la historia, la temática, los personajes, las reglas, la recompensa, el castigo, entre otros. De esa forma se moldea el gameplay y se pasa a las siguientes fases del desarrollo del videojuego.

Cualquier persona de mi equipo de trabajo puede aportar ideas pero no delego el diseño del videojuego que es donde reside la mayor parte del proceso creativo.





The Rainbow Machine - Imágenes inéditas.



¿Cómo son los tiempos que debes manejar?

El tema de los tiempos de desarrollo es bastante difícil de manejar. Resulta muy complejo estimar los días necesarios para culminar un videojuego porque el diseño siempre está sujeto a cambios, los plazos siempre se ven alterados y la planificación nunca coincide. Se suele determinar en base a los días que tarda un trabajador haciendo una unidad mínima del trabajo asignado. Por ejemplo, los días que tarda el artista gráfico haciendo un fondo permitirán realizar un estimado de los días que le tomará hacer todos los fondos del videojuego.


¿Cuáles son tus herramientas?

En lo personal, mis herramientas de trabajo son: Flash, Photoshop, Illustrator, Gimp y FL Studio.


¿Cuáles son tus influencias más importantes a la hora de pensar en una historia?. ¿Esto influye en tu estilo personal a la hora de la realización?

No tengo ninguna influencia específica al momento de crear la historia. Por lo general, a partir de la idea básica que da origen al gameplay se desarrolla la historia. Una idea para un videojuego puede surgir de cualquier parte y el desarrollo de la historia dependerá principalmente: del tipo de videojuego que planeas desarrollar, de tu conocimiento, vivencias, tendencias y experiencias.


¿Cuál es la temática que más te gusta abordar y porqué?

Todos los videojuegos que he desarrollado son de temáticas diferentes, no tengo preferencia por ninguna temática en especial. Al desarrollar videojuegos de temáticas diferentes existen menos posibilidades de caer en el aburrimiento y perder la motivación e interés en esa actividad. Por otro lado, al crear videojuegos de diversas temáticas amplías tu conocimiento y experiencias de desarrollo. Por último, la diversidad en tu catálogo de productos favorece la comercialización, al tener más opciones de entretenimiento que ofrecer a tus clientes hay más probabilidades de ventas.



Príncipe Feliz - videojuego educativo.


¿Qué tipo de experiencias tratas de brindar al usuario?

La experiencia que trato de brindar a los jugadores obviamente varía con cada videojuego, pero en términos generales mi objetivo es inducir al jugador a una zona de control del caos. Es decir, le doy al jugador las herramientas para que se convierta en el salvador de un universo irreverente al que debe devolver el orden. El factor de diversión viene dado por varios aspectos psicológicos inmersos en esa premisa.


¿Qué experiencia te ha enseñado más a lo largo de estos años como creadora de videojuegos?

Aunque siempre aprendes cosas nuevas con cada videojuego que desarrollas, considero que la experiencia que más me enseñó fue el rechazo de mi primer videojuego comercial. Desarrollé un videojuego de plataformas y fue rechazado por los publishers porque no entraba en su target y era muy complicado de manejar con el teclado. Gracias a esa experiencia comprendí que si quería comercializar mis videojuegos no podía desarrollarlos pensando en mis gustos y preferencias, debía evaluar previamente el marcado, observar tendencias y estudiar mi target. También aprendí que los publishers prefieren los juegos controlados con mouse.



Juego para Kia por el mundial de Fútbol - juego en Facebook.


¿Qué consejos le darías a los que quieren comenzar en esta actividad?

No existe un manual que te diga lo que debes hacer para crear videojuegos exitosos, tampoco se trata de un don, sólo el trabajo duro, el estudio, la observación y la disciplina te permitirán triunfar.

Hay una máxima de los diseñadores de videojuegos que dicta: Tus 10 primeros videojuegos apestarán, así que procura salir rápido de ellos (The Art of Game Design, Jesse Schell). La experiencia que necesitas para desarrollar buenos juegos sólo la obtendrás mediante la práctica. No seas muy ambicioso con tus videojuegos, desarrolla algo sencillo que no te tome mucho tiempo y realmente te guste para que así siempre estés motivado.

Les recomiendo leer mis consejos para diseñadores de videojuegos principiantes.


Contanos acerca de la técnica utilizada, historias o dificultades que hayas encontrado en la realización de algún videojuego que hayas creado.

NagiQ es un videojuego casual de palabras para toda la familia, con un gameplay original, gráficos coloridos de estilo cartoon y una historia mágica sencilla. La mayor dificultad al momento de desarrollar este videojuego fue el diseño. No es sencillo crear desde cero un juego de palabras con reglas novedosas y únicas. Diseñar la lógica fue lo que más tiempo nos llevó, se realizaron varios prototipos funcionales y se hicieron varias pruebas con jugadores de nuestro target antes de iniciar el desarrollo propiamente dicho. La mayor dificultad fue simplificar las reglas para que no fuese excesivamente complicado jugar. El gameplay original requería un alto nivel mental para poder avanzar, los retos muy complejos crean frustración en los jugadores promedios en lugar de divertirlos.



NagiQ


Al final decidimos incluir algunas de las diferentes mecánicas de juego creadas para dotar de variedad a los mundos. El juego consta de 5 islas con variaciones en el gameplay, por ejemplo: en una isla debes formar palabras para atrapar unos insectos y recolectar todas las letras místicas, en otros mundos debes recolectar todas las letras místicas del tablero antes de que termine el tiempo, en otros la forma de recolectar las letras varía.


Muchas gracias por la entrevista xklibur!!!.

HTML5 es más que etiquetas

HTML5, CSS3 y Javascript son la nueva columna vertebral de la experiencia de usuario en Internet, acortado como "HTML5", similar a lo que en su tiempo fue la "Web 2.0".

"Web 2.0" es un termino desafortunado. Inventado por O'Reilly y desvirtuado por el marketing, nunca significó nada más allá de "AJAX con usabilidad" y terminó como sinonimo de ignorancia tecnologica.

Ahora tenemos "HTML5". HTML5 es la nueva versión semántica del lenguaje de etiquetas con el que se construye internet. Pero la W3C, el consorcio encargado del estándar, también ha tomado HTML5 como el término sombrilla que engloba las nuevas tecnologías del futuro de la web. A diferencia de "web 2.0", esta vez HTML5 tiene un norte definido, un grupo de empresas y fundaciones apoyando y una visión.



"¡¡Pero HTML5 no es CSS3 y Javascript!!"


HTML5 es un lenguaje de modelado de información por etiquetas. CSS3 es un lenguaje de estilos en cascada. Javascript es un lenguaje de programación. Y todos, todos, se engloban alrededor del concepto HTML5.

Flash es una herramienta vectorial, un formato de animación y un contenedor de Actionscript 3, así como el player de varios formatos de video y del sistema de RIAs Flex.

¿Y saben qué? Sigue llamandose Flash todo eso.

La W3C oficialmente aceptó "HTML5" como el concepto sombrilla, al punto que creo un logo principal y una página de marca explicando claramente que HTML5 es HTML y más que HTML.


Los geeks fanaticos no entienden de marcas


La discusión de que HTML5 no es CSS3 que se dio en Cristalab la semana pasada me recuerda la discusión de si "Linux" es "GNU/Linux" o no. La realidad es que a nadie le importa. Sí es importante definir qué cosa es qué al programar, pero cualquier persona inteligente puede diferenciar el uso de HTML5 en cada contexto.

¿Por qué el odio a usar HTML5 como concepto? No lo sé ¿Elitismo? No encuentro el menor sentido en atacar un concepto que ayuda a entender mejor una nueva tecnología y por extensión a vender más, mejor y más avanzados proyectos a los clientes y usuarios.

El artículo de la semana pasada dice que Web Storage, la capacidad de guardar en disco con Javascript, no es HTML5. Y publica esta URL:
http://dev.w3.org/html5/webstorage/
Donde parte de la URL dice HTML5!!

¿Quieren más ejemplos? Entren a:
http://dev.w3.org/html5/

Donde encontrarán Canvas (Bitmaps Javascript), Device (cámaras, microfonos), Websockets (Mensajes realtime), Web Workers (JS multitarea) entre muchos otros ejemplos bajo HTML5.



"HTML5 estará listo en el 2014"


El último y más famoso recurso de los detractores de HTML5 es que "no está listo". ¿Ustedes creen que HTML5 es un software que una empresa "termina"? HTML5 es un spec vivo, cuya implementación depende de los navegadores y del cual gran parte se puede usar ya mismo sin problemas. Eso incluye CSS3. Es posible usar CSS3 en Internet Explorer viejos. Es posible usar HTML5 desde ya.

El draft HTML5 de la W3C no se cerrará hasta dentro de unos años, pero para entonces nuestros navegadores tendrán nuevas tecnologías, porque no es Flash o Visual Basic, es una tecnología viva que crece con su uso.

Sean profesionales, usen HTML5 y no teman llamarle a las cosas por su marca.

La próxima versión de Flash exportará a HTML5

Todavía piensas que Flash está muerto? Adobe ha publicado un video en el que muestra la posibilidad de exportar a HTML5 por parte de Flash Professional.

Adobe está trabajando en lo que parece una futura característica llamada Toolkit for CreateJS la cual permite exportar a HTML5 gráficos y animaciones de Flash Professional, obteniendo como resultado final un código JavaScript bien formateado y totalmente editable.



Este proyecto, que probablemente veamos implementado en la próxima versión de Flash, va alineado al compromiso y trabajo a favor de los estándares que Adobe ya ha expresado anteriormente y, aunque inicialmente habrá muchas características de Flash que no estarán soportadas en este proceso de exportación, es fácil proyectar que a medida que ésta herramienta evolucione, se eliminará la necesidad del Flash Player en los navegadores y se dará prioridad en Flash a la publicación para HTML5.

CreateJS es un framework open source desarrollado por Grant Skinner compuesto por un grupo de librerías JavaScript que permiten trabajar con gráficos, sonidos, precargas y animación. Grant ha colaborado con el equipo de desarrollo de Flash para el desarrollo de Toolkit for CreateJS.

Para que tengas una mejor idea del proceso de exportación con Toolkit for CreateJS puedes ver este video:

Mitos y verdades sobre HTML5

Antes de continuar con toda esta parafernalia de HTML5 y CSS3 es bueno desmentir o aclarar ciertas cosas que como desarrolladores debemos tener claras y que la información no muy clara en distintos medios (foros, blogs, screencast, etc...) puede prestar para confusiones y malos entendidos. Y esto puede generar un obstáculo en el equipo de desarrollo del proyecto en que se esté trabajando. A veces es bueno un poco de lectura pues no todo es código y código, siempre diré que una lectura o un buen libro mantienen el cerebro ejercitado y listo para aprender nuevas cosas.



La idea errónea de CSS3


CSS existe alrededor de HTML desde 1996 - es una tecnología relativamente vieja, claro está que esto muchos lo saben!!. La última versión, CSS3, se ha estado desarrollando desde 2005 y todavía está muy lejos de cumplir la recomendación total indicada por la W3C. Se ha dividido en módulos individuales que están siendo implementados por los navegadores, y de todos modos se continúa trabajando. Debido a esto, es difícil predecir cuándo CSS3 será terminado al 100 por ciento, aunque, como HTML5, partes de él ya se pueden usar en la mayoría de los navegadores.

La cosa importante a observar con CSS es que está separado de HTML en el desarrollo y uso. CSS3 no es parte de la especificación HTML5 (que nunca fue y nunca lo será, eso espero!). Se trata de dos tecnologías completamente diferentes - uno para la estructura y el diseño, y el otro para la presentación, debido a su proximidad en el uso, han sido agrupados por alguna razón. El resultado final? No se puede referir a CSS3 como HTML5.


Entonces CSS3 es parte de HTML5?


No - CSS3 es una tecnología de diseño, no tiene nada que ver con el contenido o la estructura de HTML5. Aquí puede encontrar un complemento sobre CSS3 y sus especificaciones.


Web Fonts


Uno de los inconvenientes masivos con el diseño web el increíblemente difícil uso de fuentes personalizadas. Hasta hace poco la única forma de hacerlo era mediante la construcción de imágenes estáticas que representan las palabras que desea utilizar, o mediante el uso de sistemas complicados como sIFR o Cufon. Web Fonts resuelve este problema mediante la introducción de font-face una de tantas reglas de CSS, que permite el uso de fuentes personalizadas con sólo un par de líneas de código. Mucho más fácil, verdad!, lo único delicado del asunto es tener en cuenta que tipo de fuente está utilizando y si respeta los derechos de propiedad intelectuales del caso.


Entonces Web Font es HTML5?


No - es parte de CSS3, además, técnicamente no se conoce como Web Fonts. La W3C lo declara como un módulo. Aquí puede encontrar más información sobre CSS3 y Web Font.


Geolocalización en HTML5


Imagínese que usted pudiera obtener automáticamente la información en la Web relacionada con su ubicación actual, donde quiera que esté (bueno en casi todos los lugares). La API de geolocalización está haciendo precisamente esto, proporcionando una herramienta a través de algunos scripts de JavaScript "sencillos" para la ubicación aproximada de un usuario. El usuario tiene que permitir que la información sobre su ubicación pueda ser compartida, pero las consecuencias de hacerlo son profundas, como los anuncios publicitarios relacionados con los resultados de búsquedas útiles y contenidos del sitio web correspondiente. Esto tiene cosas positivas y un cierto sabor negativo.


Y la API de geolocalización es HTML5?


No - esta es una API de JavaScript que está diseñada para ser implementada por los navegadores que tengan soporte sobre ésta. Aquí puede encontrar más información sobre la API de geolocalización.


SVG ó Gráficos en Vectores


Scalable Vector Graphics (SVG) es un lenguaje que le permite crear gráficos vectoriales 2D utilizando XML. Es muy similar a canvas en su funcionalidad y propósito, pero difiere sustancialmente en otras áreas.

Pero SVG es HTML5?


No - es una tecnología totalmente independiente que describe el uso de gráficos XML. Aquí puede encontrar más información sobre SVG.


Web Storage


Los Cookies, aperitivo favorito de los desarrolladores, coincidentemente son el método de elección para el almacenamiento de pequeñas cantidades de información en el ordenador del usuario. Hasta ahora ha sido el único método viable de almacenamiento de datos en el ClientSide (del lado del cliente), pero tiene algunos defectos que potencialmente pueden causar muchos dolores de cabeza en lo que a seguridad se refiere. Web Storage, es un conjunto de APIs de JavaScript, ha sido creado para ofrecer una selección de gran alcance de las opciones de almacenamiento que resolver las desventajas inherentes de usar cookies. No suena tan cool, pero abren las puertas a cosas como ver tu correo electrónico basado en el navegador y almacenado un volumen de información relativamente interesante. Cool cierto!


Pero Web Storage es HTML5?


No - es una API de JavaScript, que está diseñada para ser implementada por los navegadores que tengan soporte sobre esta. Aquí puede encontrar más información acerca de Web Storage.


Web Workers


Los Web Workers son en realidad esclavos incansables escritos en JavaScript listos para hacer uso de ellos. Su único propósito es llevar a cabo cálculos pesados y otras tareas intensivas en el background de la aplicación, sin que la página web se vea afectada en su rendimiento y dañar la experiencia del usuario. No hay un gran número de casos de uso para los Web Workers, pero es bueno saber que están ahí en caso de que los necesite.


Los Web Workers son HTML5?


No - son una API de JavaScript, que está diseñada para ser implementada por los navegadores que tengan soporte para la misma. Aquí puede encontrar más información acerca de los Web Workers.


WebSockets


La comunicación normal en la Web se hace a través de HTTP, un método que sólo permite la comunicación en una dirección en un momento dado, y requiere de una página Web que se solicita cada vez que desea que actualice o cree datos. Para evitar esto los desarrolladores Web han estado utilizando toda una serie de opciones para eludir el requisito de tener que solicitar una nueva página cada vez que se necesite de una información sobre algún elemento de la página. Tecnologías como Ajax y Comet se inventaron para este fin.

Sin embargo, todavía no son verdaderamente métodos de comunicación bidireccional - la información sigue viajando sólo en una dirección en un momento dado.
Los WebSockets son diferentes, porque utilizan TCP que permite la verdadera comunicación bidireccional entre el cliente (su computadora) y un servidor. Esto significa que usted nunca tiene que hacer una petición de nuevos datos desde el servidor, ya que la información es, literalmente, transmitida a su computadora en tiempo real a medida que llega nueva información. Es un concepto complicado, pero muy poderoso, una vez que llegue a familiarizarse con él.


La API de WebSocket es HTML5?


No - es una API de JavaScript que está diseñada para ser implementada por los navegadores que la soportan. Aquí puede encontrar más información sobre la API de WebSocket.


Conclusión


A pesar de que todas estas tecnologías no son parte de HTML5, todas ellas resuelven un propósito específico y que debe ser aceptado y usado junto con HTML5 siempre que sea posible. Por ejemplo, mediante la combinación de WebSockets y canvas de HTML5 se pueden crear en tiempo real increíbles juegos para varios jugadores en línea (redundante pero cierto). Ahora sí, es una combinación fresca de dos tecnologías diferentes, que juntas dan un sabor al desarrollo inigualable.

Efecto de pasar página de libro (Page Flip) en HTML5 con Turn.js

¿Recuerdan ese efecto que animaba una pagina de contenido como si fuera un libro cuyas paginas se cambiaban con el mouse? Sí, ese efecto que hacia que todos odiaran Flash y que era una forma de no pensar demasiado al implementar un diseño.

Turn.js es el efecto en HTML5 y Javascript. De Emmanuel Garcia (@blasten), nativo de Venezuela, viviendo en Cincinnati.

Ventajas de Turn.js por encima de Flash


Es (más o menos) cross browser, aprovechando la aceleración por hardware de Webkit, usando transformaciones y translaciones 3D de CSS3 y eventos touch. Por lo que funciona "bien" en navegadores móviles y tablets.


Además, tiene todo lo bueno de HTML. URLs "casi" profundas, texto seleccionable e indexable por Google, la flexibilidad de diseño de un sitio normal en HTML y CSS, así como interactividad interna.

Desventajas de Turn.js


En las desventajas: ESTO ERA HORRIBLE EN EL 2006 CON FLASH Y LO SIGUE SIENDO EN EL 2012 CON HTML5. Por favor no lo usen para un sitio entero. Si un cliente quiere esto como la base de todo su sitio, despidelo. El único caso donde veo esto funcionando es como un demo de cómo quedaría una versión impresa real.

El problema del Page Flip, con Flash o con Turn.js, sigue siendo que es una solución perezosa desde un punto de vista de interfaz. Una revista que llegue a la web tiene que aspirar a una interfaz tipo Flipboard, NO a una interfaz que "simule" el papel.


Esto, claro, no quita el merito técnico que tiene Turn.js. Sólo pesa 6KB y obviamente es de código abierto en Github, además de ser cross platform incluso en móviles. Vale la pena aprender del código.

La pelea del 2012 por la libertad web está casi perdida en español

SOPA y PIPA son leyes en el congreso y senado de Estados Unidos que le permiten al gobierno (o a cualquiera con "copyright") censurar sitios web de manera masiva, inmediata y sin que un juez lo autorice.

Bloquea el DNS (el dominio), por lo que es casi imposible pelear contra SOPA/PIPA a nivel técnico, excepto si fragmentamos internet.

Si tienes un foro o un blog y uno de tus usuarios posteó contenido "ilegal" en los comentatios. Si fue un video de youtube que embebiste. Incluso si no es contenido, sino un link hacia algo "con copyright". Tu web sería censurada en dos clicks.

Wikipedia, Google, Reddit protestan ¿Por qué no Cristalab?



El home de Google, desde USA.

¿Por qué no nos unimos? Porque es una ley de Estados Unidos. Cristalab es leído desde:

El porcentaje de personas que nos ven desde USA es menos del 2%. Somos una web en español.

Y en español, creo yo, ya casi estamos sin esperanzas.

La Ley Sinde fue aprobada en España, por acoso del gobierno de USA. La ley ACTA (y sus derivados) está en via de ser aprobada en México. La Ley Lleras casi es aprobada en Colombia. En Argentina, Cuevana y Taringa han sufrido de censuras constantes en el pásado. En Venezuela, el gobierno Chavez ya ha censurado sin problemas lo que le conviene en tiempo de elecciones.

Actualización:

¿Pero en español que hacemos? ¿Ponemos todas nuestras webs en negro por una ley de allá?


Estados Unidos sin duda tiende a dictaminar las leyes en el resto del mundo. Pero en este caso va más allá. Como indiqué arriba, fue el gobierno de USA quien empujó con amenazas al gobierno de España a pasar la ley Sinde (gobierno que antes ha creado otras cosas horribles como el canon).

En el caso de USA, tiene total sentido negrear los sitios web y con geolocalización, seguro Cristalab es inaccesible también desde acá. Pero en el caso de latinoamerica y España, poner una linea de Javascript y creerte activista no hará nada. Nada.

¿Quieres hacer un cambio? Informa y educa, tal como este post. Una página en negro por una ley ante la que tus usuarios no pueden hacer nada (en USA pueden llamar a sus congresistas y senadores) no hará más que confundir y fastidiar.
Fin de actualización.

¿Qué hacer? No lo sé. Toda la política es sucia y a diferencia de Estados Unidos, en nuestros países matan por ser "activista". Quiero creer que es posible y conozco cientos de personas que luchan por la libertad de la web hispana. No tengo idea si lo logremos, pero mientras espero que todos se enteren y cuando puedan, peleen. Yo lo intentaré.

Votación para Premios Cristalab 2012

Cada cuatro años se organiza en la comunidad la entrega de los Premios Cristalab. Los Premios Cristalab, son una iniciativa del staff de la comunidad para reconocer y premiar el esfuerzo y aporte de los usuarios del foro. En otras palabras, es una forma de agradecer a todos los que han participado y apoyado abiertamente a Cristalab. Hoy, que celebramos el octavo cumpleaños de la comunidad, queremos invitarlos a participar también en la votación de los Premios Cristalab.




Categorías



Habrá varias categorías que se premiarán según las estadísticas, por ejemplo: los tutoriales más visitados, usuarios que contestan más preguntas o con mayor clabLevel, y otras categorías que se revelarán el día de la entrega.

Igualmente, habrá cinco premios otorgados por los propios clabers. Así que tu puedes decidir quiénes merecen los siguientes premios:


  • Premio Cristalab al claber más Colaborador
  • Premio Cristalab al claber más Creativo
  • Premio Cristalab al claber más Admirado
  • Premio Cristalab al claber más Cool
  • Premio Cristalab al claber más Experimentado (A nivel de conocimientos técnicos)



Premios



Todos los clabers que resulten premiados ganarán:

  • Una plaquita dorada que podrán lucir en su perfil de usuario durante un año.
  • +100 clabLevel
  • La satisfacción de ganarle a otros clabers y sentir su corrosiva envidia.


Votación



Para votar, sólo envía un comentario en este mismo artículo con tus elegidos.

Por favor, vota por un solo claber en cada categoría. Puedes repetir el mismo claber en varios premios si así lo deseas.

Las votaciones se cerrarán el miércoles 18 de enero de 2012. Los resultados se publicarán el 25 de enero de 2012.

¡Ya pueden empezar a votar por sus candidatos para los premios Cristalab!

Feliz octavo cumpleaños Cristalab

Nuestra grandiosa Cristalab cumple un año más online, lo cual nos recuerda que se nos va en este lugar otro año de vida sin poder escapar. Pero es gratificante pertenecer a una comunidad que evoluciona y continúa en crecimiento a lo largo de los años, sin importar la muerte de tecnologías o empresas.



Cristalab crece cada año de manera incontenible. Podemos prescindir de los agradecimientos a Freddie por crear Cristalab (lo único bueno que ha hecho en su vida), pero no podemos dejar de reconocer y agradecer el esfuerzo de todos ustedes que, como usuarios activos, hacen que la comunidad sea mejor cada año.

Como es habitual, para celebrar, he realizado este pastel de 8 pisos en representación de cada uno de los años cumplidos, todos llenos de aprendizaje y mucha diversión.



Canción: Cristalab la web amiga



Para esta ocasión, también he compuesto una breve canción que reúne la esencia de lo que es nuestra comunidad.



Sí, ya sé, la canción apesta, pero qué importa, pídele a Freddie una estrellita (sólo para fastidiarlo), sopla una vela, apedrea a alaguien y postea acá tus deseos, las cosas por las cuales estás agradecido de esta comunidad y lo que le regalarás por su cumpleaños.

Celebración en streaming



Hoy tendremos un streaming en vivo para celebrar con todos ustedes nuestro aniversario. Para asistir sólo debes entrar al home de Cristalab en estos horarios:


  • 6:30pm México D.F. y Centroamérica
  • 8:00pm Venezuela
  • 7:30pm Colombia, Perú, Ecuador
  • 8:30pm Bolivia
  • 9:30pm Chile, Argentina y Paraguay
  • 10:30pm Uruguay, Brasil
  • 1:30am España (perdón...)


Sólo necesitas entrar en tu navegador a Cristalab.com a la hora de la transmisión y podrás ver en vivo nuestra celebración del cumpleaños. Gracias a todos por estos ocho años.

¡¡¡Larga vida a Cristalab!!!. Por el Imperio!!!!

Este miercoles celebraremos el 8o cumpleaños de Cristalab

Hace ocho años, iniciando el 2004, empezó una idea que hoy es una de las más grandes comunidades de gente dedicada a crear en la web. Cristalab nació para alojar las ideas, experimentos ("lab") y tutoriales de todos los que arrancabamos aprendiendo lo básico de CSS, maquetación, interactividad y sobre todo, Flash.

El mundo ha cambiado. El 2012 es una epoca donde la gente habla de diseño que responde al dispositivo. De CSS3 y HTML5. De Canvas, SVG, Python y Node.js. De medios sociales y aplicaciones móviles. De nubes de muchos tipos. De backend, frontend, UX, Q&A, patrones de diseño, control atómico de versiones, tipografías web, eventos "touch" y la muerte de las cosas que amabamos.


Este miercoles, cumpleaños de nuestra comunidad en streaming


Cristalab sin embargo mantiene su proposito: Enseñar y compartir con la gente que construye Internet. Sean diseñadores, programadores, novatos, expertos, jefes, empleados, arquitectos o abogados. Desde un iMac de 200 pulgadas o desde un netbook lleno de torrents.

Por eso te invitamos a nuestro cumpleaños, este miércoles 11 de enero. Haremos un streaming en vivo donde lo único que tienes que hacer es entrar al home de Cristalab. En estos horarios:

  • 6:30pm México D.F. y Centroamérica
  • 8:00pm Venezuela
  • 7:30pm Colombia, Perú, Ecuador
  • 8:30pm Bolivia
  • 9:30pm Chile, Argentina y Paraguay
  • 10:30pm Uruguay, Brasil
  • 1:30am España (perdón...)

Sólo necesitas entrar en tu navegador a Cristalab.com a la hora de la transmisión y podrás ver en vivo nuestra celebración del cumpleaños de Cristalab. Gracias a todos por estos ocho años :)

Consejos para crear videotutoriales eficaces

Los videotutoriales abundan en la web. Todos hacen videotutoriales ahora, incluso se producen en mayor cantidad que el tutorial escrito. Pero no todos tienen la calidad deseada, no por el contenido en sí, sino porque no logran una buena producción de video.

Seamos honestos, ¿quién mira un videotutorial de 30 o 45 minutos?, algunos llegan a durar una hora o más. Aquí veremos algunos errores frecuentes y consejos para crear videotutoriales más eficaces.





Los errores más comunes




  • Videotutoriales extremadamente largos de más de 30 minutos: algunos llegan a durar 45 minutos o más. Son muy pocas las veces que el usuario los mira hasta el final siendo tan largos.

  • Mover como locos el mouse en la explicación: el usuario presta atención al movimiento del mouse porque eso lo guía en lo que el locutor está explicando. Mover excesivamente el mouse como una especie de tic es enfermante y confunde al usuario.

  • Dejar abiertos el msn, skype, twitter, y demás ventanas emergentes en el momento de la grabación: las ventanas emergentes sacan al usuario de la clase que están atendiendo. Además a tus contactos no les causará gracia ver sus mensajes grabados y distribuidos por toda la Web.

  • Dejar música de fondo: Es muy molesto no poder escuchar con tranquilidad lo que el locutor está explicando.

  • Escritorios desordenados: en serio, esos escritorios llenos de íconos con fondo de pantallas de tipas en paños menores.... :lol: Mostrar tu escritorio de esa manera es un bochorno, resta seriedad y es poco cuidado para con el usuario que debe mirarlo. Presenta tu contenido en un ambiente claro, ordenado y despejado.



Para tener en cuenta




  • Un videotutorial no es un Vlog: Evita comentarios que hablen del “hoy” y el “mañana”, ya que el contenido en la web es atemporal. Todo lo que no acontezca al tema que estamos presentando en sí está de más.

  • Un videotutorial es imagen en movimiento: estar mucho tiempo hablando con la pantalla estática es desaprovechar las oportunidades propias del medio. Si vas a dar una explicación extensa, ayúdate con pantallas tipo presentación, con ítems que vayan resaltando y guiando el tema que estás explicando.


En serio, si das mucho contenido teórico es mejor escribirlo antes que dormir al usuario con 20 minutos de palabra hablada sobre una pantalla estática.


Algunos consejos para crear videotutoriales eficaces





Estamos viviendo el auge de los micro-formatos y el exceso de información, por lo que un videotutorial muy largo no es una buena opción en estos momentos.


Habla claro, conciso y que se escuche con calidad


Evita tartamudear y las pausas muy extensas, y si hablar no es lo tuyo, escribe un tutorial.
Usa un buen micrófono!!! Si haces videotutoriales y el audio no es bueno, es un FAIL total. Haces que el usuario suba al tope los parlantes generando que los sonidos de su PC lo asusten al sonar tan fuerte.


Resume


No debes explicar el origen de la rueda, su historia y evolución para enseñar a pintar un auto. Eso lleva mucho tiempo, un videotutorial no debe ser muy largo porque agota al usuario. Es muy útil tener material ya preparado para usar, como en los programas de cocina, que te explican el preparado de algunas cosas; otras ya están listas y sólo las agregan a la preparación.


Planifica


En los videotutoriales de diseño ocurre que para explicar un efecto hacen un proceso muy extenso: por ejemplo hacer una web desde cero y al final, 20 minutos después, le aplican el efecto del cual se trata el tutorial.
No es necesario grabar el proceso entero. Un videotutorial puede resumirse a 5 minutos si sólo presentamos el diseño en el cual trabajar y la explicación del efecto en sí.

Edita, corta y aplica la cámara rápida: en resumen, haz montaje de tu contenido.


Prepara tu material


Puede ocurrir que no encuentres una imagen, una capa, que un código de error, etc. Todos esos elementos deberían prepararse antes de comenzar la grabación. Si estás escribiendo código, ten una copia impresa o visualizada desde otro monitor, así evitas el error en el video. Eso se permite más en un livestream que en un videotutorial.


Innova


Pensar que ya todo está hecho y explicado sería el fin de la web colaborativa porque se dejaría de crear contenido. Busca innovar creando un punto de vista alternativo al tema, que sea fresco y vaya con las tendencias del momento.

y por último, es el videotutorial el mejor medio para eso que quiero explicar?

La Web es el paraíso del conocimiento para los autodidactas. Aquí podemos aprender en línea y colaborativamente. Con el material específico y de buena calidad podemos transmitir nuestro conocimiento al otro de manera más eficaz, logramos mejorar nuestro perfil profesional en la Web, logramos atraer visitas a nuestros sitios y generaremos más suscripciones en nuestros canales en youtube y demás redes…

Aporta a una web mejor: genera contenido de calidad :)

credito imagen

« Ver más nuevos 1 2 3 4 5 ... 101 Ver más viejos »