Tutset, selección de tutoriales para aprender diseño y desarrollo web

Hay muchí­simos recursos y plataformas que pueden recurrir aquellos interesados en dar sus primeros pasos en diseño y desarrollo web o mejorar sus habilidades.

Para no se sentirnos abrumados con tanta información, hay iniciativas como Tutset que permiten concentrarnos en aquellos contenidos que se adapten a nuestras necesidades.

Si damos un recorrido por Tutset, veremos que organiza tutoriales online en diferentes categorí­as. Por ejemplo, tenemos “Web Fundamentals” para aquellos que recién se inician en el desarrollo web, con una serie de tutoriales de diferentes plataformas.

Tutset

Si preferimos recursos que nos guí­en para crear páginas web, podemos ir “Frontend Development”, que nos mostrará tutoriales sobre HTML, CSS y JavaScript.  Encontraremos tutoriales para principiantes, para aquellos que quieren poner a prueba sus conocimientos, así­ como recursos más avanzados.

Hay recursos tomados de Codecademy, Udacity, Treehouse, Khan Academy, W3schools, entre otras plataformas. En cada una de las sugerencias se nos dirá el tipo de recurso que se ofrece, si es un libro, video, si es de pago, etc. Solo tenemos que decidir si es lo que estamos buscando según nuestros conocimientos.

No es necesario registrarse, ni crear ninguna cuenta para ver los tutoriales que se sugieren. Solo dar un recorrido por las diferentes opciones y estar pendientes de los nuevos tutoriales y categorí­as que se vayan sumando.

WixEd, cursos gratuitos de Wix para profesionales de diseño web

WiEdUna nueva propuesta educativa pensada para aquellos usuarios que desean iniciarse como trabajadores independientes en diseño web: WixEd.

Es una iniciativa de Wix, plataforma que nos permite crear sitios web personalizados, que ha diseñado un programa de cursos online gratuitos para ayudar a los usuarios potenciar su negocio de diseño web.

Además, de tener una sección dedicada a conocer las caracterí­sticas de Wix, también hay clases dedicadas a guiar a los freelance a desarrollar su negocio aplicando diferentes estrategias, desde la gestión de los clientes, marketing online hasta cómo llegar el control de nuestra carrera.

Por ejemplo, veremos cómo conseguir nuevos clientes y cómo educarlos para que valoren el potencial de tener presencia en la web mediante diferentes propuestas que se ajusten a sus necesidades.

WixEd

También hay clases para ayudar a los usuarios a ser productivos en su negocio de diseño web, teniendo en cuenta diferentes tips. Y por supuesto, también se ha tenido en cuenta detalles relacionados con la estimación de precios en los trabajos y cómo controlar el presupuesto.

Para participar de este programa de entrenamiento, solo tenemos que crearnos una cuenta y escoger la clase de nuestro interés. A medida que vamos avanzando en las clases recibiremos badges y diferentes recompensas, así­ como un certificado al terminar todo el curso.

Palettab, para descubrir paletas de colores y fuentes para nuestros proyectos

Palettab es una extensión para Chrome que nos sugiere una serie de paletas de colores y fuentes en la nueva pestaña del navegador.

Podemos tomar nota de la paleta entera o considerar los colores que mejor se ajustan a nuestro proyecto.

Palettab

En cada tarjeta de color tendremos el valor del color que podemos copiar automáticamente al posicionar el mouse, además de dirigimos a Google Fonts para visualizar la fuente sugerida.

Si deseamos tener más detalle de la paleta nos dirigirá a la comunidad de COLOURlovers, donde podremos ver los comentarios de la comunidad, así­ como su popularidad entre los miembros. Además nos permitirá crear un patrón basándonos en los colores de la paleta.

Es una extensión simple que puede servir como fuente de inspiración al trabajar en proyectos creativos, además de mostrarnos las interesantes caracterí­sticas de COLOURlovers.

