Que es Creative Commons ?

Video  instructivo sobre que son las licencias Creative Commons y como funcionan del curso de emprendimiento http://aemprende.unimooc.com/

Es bueno saber de estas cosas por ejemplo yo no sabia que : "En la actualidad cualquier trabajo creativo adquiere automáticamente el copyright tras su creación, garantizando la autoría, y por tanto, la propiedad intelectual de dicha obra"

aqui el video 

Crear infografias online

Hoy en dia esta muy de moda crear infografias de todo tipo son una buenas forma de mostrar la informacion rapida y elegante , pero no cualquier puede hacerlas tan bonitas o no tenemos los conocimientos necesarios de diseño para crearlas.

Hoy he visto 2 servicios que pueden ayudarnos a crear infografias desde plantillas de manera facil y rapida al mismo tiempo que podemos compartir nuestra creacion .

1 ) http://www.easel.ly/

Muy facil e intuitivo pero mejor les dejo el video de presentacion


2) http://infogr.am/

Igual que el primero solo que con un poco mas interactiva donde el usuario puede hacer click en la infografia no tiene video de explicacion pero puede entrar a la web y ver dar un tour por el servicio.


Bueno a crear infografias que ya no esta tan dificil :) ...

Todo es un Remix

Hoy en dia leo mucho sobre noticias de como las compañias pelean entre si  por las patentes y alguna que otra registran patentes un tanto estupidas , como por ejemplo no hace mucho apple patento el efecto de pasar una pagina .

Hay muchas otra patentes muy vagas y con poco sentido comun que lo unico que logran es solo frenar la innovación , ya vimos no hace mucho como apple perdio su demanda contra samsung. por considerar que samsung  copiaba  la esencia cool de sus diseños.

Aparte de todo esto tenemos a las empresas de copyright haciendo cacería de brujas por todo el planeta y demandando a quien se ponga a en su camino , no hace mucho lei la historia de la niña de 9 años demandada por las estas empresas.

bueno con todo esto solo quiero hacer introducción a este documental sobre innovación que todo deberían ver esta muy bueno , toca punto muy importantes de lo que esta pasando en la actualidad

Algunas APIs Html 5 que talvez no conocias

La verdad que yo tampoco las conocía asi que aquí van :

1) Fullscreen API

La  API de pantalla completa nos permite ejecutar  el navegar en modo pantalla completa :

Tutorial : http://davidwalsh.name/fullscreen

2) Page Visibility API

Nos provee un evento que nos permite saber cuando un usuario mira una tab del navegador y también cuando se mueve a otra tab.

Tutorial : http://davidwalsh.name/page-visibility

3) getUserMedia API

Nos permite acceder a dispositivos multimedia  como por ejemplo las cámaras web.

Tutorial : http://davidwalsh.name/browser-camera

4) Battery API

Bueno no hay mucha explicación con esta es para acceder al estatus de la batería mas enfocado para uso en aplicaciones moviles

Tutorial : http://davidwalsh.name/battery-api

5) Link Prefetching

Nos permite pre cargar contenido web de manera silenciosa 

Tutorial : http://davidwalsh.name/html5-prefetch

Link : http://davidwalsh.name/more-html5-apis

6) File API

Trabajar con archivos siempre habia sido algo exclusivo del lado del servidor por ahora ya no mas , ahora podemos crear , leer y modificar archivos en el navegador .

Tutorial : http://advent2012.digitpaint.nl/12/

 7) Subrayado adicional

EL subrayado de texto fue muy simple hasta ahora

Tutorial : http://advent2012.digitpaint.nl/11/

8) EventSource

Las aplicaciones en tiempo real estan muy de moda y desarrollarlas lo mas usado es usar websocket o framework tipo sockets IO y algunas veces NODE.JS del lado del srevidor, bueno ahora podemos hacer lo mismo con solo 5 lineas de codigo sobre el estandar HTTP

Tutorial : http://advent2012.digitpaint.nl/2/

9) Notifications web

Si has usado gmail seguramente has notado que si no tienes el navegador abierto y estas haciendo otra cosa y alguien te chatea se abre una ventanita de lado derecho notificandote sobre el evento.. pues asi se hace

Tutorial : http://advent2012.digitpaint.nl/1/


Link : http://advent2012.digitpaint.nl/

Herramientas utiles para crear paginas web

 elementos UI 

