Nuevas herramientas para el diseño y desarrollo web: noviembre de 2012

Autor: John Stephens
Fecha De Creación: 25 Enero 2021
Fecha De Actualización: 12 Mayo 2024
Anonim
Nuevas profesiones: Web - Web analyst / Usabilidad
Video: Nuevas profesiones: Web - Web analyst / Usabilidad

Contenido

Este mes tiene un toque muy pragmático. Muchas aplicaciones de resolución de problemas. Si fueran herramientas de carpintero, serían los pequeños interesantes que aparecen fuera de su alcance en una silueta propia encima y detrás del banco de trabajo del artesano. Las situaciones que estos elementos están diseñados para solucionar son varias: la persistencia de los datos del formulario, si la ventana del navegador se pierde o el edificio en el que se encuentra es golpeado por un tornado, eso es Sísifo. La ingeniosa captura y manejo de errores adquiere un nuevo aspecto con Bugherd. O el eterno enigma de la elaboración de menús.

Este mes tiene un toque muy pragmático. Muchas aplicaciones de resolución de problemas. Si fueran herramientas de carpintero, serían los pequeños interesantes que aparecen fuera de su alcance en una silueta propia encima y detrás del banco de trabajo del artesano.

Las situaciones que estos elementos están diseñados para solucionar son varias: la persistencia de los datos del formulario, si la ventana del navegador se pierde o el edificio en el que se encuentra es golpeado por un tornado, eso es Sísifo. La ingeniosa captura y manejo de errores adquiere un nuevo aspecto con Bugherd. O el eterno enigma de la elaboración de menús.

Sin embargo, lo mejor de todo es que Zen Coding, relanzado como Emmet. La mágica multiherramienta del desarrollo HTML / CSS / JS. Pequeño y plegable, pero capaz de tallar un juego completo de sillas de comedor con un simple movimiento de muñeca. Forzando un poco la analogía, disculpas.

Como siempre, la creación de prototipos móviles tiene una buena apariencia. Eventualmente habrá más de estas cosas que aplicaciones móviles. Y, por supuesto, Evernote 5, que hace un verdadero trabajo recolectando cosas que de otro modo podrían formar la base de discusiones caprichosas en los abrevaderos de Shoreditch.


1. Emmet

Precio: Gratis

Anteriormente conocido como Zen Coding, el proyecto Emmet ofrece una abreviatura similar a CSS para sus páginas codificadas manualmente. Es un concepto simple, que se basa en la idea del "fragmento", que le proporciona una herramienta para realizar las tareas de codificación más repetitivas, como un cuchillo en la mantequilla.

Aplique la sintaxis simple: "p.class_name" le da "p> / p>". El anidamiento es simple: "div> p.class_name" se convierte en "div> p> / p> / div>". Te dan la imagen. Incluso puede incrustar texto lorem impsum, generar listas y, una vez que tenga una idea de las cosas, crear sus propios accesos directos y estructuras de fragmentos.

Con todo, esta es una extensión realmente poderosa, disponible para una amplia selección de editores populares. Si está codificando a mano, le ahorrará mucho tiempo. Sin embargo, no se exceda, ya que las cadenas se vuelven rápidamente indescifrables.


2. Sprintly

Precio: $ 9 / mes

Cuanto va a durar esto? ¿Cuántas personas tenemos libres para manejarlo? ¿Quién rastrea los errores y escribe las pruebas que los previenen? Hay una gran cantidad de preguntas como esta que acompañan a cualquier gran proyecto de desarrollo de software. Y con frecuencia, a algunos de ellos simplemente nunca se les pregunta, y mucho menos se les responde.

Sprintly te da un control visual de la situación que proporciona suficiente claridad para que nada tenga que caer por las grietas. Configure trabajos como historias, tareas, pruebas y defectos. Siga estos a lo largo de su ciclo de vida. Supervise y asigne miembros del equipo, comente el progreso y muestre el progreso con un atractivo conjunto de resultados gráficos. Incluso puedes integrarte con Github.