Otras herramientas gratuitas que pueden tener en cuenta aquellos que trabajen en diseño web son las  que compartimos en el artí­culo Extensiones Chrome para diseñadores web.

¿Qué tipografí­as elijo para mi próximo proyecto web? 5 herramientas de recomendaciones para ayudarte con ello

Echamos hoy un vistazo a brillantes opciones online que seguramente servirán a muchos en la búsqueda de la respuesta a una de las más difí­ciles decisiones a la hora de trabajar en el diseño de un nuevo proyecto web: Sus tipografí­as, el combo de fuentes que le harán relucir. Pues bien, para la tarea repasamos las recomendaciones de un hilo en Reddit y algunas que ya habí­amos tenido oportunidad de reseñar, en todo caso, espacios perfectos tanto para quienes tienen una idea inicial como para quienes no saben por dónde empezar. Un detalle extra: Si deseas ayuda con el texto de relleno en tus pruebas, no olvides estas alternativas al Lorem ipsum.

Type Genius

typegenius
Selecciona una de las elegantes fuentes dentro del menú principal de Type Genius, pulsa en View Matches y enseguida tendrás varias recomendaciones de tipografí­as que irí­an bien con ella, además, como muestra, algunos ejemplos de texto de relleno -similar al Lorem Ipsum- y sitios web que ya ocupan dichas combinaciones. Ojo a la parte inferior de Type Genius pues, aunque casi imperceptibles, están los botones para cambiar entre las webs de ejemplo a modo de presentación.

Fonts in use

fonts in use
En Fonts in use pueden encontrarse cientos de ejemplos de combinaciones presentes tanto en sitios web como en publicaciones fí­sicas, en particular, libros, revistas, pelí­culas y anuncios publicitarios. Aunque las vistas previas recogen detalles rápidos de las fuentes consignadas en cada ejemplo, lo más recomendado, además del buscador, es valerse de los tres filtros que le componen para iniciar las consultas: Industries (negocios, arte, noticias, música, deportes, etc.), Formats (publicidad, infografí­as, revistas, diarios, software, móviles, etc.) y Typefaces.

Typewolf

Typewolf
Otro escaparate de sitios web que logran destacar por sus muy bien escogidas combinaciones de tipografí­as, eso sí­, Typewolf es mucho más personal que las anteriores opciones así­ que además de las selecciones generales podremos encontrar artí­culos especializados, rankings y recomendaciones subjetivas, muy valiosas valga decir, que su respectivo autor comparte frecuentemente.

Fontface Ninja y WhatFont

Fontface Ninja
Y finalmente un par de herramientas con las que podremos conocer rápidamente qué tipografí­as utiliza determinado sitio web que nos haya llamado la atención. Nombre, Font family, Font Size, Line Height y Line Spacing, y en ocasiones hasta el lugar donde pueden conseguirse, se incluyen en los detalles presentados.

Vale destacar que Fontface Ninja además de como bookmarklet está disponible en forma de extensión para Google Chrome y Safari, y WhatFont solo funciona en Chrome. Por cierto, para identificar fuentes de texto en publicaciones fí­sicas no sobra recomendar al siempre útil WhatTheFont!, un servicio online que se encargará de la detección con apenas cargar una imagen y/o captura de pantalla.

Dos interesantes recursos para recibir lecciones de diseño web por emails

En la web encontramos una selección impresionante de recursos para aprender sobre diseño web, como cursos, tutoriales, ebooks.

Pero a veces esos recursos quedan olvidados en nuestros marcadores o perdidos entre nuestra lectura pendiente. Una solución a ello, es tener en cuenta opciones como la que propone David Kadavy, autor de Design for Hackers .

Design for Hackers

Durante 12 semanas enviará una lección a nuestra dirección de correo electrónico, tomando algunos puntos principales de su libro, repasando todos sus capí­tulos. Si bien son breves, nos servirán para aprender algunos conceptos y tener en cuenta algunos tips al realizar nuestros proyectos.