1)  Elementos para UI :  http://ui-cloud.com/
2) Búsqueda de componentes : http://www.uibox.in/
3)  UI : http://www.agiledesigners.com/
4) Colección de menús , iconos , toolbars , etc listo para usar : http://www.bypeople.com/
5)  Que tus inputs sean hermosos : http://dropthebit.com/demos/fancy_input/fancyInput.html
6) Bonitos efectos hover : http://tympanus.net/codrops/2013/06/18/caption-hover-effects/
7) Responsive email para tus usuarios : http://www.zurb.com/playground/responsive-email-templates
8)  Mapa mundial vectorizado en muchos formatos y presentaciones : http://www.webresourcesdepot.com/all-free-vector-world-maps-ai-eps-svg/

Galeria de patrones de diseño

1) Para buscar inspiración : http://niice.co/

2) Excelente pagina donde explorar patrones de diseños móviles : http://www.mobile-patterns.com/ 

3) http://pttrns.com/categories/5-photos

4) http://inspired-ui.com/
5) Guia oficial Apple : https://developer.apple.com/design/
6) Guia oficial Android : https://developer.android.com/design/building-blocks/index.html

Guia de UI

1)  Como diseñar buenas landing pages : http://nathanbarry.com/step-by-step-landing-page-copywriting/

2)  Buenas UI para Buenos Conversion Rates : http://www.goodui.org/

Generadores de datos de pruebas

1) Usuarios random : http://randomuser.me/
2)  Imágenes de prueba : http://placehold.it/ , http://lorempixel.com/ , http://flickholdr.com/
3) Datos : http://chancejs.com/ , http://www.generatedata.com/
4) generador de avatares : http://avatars.io/

Botones de redes sociales para compartir contenido

1) Agrega social media a tu web: https://www.addthis.com/

Javacript

1) Bonito Script javascript para hacer toolbars  http://paulkinzett.github.com/toolbar/

2) Bonito calendario html 5 con un estilo visual excelente : http://tympanus.net/codrops/2012/11/27/calendario-a-flexible-calendar-plugin/

3)  Script JS para el formateo de numero : http://numeraljs.com/

4)  Dibuja gráficos estadísticos en el navegador de manera sencilla :http://prag.ma/code/sparky/

5)  Plugin para galera de fotos , acomoda todas tus fotos dentro de un contener : http://ed-lea.github.io/jquery-collagePlus/

6)Bonitos efectos para ventanas modal : http://tympanus.net/Development/ModalWindowEffects/

7)  galeria de plugin jquery : http://www.unheap.com/

8) Libreria Javascript para trabajar con fechas y horarios recurrentes : http://bunkat.github.io/later/ y http://momentjs.com/

9)  Bonito plugin loader javascript : http://ricostacruz.com/nprogress/ , http://tympanus.net/Development/CreativeLoadingEffects/

10) Para crear Interfaces editables : http://jakiestfu.github.io/Medium.js/docs/

11) Base de datos con todas las librerias javascript disponibles : http://www.jsdb.io/?sort=trending

12) Menu como paneles estilo jquerymobile pero mas bonitos :  http://multi-level-push-menu.make.rs/

13) zoom en imagenes : http://mark-rolich.github.io/Magnifier.js/

14) mensajes popup bonitos para formularios : http://codeseven.github.io/toastr/demo.html 

15) Estilo de overlay : http://tympanus.net/Development/FullscreenOverlayStyles/index12.html

16) botones submit con progreso incluido: http://tympanus.net/Development/ProgressButtonStyles/

Responsive images ya era hora !!

Con la llegada de HTML 5 , llego el responsive design como resultado nuestra aplicacion web puede adaptarse a la resolucion de cualquier dispositivo y entregar al usuario una agradable experiencia de navegacion.

Para manejar las imagenes en un diseño responsive usamos los nuevos poderes de CSS 3 y las media queries para seleccionar que imagenes deben cargar deacuerdo con la resolucion del dispositivo. Pero una vez escuche a un tipo decir que deberia de haber un servicio de responsive images osea en lugar de usar css o media queries , tu deberias de subir tu imagen full HD una sola vez y luego tu aplicacion hace la peticion  que necesita esa imagen y el servicio decuerdo a la resolucion del dispositivo te entrega tu imagen redimensionada con las dimensiones necesarias .

Esto te permite ahorrar velocidad de carga en tu aplicacion y siempre tener la imagen adecuada segun la resolucion que necesite tu visitante , bueno esa fue la historia que escuche hace como 5 meses atras y siempre me estuvo dando vueltas en la cabeza .

Hasta hoy por que he encontrado un plugin Jquery que cumple con este objetivo , dotar a tu aplicacion con responsive images , aunque segun la web por ahora usa PHP para hacer las redimensiones de tu imagenes , seguro que en futuro se extendera. Segun la web del plugin dicen que el script PHP crea la imagen que solicitada al vuelo solo la primera vez .