3. JPanelMenu

Precio: Gratis

Menús. Causan un dolor considerable por un concepto tan simple. Sin embargo, existen algunas soluciones probadas y comprobadas, y si tiene un espacio limitado para trabajar, pocas lo han hecho tan bien como el enfoque de paneles favorecido por Google en dispositivos móviles.

Siendo ese el caso, el diseñador / desarrollador Anthony Colangelo ha sido lo suficientemente bueno como para proporcionar al mundo una versión estándar de este sistema de menús: JPanelMenu.Funciona como un complemento de jQuery, dividiendo la página en dos secciones, una para el menú, otra para el contenido de página completa anterior y animando su bisección.


4. Evernote 5 Mac

Precio: Gratis, sin contenido sin conexión

Si no ha estado usando Evernote, EN5 es una buena aplicación para jugar. Nueva interfaz de usuario excelente con una barra de acceso directo, descripción general del panel izquierdo, cuadernos separados y vista Atlas, lo que le da un giro geográfico a la toma de notas. Es una aplicación convincente, incluso si el video de introducción se parece mucho a un episodio de Thunderbirds.

Para los usuarios de versiones anteriores, la imagen es menos clara. Las nuevas funciones y la interfaz de usuario parecen estar causando preocupación, especialmente entre los "usuarios avanzados". Esto es comprensible ya que el sistema ofrece una forma de organizar grandes cantidades de datos personales. Cuando alguien cambia la forma en que eso funciona y la gente se desorienta, puede resultar en estrés. Probablemente sería más prudente una prueba de la nueva versión que una actualización inmediata.

5. Sisyphus.js

Precio: Gratis

Los formularios son cosas difíciles de hacer bien. Este era el caso mucho antes de que apareciera Internet y sigue siendo cierto ahora. Independientemente de lo inteligente que haga sus animaciones desplegables o selectores inerciales, lo único que no puede tener en cuenta es la pérdida de datos.

Conexiones perdidas, navegadores cerrados, cortes de energía ... si está a la mitad de un formulario largo y aburrido, hay una larga lista de desastres potenciales esperando suceder. Sisyphus.js los vuelve obsoletos al emplear almacenamiento local para recordar los valores ingresados, y solo borra esa memoria cuando se envía o restablece un formulario.

6. Trinquete

Precio: Gratis

Existen muchas herramientas de creación de prototipos para iPhone. Tienen interfaces llamativas, arrastrar y soltar, y muchos botones y paletas. Ratchet no tiene nada de eso, ofreciendo en su lugar un conjunto conciso de componentes HTML / CSS y JS, listos para ser ensamblados a mano, conectados inteligentemente y luego empujados a su dispositivo.

Si prefiere ensuciarse las manos incluso en la etapa de creación de prototipos, Ratchet tiene sentido. Manejar la creación de demostraciones viables de esta manera le dará una idea de su viabilidad a nivel de producción y debería proporcionar una aproximación más cercana a su "visión".


7. Hammer para Mac (10.7+, procesador de 64 bits)

Precio: £ 16.99

La codificación de páginas estáticas puede ser un proceso agradable, pero siempre se ve afectado por algunas deficiencias que requieren mucho tiempo. La necesidad de recargar cada cambio, la imposibilidad de incluir bloques de código de otros archivos, recordar rutas de archivo y la tarea de compilar cosas como SASS y CoffeeScript.

Bueno, Hammer se ocupa de estos problemas (y un par más) por ti. Una vez que agrega un proyecto a Hammer, crea una carpeta de compilación en la que compila el código terminado cada vez que realiza un cambio en los componentes subyacentes, como el encabezado, el pie de página y la navegación. Existe una práctica opción de publicación que le brinda una URL de vista previa en vivo para compartir con las partes interesadas.


8. Aplicación pop

Precio: Actualmente gratuito