Otra propuesta es Hack Design, que con la ayuda de diferentes diseñadores han creado un plan de estudio con contenido interactivo y diferentes herramientas de diseño.

Hack Design

Además de seguir el contenido en la plataforma, podemos recibir las 50 lecciones que componen el curso en nuestro correo.

En las dos opciones que hemos comentado solo necesitamos señalar nuestra dirección de correo electrónico y esperar las lecciones semanales. Y por supuesto, siempre contaremos con la opción de dar de baja la suscripción, si es que no se ajustan a nuestras expectativas.

Acámica lanza nuevos cursos y carreras completas sobre diseño y desarrollo web

acamicaHemos hablado en diferentes oportunidades de Acámica, una interesante plataforma educativa en español que sigue la filosofí­a de “aprender haciendo”.

Ahora nos sorprende con una nueva colección de cursos y la posibilidad de tomar carreras completas, pensando en las necesidades de los usuarios al brindar una formación online que les brinde nuevas oportunidades laborales.

AcámicaCon el nuevo diseño de la plataforma, cada usuario podrá evaluar qué cursos debe tomar de acuerdo a su nivel de conocimiento o sus metas profesionales.

Podremos afianzar nuestros conocimientos en determinados temas, complementar nuestra habilidades o centrar nuestros esfuerzos a una carrera.

Acámica

Por ejemplo, podemos optar por “Desarrollador web” o “Diseñador web”. Cada carrera nos sugiere una serie de cursos para comenzar desde cero, que podemos seguir a nuestro propio ritmo.

Un detalle interesante del nuevo modelo de Acámica, es que todo el contenido de la plataforma está disponible de manera gratuita, dando la posibilidad de realizar un curso completo (de nuestra elección) por mes.  Y aquellos que deseen avanzar más rápido, pueden optar por una suscripción mensual abonando un pequeño monto.

Además de la formación online, también formaremos parte de una comunidad que comparte nuestros intereses y un perfil visible para empresas del sector, dándonos la posibilidad de crear nuevos contactos y oportunidades laborales.

TrackDuck – Nueva versión de esta herramienta para diseñadores y programadores web

Os hablamos de TrackDuck (trackduck.com) en enero como una herramienta que puede ayudar a los diseñadores y programadores de aplicaciones web a definir tareas “pintando” encima del sitio que están construyendo.

Una vez creada la cuenta y subidos los trabajos, hay que marcar la zona que queremos comentar (encima del diseño), permitiendo comenzar una discusión sobre detalles de la aplicación que se está creando.

Nos presentan ahora una nueva versión, ya en español, que se integra con mayores y mejores herramientas PM y CMS. En su web vemos las caracterí­sticas principales:

Se integra ahora con JIRA, donde va a ser posible sincronizar los proyectos de TrackDuck con dicha plataforma; con Pivotal Tracker; con StartHQ , donde se podrá buscar comentarios o cuestiones de TrackDuck mediante el buscador de esta aplicación; con Trello, donde se podrá sincronizar proyectos; con Hipchat y Slack, para una mejor comunicación y mejor desarrollo; con Basecamp; con Flowdock; con Intercom… al mismo tiempo presentan extensiones Google Chrome, Safari, Firefox y Bookmarklet, así­ como con WordPress y ModX.

Ahora están trabajando para integrarse con Zendesk, Github y Asana.

El primer proyecto creado es gratuito para siempre, por lo que podéis crear una cuenta hoy mismo para probarlo.

Udacity anuncia 4 nuevos cursos en colaboración con Google y su aplicación para Android

udacity

El equipo de Udacity anuncia una serie de nuevos cursos sobre desarrollo y diseño web, creados e impartidos por expertos de Google.