Les dejo el link del plugin para que hagan sus pruebas , en el futuro mas herramientas como estan en camino.

link : http://responsiveimg.com/ 

Como desaparecer de internet ( intento )

Es tan grande la información personal que entregamos a los sitios web o servicios que usamos que saben prácticamente todo sobre nosotros , por ejemplo si tienes una cuenta google donde todos sus servicios estan enlazados a una sola cuenta , google sabe todo sobre ti que te gusta , que buscas , que video vistes , tus correos , etc.

Hoy voy a explicar 2 pasos muy basicos para intentar desparecer de internet ... bueno digo intentar por que este método no es 100 % seguro aunque si puedes eliminar la gran parte.

1) Elimina tu cuentas de las redes sociales

Elimina tus cuentas de todo los sitios de redes sociales donde hayas usado tu nombre real , ya se google + , facebook , twitter , etc.

Para facebook puedes entrar en este link  , puede tardar uos 14 dias todos tus datos donde fuistes etiquetado seran eliminados aunque algunas fotos pueden quedar dando vueltas por ahi.

Para twitter entra aqui y clickea en desactivar mi cuenta tambien tomara algun tiempo borrado.

LinkedIn ve a tus settings a la seccion de tu cuenta y le das click en cerra cuenta.

Con google  es un poco mas complicado por que estan muchos servicios enlazados entre si y todos esos servicios seran cerrados. entra al siguiente link y le das click en "cerrar cuenta " y todos tus servicios seran cerrados . Si solo quieres cerrar tu cuenta en google + puedes entrar aqui  y selecciona "Eliminar el contenido de Google+"  los demas  servicios de google estaran todavia disponibles.

Si  perteneces a otras redes sociales tienes que cerrarlas tambien , foros o cualquier otro servicio donde hayas usado tu nombre real. Existe una pagina con una lista de links de casi todo los servicios conocidos en internet de como cerrar sus cuentas puedes visitar la pagina aqui

2) Retirar los resultados de las búsquedas

Aunque elimines tus cuentas de las redes sociales , todavía puede haber contenido relacionado contigo ya sean fotos , artículos , temas en algunos  foros, ect.  lo mejor que puedes hacer es una busqueda rapida en google con tu nombre real y anotar los link de las paginas donde aparezca información relacionada contigo.

Con esta informacion lo unico que puedes hacer es contactar via email a los administradores de estas web y pedirle que retiren el contenido relacionado contigo o al menos tu nombre real. El siguiente paso seria contactar a los buscadores como google , yahoo ,bing , ect y pedirles que retiren el contenido de sus resultados de busquedas para esto tienes que llenar un formulario que los buscadores ofrecen a los usuarios  aunque no es seguro que te hagan caso pero lo menos puedes intentarlo.

Por ahora hicimos el intento de eliminar lo mas que pudimos de nuestros datos en interent usando lo mas basico , pero si quieres mantenerte en el anonimato debes alejarte de los redes sociales y deja de usar tu nombre real.

Hay una pagina para crear datos falsos aleatoria mente y usarlos donde quieras de esta manera  mantener siempre tu identidad oculta aqui el link.

Otra forma de mantener tu anonimato en internet es usar direcciones de correo temporales , existen servicios que te permiten crear un  correo electrónico temporalmente y escoger el tiempo de duración del correo temporal , algunos de estos son :

1.   spambox 
2. https://meltmail.com/
3. http://10minutemail.com/10MinuteMail/index.html

Link: http://lifehacker.com/5958801/how-to-commit-internet-suicide-and-disappear-from-the-web-forever

Libro para crear apps en windows 8

Recientemente Microsoft lanzo su nuevo sistema operativo windows 8 y con el Windows Store para las apps y para ayudar a los miles de programadores en el mundo a  crear Apps para el nuevo sistema operativo pone a nuestro alcance un libro de programacion de apps para windows 8 con html , javascript y css.

Si como lo lees completamente gratis !!! Microsoft quiere que windows store sea un exito total y para ello necesita apps y que mejor forma de hacerlo que entregandonos las herramientas necesarias a los programadores.

El libro fue escrito por Kraig Brockschmidt  y comprende temas como notificaciones , tareas en segundo plano , componentes , localizacion  , dispositivos , redes , y mucho mas ... no podria estar mas completo con 17 capitulos y un total de 800 paginas para tu lectura.

Puedes descargar el libro aqui : http://go.microsoft.com/FWLink/?Linkid=270056
y el contenido adicional del libro aqui : http://go.microsoft.com/FWLink/?Linkid=270057

