Módulo 1: Introducción a Webflow y al movimiento NoCode

NOCODE

NoCode es una filosofía digital que permite a cualquier persona crear y desarrollar software sin tener conocimientos técnicos. Normalmente a través de un entorno visual tipo drag & drop.

Ventajas de usar Webflow

Ahorra tiempo

Las herramientas NoCode permiten liberar tiempo al equipo de desarrolladores al involucrar a otros departamentos en el proceso de construcción.
‍
La participación de roles no propios de programador ayuda a satisfacer las demandas de una entrega de aplicaciones más rápida y hace que el proceso fluya más rápido.
‍
Como cualquiera puede usar estas herramientas, la ausencia de código ahorra una cantidad considerable de tiempo.

Ahorra costes

Es costoso contratar desarrolladores cualificados. Con herramientas NoCode, se pueden crear aplicaciones web/móviles, herramientas internas y externas sin necesidad de un equipo de IT.

¿Te falta el presupuesto para contratar desarrolladores? Puedes crear aplicaciones y software con herramientas NoCode que son alternativas a la costosa y laboriosa codificación manual tradicional.

Hacer cambios es más fácil

Se necesita tiempo para realizar un cambio en la funcionalidad o característica en la codificación tradicional. Puedes cambiar algo fácilmente con herramientas NoCode en unas pocas horas como máximo.
‍
Las herramientas NoCode son esencialmente un constructor de interfaces de usuario, la mayoría de ellas tienen la función de arrastrar y soltar.
‍
Puedes reunir visualmente todos los componentes y observar instantáneamente cómo se verán en todos los tipos de dispositivos.

Aumenta la productividad

Con herramientas NoCode, puedes quitarles a los programadores una gran carga de trabajo y aumentar la productividad.

Por ejemplo, la entrada de datos manual puede causar errores y lleva mucho tiempo. Puedes acelerar el proceso de entrada de datos manual mediante la automatización con herramientas sin código. Por lo tanto, la eficiencia y la productividad generales del equipo aumentarán considerablemente.

Fácil mantenimiento

En el código tradicional, el equipo de IT debe ocuparse de los problemas de mantenimiento de la aplicación. En NoCode no es necesario, puede hacer el mantenimiento uno mismo.

Se puede obtener fácilmente ayuda con el mantenimiento y el soporte de expertos del equipo de soporte de la herramienta NoCode que se está utilizando.

NoCode Tools

Cada vez son más las herramientas de NoCode, combinándolas entre ellas está naciendo un nuevo tipo de profesional, cada uno con su NoCode Stack. Puede ser un profesional del marketing, de diseño, etc.

Webflow - No Code Revolution
NoCode Journal - State of NoCodeAwesome NoCode tools
Awesome NoCode tools
Pietro Invernizzi - Decoding the no-code / low-code startup universe and its players
NoCode Tech - Tools directory
WeLoveNoCode - NoCode List
NoCode tools on ProductHunt
NoCode MBA tools
NoCode Portal - NoCode tools
+694 No-Code Tools to Save Your Time and Money
Webflow

Webflow

Webflow, Inc. es una empresa estadounidense, con sede en San Francisco, que ofrece software como servicio (SaaS) para la creación y el alojamiento de sitios web.

Su plataforma de edición visual en línea permite a los usuarios diseñar, construir y lanzar sitios web.Webflow es una aplicación SaaS que permite a los diseñadores crear sitios web receptivos con software de edición visual basado en navegador. Mientras los diseñadores usan la herramienta, Webflow genera automáticamente HTML, CSS y JavaScript.

Los sitios web creados en Webflow funcionan con Amazon Cloudfront y se alojan en Fastly. Webflow es una plataforma todo en uno con un CMS integrado. No requiere complementos externos.

Webflow es una herramienta de diseño web, así como una plataforma de alojamiento y CMS, todo en uno. Generalmente son herramientas completamente separadas. Tiene un mayor enfoque en diseño y es ideal para agencias o freelances.

También es una excelente herramienta de creación de prototipos para ofrecer interactivos.

Sobre Webflow

Cada vez son más las herramientas de NoCode, combinándolas entre ellas está naciendo un nuevo tipo de profesional, cada uno con su NoCode Stack. Puede ser un profesional del marketing, de diseño, etc.

Wikipedia - Webflow
Toptal - Webflow Advantages for No Code Web Design – A Case Study
Smashing Magazine - Webflow: The Web Development Platform Of The Future
Webflow Pitch

Webflow pricing

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Webflow Account Plans
Webflow Site Plans
Webflow Individual plansWebflow team plansWebflow Site plansWebflow ecommerce plans

Webflow pricing

Cada vez son más las herramientas de NoCode, combinándolas entre ellas está naciendo un nuevo tipo de profesional, cada uno con su NoCode Stack. Puede ser un profesional del marketing, de diseño, etc.

Webflow pricing
Webflow is free for students and educators
NoCodeHackers - Entendiendo los planes de pricing de Webflow
Matias Pitters - Entendiendo los planes de pago de Webflow.
FluxAcademy - Webflow Pricing Explained: Which Plan Is Right for You?
Tribu Olaf - WEBFLOW | Planes y Precios de Webflow (2021) para Hacer Diseño Web Profesional (Nocode)

Project Settings

Dashboard
Dashboard
Settings
Settings
Editor
The Editor
The Designer
The Designer

Dashboard - Gestión de proyectos

Duplicar

Todo el proyecto es copiado enteramente en otro nuevo salvo la configuración de formularios, versiones, colaboradores, Google Analytics y facturación.

Transferir

Se transfiere el proyecto a otro Dashboard con todos los assets, versions,  custom fonts, form submissions, redirects y otros settings salvo configuraciones privadas.

Eliminar

No se puede restaurar, es totalmente irreversible.

Compartir

Se envía una versión del proyecto en ese momento, un read-only link (no refleja los cambios).

Publicar en Webflow o dominio

Por defecto se publica siempre a yoursite.webflow.io

'Despublicar'

Desactiva la url del proyecto publicado.

Exportar código

Prepara un .zip para poder usar el código en hosting fuera de Webflow.

Project Settings

General Settings

Configuración del nombre del proyecto, subdominio, favicon y webclip, lugar, hora y lenguaje.

Hosting

Para cuando utilices el hosting de Webflow.

Editor

El Editor permite a los colaboradores administrar rápida y fácilmente el contenido de su sitio.

Billing

Facturación y hosting para cada proyecto (hace falta un site plan con hosting en Webflow).

SEO

Se puede hacer también desde cada página dentro de The Designer.

Forms

Configuración de formularios y reCAPTCHA Validation, sólo para Site plans.

Fonts

Configuración de fuentes para el proyecto, pueden ser custom o Google fonts.

Backups (version control)

Webflow realiza una copia de seguridad con Cmd + Shift + S (o Ctrl + Shift + S en Windows) y cada diez veces de guardado automático. También al restaurar.

Integraciones

Configuración de integraciones con Google, Facebook y APIs.

Custom Code

Se utiliza para implementaciones de Code Snippets, CSS o Javascript.