El lápiz y el papel todavía no se pueden superar en lo que respecta a la expresión creativa cruda. Incluso si lo que está haciendo es desarrollar la interfaz para una nueva aplicación móvil, es probable que piense más claramente con un pedazo de A4 sentado frente a usted. POP te permite pensar libremente y luego convertir tus garabatos en prototipos funcionales.

Todo lo que hace es tomar una foto de las páginas que ha dibujado, agregar áreas táctiles y asignarles una función. Rápidamente, tiene una idea vaga de lo que funcionará o no y es hora de sentarse con algo un poco más industrial.

9. Websico

Precio: 15 € / Mes después de la prueba

Como demuestra ampliamente Websico, las herramientas de diseño web WYSIWYG han recorrido un largo camino en los últimos años. Ahora puede arrastrar y soltar elementos, crear componentes y agregar estilos, todo a través de ingeniosas ventanas de diálogo modal. Es algo inteligente, no se puede negar.


Si tiene experiencia en desarrollo de software, Websico, como la mayoría de sistemas similares, probablemente lo molestará muchísimo. Pero incluso para esta clase de usuario, existe un caso de uso porque Websico proporciona un sistema de edición de contenido in situ simple para sus clientes. De esta forma, todo el mundo trabaja desde la misma página, por lo que hay menos posibilidades de que se produzcan errores.

También hay muchos tutoriales en video y documentación completa, por lo que si está buscando una herramienta de desarrollo visual con capacidades de CMS, vale la pena echarle un vistazo a Websico.

10. Bugherd

Precio: Gratis- $ 99 / mes para 25 miembros

Contrariamente a la creencia popular, el lanzamiento de un nuevo sitio no es el final del trabajo de un equipo de desarrollo. En todo caso, es el punto en el que el sudor realmente comienza a acumularse. A medida que los clientes comienzan a recibir comentarios, estas solicitudes confusas y conflictivas comienzan a filtrarse nuevamente como correos electrónicos, que luego son criticados antes de convertirse finalmente en una manzana de la discordia.

Bugherd proporciona una forma ordenada y bien organizada de manejar comentarios, correcciones de errores y solicitudes de funciones, sin la sobrecarga del correo electrónico. Un simple .js incluye y los visitantes del sitio obtienen un botón de comentarios. Los invitados al proyecto pueden presentar errores y solicitudes, los miembros pueden administrar todo el asunto desde una interfaz amigable e intuitiva. Progresar errores desde el informe hasta la acción y su finalización es mucho más preferible a la situación alternativa: una acumulación gradual que eventualmente abrumará.

Si ha encontrado alguna herramienta interesante recientemente que no está en nuestra lista, pero cree que debería haberlo hecho, háganoslo saber en los comentarios. Del mismo modo, si ha creado una herramienta que le gustaría que incluyéramos en el próximo resumen, envíenos un correo electrónico.

Artículos De Portal
Cómo restablecer una tableta: iPad, Samsung y más
Lee Mas

Cómo restablecer una tableta: iPad, Samsung y más

Hay mucha razone por la que e po ible que de ee aber cómo re tablecer una tableta. Tal vez e e té comportando de manera extraña, e congele o no re ponda. O tal vez de ee venderlo o rega...
Las impresionantes zapatillas de 8 bits son un pequeño tributo a tus zapatillas favoritas.
Lee Mas

Las impresionantes zapatillas de 8 bits son un pequeño tributo a tus zapatillas favoritas.

Cuando no topamo con el blog de Tumblr de neaxel , no enamoramo in tantáneamente. ¿Quién no lo e taría, con una enorme li ta de diminuta ver ione pixelada de zapatilla clá ica...
Informe: Ampersand 2011
Lee Mas

Informe: Ampersand 2011

Amper and, una conferencia en Brighton dedicada íntegramente a la tipografía web, tuvo lugar el vierne y fue recibida con entu ia mo por lo amante de la tipografía.Paul Lloyd de Clearle...