A programar se ha dicho !!!

link : http://blogs.msdn.com/b/microsoft_press/archive/2012/10/29/free-ebook-programming-windows-8-apps-with-html-css-and-javascript.aspx

Revista Hackers & Developers Magazine

Dando vueltas por la red encuentro esta nueva revista llamada Hackers & Developers Magazine  una revista sobre Software Libre, Hacking y Programación .

Me he bajado la revista para leerla y los articulos son muy interesantes , estan muy bien redactados y trae ejemplos de codigo que puedes reutilizar en tus proyectos.

Una buena iniciativa que a mi parecer han comenzando con el pie derecho recomiendo que se la bajen y la lean no se van arrepentir.  Pero lo que mas me ha gustado de la revista ademas de su contenido son las personas que se encuentran detras del proyecto. Son 8 mujeres profesionales en diferentes ramas pero las une este unico proyecto.

Me sorprende no por que sean mujeres sino por que es dificil conocer (por lo menos para mi) mujeres que les gusta la programacion y  el diseño web. Como anecdota puedo contar que en mi trabajo estaban en busca de programadores web y ninguna mujer llego a la entrevista.

El staff de la revista es el siguente :

• Celia Cintas Licenciada en Informática http://yetanotherlog.wordpress.com
• Eugenia Bahit Arquitecta GLAMP & Agile Coach http://www.eugeniabahit.com/
• Eliana Caraballo Ingeniera de Sistemas http://co.linkedin.com/in/elianacaraballoa
• Filly Programadora http://www.missfilly.com.ar
• Indira Burga Ingeniera de Sistemas http://about.me/indirabm
• Milagros Infante Est. Ingeniería de Sistemas http://www.milale.net/
• Sorey Garcia Arquitecta de Software http://soreygarcia.com
• Yecely Diaz Maestra en Inteligencia Artificial http://silvercorp.wordpress.com

link: http://www.hdmagazine.org/

Comparativa de css framwork web

Por que de solo bootstrap no se  vive  ...encontre una web donde hacen una buena comparativa entre distintos frameworks css para crear proyectos web de manera rapida.

Ahora solo falta que escojas uno y te pongas a trabajar.

link : http://responsive.vermilion.com/compare.php

Coleccion de iconos gestuales para moviles

Encontre una excelente colección de iconos gestuales que puedes usar en tus proyectos de manera gratuita .

link: http://www.mobiletuxedo.com/touch-gesture-icons/

phpconsole una mejor manera de trabajar tu codigo php/js

Cuando estas programando una aplicación en php y haces llamados a scripts php con ajax siempre en tu ambiente de desarrollo quieres confirmar que datos estas recibiendo desde el script , entonces con javascript usamos el recontra conocido console.log.

Con el siempre podemos revisar en el modo console de Chrome por ejemplo los datos que esta devolviendo nuestro script php.  Del lado del script php imprimimos los datos con echo  o print_r para ver por ejemplo un arreglo o algun objeto Json.

Hoy encontre una herramienta para php llamada phpconsole con la cual podemos sustituir los "echo" y los "print_r" la diferencia es que con phpconsole obtendremos mas informacion sobre los datos que estamos devolviendo y con formato para una mejor visualización de  funciones , arreglos y JSON. Todo esto sin interrumpir la captura de datos del lado del servidor con ajax.

por ejemplo : 

Una salida normal de un script php que devuelve un JSON sin que sea parseado en javascript se vera de esta manera :

{"user":{"id":12345,"login":"peter","password":"secret","is_admin":true, "assigned_to_pages":[{"id":9134,"name":"Page 1","value":"Lorem ipsum facilisis non nulla scelerisque tempor nostra malesuada nunc pretium egestas rutrum, nulla accumsan nostra semper etiam ligula lorem risus id molestie magna porttitor.","tags":["tag1","tag2","tag3"]},{"id":4898,"name":"Page 2","value":"Potenti integer vestibulum fames imperdiet cras maecenas lobortis morbi.","tags":["tag4","tag5","tag6"]}]"created_at":"2011-01-01 12:00:00","updated_at":"2011-01-01 12:00:00"}}

Con phpconsole se veria de esta manera : 


