13. Wireframes, bocetos web multifunción

Bienvenidos al episodio número 13 de nuestro podcast favorito. Hoy analizamos uno de los conceptos más interesantes de la fase de preproducción de un proyecto web.

Novedades

Elías y Yannick nos cuentan las novedades de la última quincena. Elías como viene siendo habitual nos trae una batería de noticias relacionadas con WordPress.

Aprende Gutenberg es un newsletter semanal sobre el nuevo editor de WordPress, al igual que ya hizo con Enlace Permanente, Elías nos recomienda visitar este sitio para estar al tanto de las novedades de Gutenberg.

Y seguimos con Gutenberg; Atomic Blocks añade un montón de bloques nuevos para Gutenberg, sería algo así como el Elementor Extras del editor Gutenberg. Y hablando de Elementor, Elías recomienda a Yannick un plugin para Elementor (Full Screen Menu for Elementor) que permite crear menús a pantalla completa, algo que le da un toque bastante cool a la interfaz de la web.

En cuanto al tema de moda, la RGPD, os avisamos de que si no cambiais el periodo de retención, el 25 de mayo, Google Analytics solo guardará 26 meses de datos, algo que ha recomendado Fernando Tellado en su Twitter.

Además de todo esto, Elías también nos comenta cómo ha sido su experiencia a la hora de transcribir los podcasts para conseguir algo de SEO.

Esta semana las novedades que trae Yannick son algo más variadas. Nos habla sobre su afición a los juegos (sistemas en realidad) de rol, como Kickstarter le sirve de fuente de información y su opinión sobre Infinity War.

Aunque también trae novedades relacionadas con su proyecto personal, como los nuevos vídeos de La Máquina del Branding en Youtube y algunas experiencias que ha tenido en la agencia de marketing en cuanto a desarrollo web y WordPress.

Por último nos invita a ver la última campaña de concienciación vial llevada a cabo por Michelín, donde se nos presenta a modo de rap.

(Al final del programa Elías también nos habla sobre la evolución de su proyecto como DJ, estadísticas, nuevos clientes, etc.)

Herramientas

Las recomendaciones del programa son 4 esta semana. Keylogs es una aplicación gratuita para realizar el seguimiento de tus urls, una aplicación a medio camino de las más potentes, pero suficiente para obtener datos interesantes, y además sin coste alguno.

Custom Post Type Permalinks nos permite modificar las esructura de urls de nuestra web si tenemos custom post types.

WP Extended Search le ha sido muy útil a Yannick en un proyecto donde el buscador de un catálogo online de productos no mostraba resultados correctamente. Con este plugin, la búsqueda de WordPress se amplia a términos como taxonomías, marcas, etiquetas, etc.

Gravity View es un plugin que nos permite mostrar datos de registros de Gravity Forms en nuestra web y además permite crear listados, fichas con cada entrada o incluso buscadores en el frontend.

Por último Quick Remove Menu Item nos facilitará la vida a la hora de eliminar los elementos del menú de WordPress, tarea que por defecto, es algo tediosa.

Wireframes

Wireframes, esquemas, bocetos… Podemos llamarlo como queramos. Se trata de un elemento visual que es capaz de transmitir la idea general de una página web así como la estructura de contenidos antes de comenzar el diseño o el desarrollo de la misma.

Elías y Yannick nos comentan que utilizando estos wireframes consiguen ahorrar mucho tiempo de cambios y modificaciones en los proyectos, ya que al enseñar estos bocetos al cliente, consiguen adelantar en el tiempo ese momento en que el cliente comienza a tener claro cómo quiere que sea la página web.

Después de definir bien en qué consiste y cómo se lleva a cabo esta tarea de crear Wireframes, entramos en un debate acerca de cuál es el momento idóneo para realizar esta fase y si existe algún caso en el que no procede del todo.

Para terminar nos recomiendan una serie de aplicaciones y herramientas perfectas para llevar a cabo este cometido.

Enlaces

2 comentarios en “13. Wireframes, bocetos web multifunción”

  1. Hola chicos,

    La verdad es que hace poco que os sigo y os merecéis un aplauso por curraros tanto los podcast … (eeeh!! Elías > aplausos con ovación)

    Tengo una pregunta para Elías que seguro que responderá Yannick 😉

    ¿Podías decir cómo implementas la plantilla Underscore con Elementor Pro? ¿Hay que hacer alguna adaptación para que funcione o solo es descargar y empezar a funcionar?

    Gracias y continuad así…

    Salu2 desde Pamplona…

    Ángel.

    PD: Sobre los comentarios que os han hecho sobre la periodicidad del podcast, mi opinión es que podrías hacer un 2 por 1, es decir, un podcast de “batallitas” (lo que viene a ser la intro de los podcasts actuales) y otro podcast del tema “central”, así tendríamos la periodicidad semanal tan anhelada por los que os seguimos… Y perdonad el tocho pero ahora me tengo que ir a hacer las valoraciones en itunes jejeje xD

  2. Hola Ángel.

    Antes que nada tienes que pensar que el editor visual de Elementor funciona allí donde se encuentre la función the_content.

    Un ejemplo:

    Si a tu theme de Underscores le instalas Elementor, cuando veas una entrada (single.php) podrás maquetar con Elementor el contenido, pero seguirás viendo, por ejemplo el sidebar.

    Si no quieres que haya sidebar, tendrás que abrir tu archivo single.php y eliminar la función get_sidebar.

    Así que si. Si usas Underscores, normalmente hay que hacer algunos ajustes.

    Otros themes como GeneratePress, Ocean WP, dejan hacer estos ajustes desde el personalizador de WordPress (apariencia > personalizar). Pero con UnderScores, esto tendrás que editarlo tu mismo abriendo los archivos php.

    Otra forma de trabajar es utilizar lo que Elementor llama la plantilla “Canvas”. Cuando edites una página o entrada, si en las opciones de esa entrada de WordPress le dices, que en vez de utilizar la plantilla predeterminada utilice “Canvas”, esa página quedará totalmente limpia, y lo que verás es solo “the_content”. Es una forma rápida de diseñar una web con pocas secciones o una landing page, donde quizás no merece la pena andar editando el theme para las pocas secciones que va a tener.

    Bueno, espero haberte ayudado. No se muy bien a qué nivel conoces WordPress, así que si hay alguna cosa que quieres que te matice, me comentas.

    ¡Saludos!

Deja un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.