Por ejemplo, tenemos Developing Android Apps donde veremos los fundamentos de Android para construir aplicaciones de la manera adecuada y que brindan una excelente experiencia al usuario. Otra propuesta es Developing Scalable Apps que entre otros temas nos ayudará a ver todo el potencial de Google App Engine, analizando su funcionamiento y caracterí­sticas.

Por otra parte, Website Performance Optimization nos ayudará a desarrollar habilidades que nos ayuden a mejorar el rendimiento de nuestro sitio web. Y UX Design for Mobile Developers que analizar las técnicas que utilizan grandes diseñadores en sus proyectos.

No todos los cursos no son gratuitos, sino que forman parte del programa de aprendizaje continuo de Udacity. Pero veremos que tiene una opción para acceder a ciertos contenidos de manera gratuita.

Y otras de las novedades es su aplicación para Android donde tendremos algunas de las opciones que encontramos en la versión web, permitiéndonos acceder a los contenidos. Y con la promesa de ofrecer la posibilidad de utilizarla de modo offline.

udacity

Excelentes noticias para aquellos que apuestan a su formación online, ya que se abren nuevas propuestas que podemos seguir desde la comodidad de nuestro móvil.

Oozled, más de 600 recursos para diseño y desarrollo web

Oozled nació de la iniciativa de Dan Edwards al compartir una colección personal de recursos sobre diseño web con sus alumnos de la Universidad.

Pero la lista se hizo tan popular que dio lugar a un espacio colaborativo para compartir recursos gratuitos y de pago, organizados en diferentes colecciones.

oozled

Por ejemplo, podemos encontrar pack de iconos, recomendaciones de diseños para inspirarnos, recursos para encontrar la tipografí­a perfecta para nuestro proyecto, colecciones de archivos PSD, pinceles para Photoshop, entre otros.

También encontraremos guí­as, libros, videos, así­ como referencias a comunidades online para desarrollar nuevas habilidades y explorar nuevas ideas. Hay una sección dedicada a bolsas de trabajo donde encontraremos sugerencias de portales con noticias y oportunidades laborales para diseñadores freelance.

Son 42 las categorí­a que podemos recorrer y descubrir recursos que se ajusten a nuestras necesidades. Al crearnos una cuenta, nos permite crearnos un feed de las categorí­as que nos resultan interesantes para no perdernos ninguna actualización.

Y por supuesto, también podemos participar sugiriendo nuevos recursos y contribuir con la comunidad de Oozle.

Google lanza Web Starter Kit con el objetivo de facilitar el diseño web en múltiples dispositivos

Atrás ha quedado la época en la que navegábamos por Internet a través de únicamente nuestro ordenador, y es que, hoy en dí­a, accedemos a Internet y consultamos una gran cantidad de páginas webs distintas a través de smartphones, tablets, consolas, etc.  Por ello, los desarrolladores deben esforzarse en ofrecer una experiencia de usuario que tenga en cuenta las diferencias entre los diferentes dispositivos en lugar de crear un único diseño sin tener en consideración el dispositivo de acceso, ya que no es lo mismo interactuar con una página web en una pantalla de 3,5″ que en otra de 21,5″.

Con el fin de facilitar esta tarea, el gigante de la informática Google acaba de lanzar Web Starter Kit, una descarga que incluye todas las plantillas y herramientas que los desarrolladores de páginas web necesitan para crear sitios que se adapten a diferentes resoluciones y dispositivos, lo que en el mundo del diseño se conoce como diseño web adaptable o ‘responsive’. Gracias a esta herramienta, los desarrolladores podrán adaptar de una forma muy sencilla la interfaz de su web a diferentes dispositivos con el objetivo de que se vean perfectamente.

Esta iniciativa continúa con los esfuerzos de Google de enseñar las mejores prácticas en cuanto al diseño web moderno, algo a lo que se está dedicando desde hace un tiempo, ya que si echamos la vista atrás, recordaremos el servicio ‘Web Fundamentals’, una web que recoge las mejores técnicas en cuanto a diseño web.