[Received at 13:30:04 on 3rd June 2012]
[File: /public_html/system/helpers/email.php]
[Line: 987]
[Address: http://phpconsole.com/actions/email/send]

{
    "user" : {
        "id" : 12345,
        "login" : "peter",
        "password" : "secret",
        "is_admin" : true,
        "assigned_to_pages" : [
            {
                "id" : 9134,
                "name" : "Page 1",
                "value" : "Lorem ipsum facilisis non nulla scelerisque tempor nostra malesuada nunc pretium egestas rutrum, nulla accumsan nostra semper etiam ligula lorem risus id molestie magna porttitor.",
                "tags" : [
                    "tag1",
                    "tag2",
                    "tag3"
                ]
            },
            {
                "id" : 4898,
                "name" : "Page 2",
                "value" : "Potenti integer vestibulum fames imperdiet cras maecenas lobortis morbi.",
                "tags" : [
                    "tag4",
                    "tag5",
                    "tag6"
                ]
            }
        ]
        "created_at" : "2011-01-01 12:00:00",
        "updated_at" : "2011-01-01 12:00:00"
    }
}


Muy buena herramienta que ayudar a depurar mejor los datos del lado del servidor .

link: http://phpconsole.com/

Consejos para que Apple no rechace tu app

El proceso  para que una app sea aceptada por apple es descrito por algunos como un proceso al estilo NAZI debido a que apple puede rechazar tu app basado en estandares muy estrictos que en cada actualizacion de IOS son modificados.

PhoneGap es una herramienta de Abode muy util para empaquetar tu aplicacion web segun los estandares HTML 5  web y pueda correr en dispositvos moviles como android , windows phone , iphone , ect.

EL problema aqui es que muchas personas creen que por usar phonegap para empaquetar su aplicacion esta sera admitida por apple pero esto no es asi y no es culpa de phonegap . Phonegap hace muy bien su trabajo empaquetando tu aplicacion segun los estandares HTML 5 , pero a lo mejor tu  diseño de la interfaz de usuario no es la ideal segun apple. Apple tiene reglas muy estrictas y lineamientos que debemos seguir para que nuestra app no sea rechazada.

Apple puede  rechazar las app por:

Que la interfaz de usuario no se sienta como una "app".
Que  no se sienta parte del  ecosistema IOS.
Que no ofrezca una diferencia de la experiencia web movil.

Si quieres mas informacion de los lineamientos de apple sobre como deberian de ser tus app  puedes visitar estos enlaces :

1. https://developer.apple.com/appstore/guidelines.html 
2. http://developer.apple.com/library/ios/navigation/ 
3. http://developer.apple.com/library/ios/#DOCUMENTATION/UserExperience/Conceptual/MobileHIG/AppDesign/AppDesign.html 

En estos link podras encontrar mucha informacion de lo que es aceptable y no es aceptable por apple.Tengan muy encuenta este parrafo que se encuentra en la documentacion:

"Reconsidera el diseño basado en web , tienes que asegurarte que entregas a las personas una experiencia de una app IOS y no una experiencia web , recuerda que las personas pueden visitar tu sitio web usando Safari en IOS."

Tambien debemos considerar estos puntos por los cuales pueden rechazar tu app:

1. Las apps que no son muy utiles y unicas  son simplemente  sitios web agrupados como una app  o no entreguen algun valor  pueden ser rechazas.
2. Las apps que no usen elementos del sistema como botones e iconos correctamente segun la documentacion de apple pueden ser rechados.
3. Apps que simeplemente son fragmentos de paginas web  ,contenidos agregados  o colecciones de link pueden ser rechazadas. 
4. Si tu app es solo un empaquetado de un sitio web usando Phonegap .
5. Si tu app requiere hacer zoom para ver algun contenido. 
6. Si tu app solo tiene texto y links puede sera rechazada.

Cada app es evaluada individualmente por su propio merito , funcionalidad y experiencia de usuario , hay que seguir la documentacion de los link de arriba y hay que recordar que esos documentos cambian con cada version de IOS.

Tambien puede ayudar que analices otras aplicaciones que han sido aprobadas por apple y ver en que puedes mejorar tu app ,  existen numerosos recursos en internet para que puedas ayudarte en como puedes diseñar tu interfaz de una manera limpia e intuitiva por ejemplo :

1. http://www.mobile-patterns.com/
2. http://inspired-ui.com/
3. http://pttrns.com/

Y algunos Frameworks que te pueden ayudar a crear tu interfaz mas rapido :

1. http://twitter.github.com/bootstrap/
2. http://www.iui-js.org/ 
3. http://jquerymobile.com/
4. http://www.sencha.com/products/touch/ 
5. http://demos.kendoui.com/ 
6. http://foundation.zurb.com/ 
7. http://dojotoolkit.org/features/mobile 

Y por ultimo no esta de mas decirlo pon mucha atencion al rendimiento de tu app.

Link : http://www.adobe.com/devnet/phonegap/articles/creating-apps-with-phonegap-lessons.html