Refresh homepage tagline and hero copy #5380
+38
−28
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -7,14 +7,14 @@ sections: | |
| description: "Operational logic stays local. The same problem gets solved differently at every site, by every team, every time." | ||
| - svgPath: "components/icons/link-slash.svg" | ||
| title: "Your core systems don't cover everything" | ||
| description: "MES, ERP, and SCADA solve standard problems well. The workflows in the gaps (quality gates, shift handovers, custom validation) fall back to custom code and manual workarounds." | ||
| - svgPath: "components/icons/building-office-2.svg" | ||
| title: "What works on one line won't scale to fifty" | ||
| description: "A working solution on one machine requires rebuilding from scratch for the next site. There is no system to standardize, deploy, and govern what works" | ||
| capabilities: | ||
| - capability: "Build operational workflows your core systems can't" | ||
| feature: "Low-code development with FlowFuse Expert" | ||
| description: "Create the operational applications that MES, ERP, and SCADA platforms struggle to support natively, from quality validation and workforce assignment to shift handovers and production visibility. Describe what you need in plain language and FlowFuse Expert generates the starting logic directly in your workspace." | ||
| imagePath: "images/home/home-node-red.png" | ||
| imageAlt: "FlowFuse UI" | ||
| linkText: "Learn more about FlowFuse Expert" | ||
|
|
@@ -28,7 +28,7 @@ capabilities: | |
| linkHref: "/platform/device-agent/" | ||
| - capability: "Connect shop floor events to enterprise systems" | ||
| feature: "Flow-based IT/OT connectivity" | ||
| description: "Move production events, work orders, alarms, and operational data securely between PLCs, edge devices, MES, ERP, cloud platforms, and operator interfaces, without brittle point-to-point integrations or exposing inbound firewall ports." | ||
| imagePath: "images/home/home-dashboard.png" | ||
| imageAlt: "FlowFuse Dashboard" | ||
| linkText: "Explore production monitoring" | ||
|
|
@@ -64,6 +64,7 @@ operationalSystem: | |
| - title: "PRODUCTION & OPERATIONS" | ||
| items: | ||
| - name: "Production Monitoring" | ||
| url: "/use-cases/production-monitoring/" | ||
| description: "OEE tracking across lines, shifts, and plants." | ||
| - name: "Continuous Improvement" | ||
| description: "Digital CI workflow from suggestion to closure." | ||
|
|
@@ -72,6 +73,7 @@ operationalSystem: | |
| - name: "Workforce Assignment" | ||
| description: "Dynamic operator allocation using training, ergonomics, and demand data." | ||
| - name: "Shop Floor Communication" | ||
| url: "/use-cases/shop-floor-communication/" | ||
| description: "Real-time alerts, escalation, and cross-site coordination." | ||
| - title: "SYSTEM EXTENSIONS" | ||
| items: | ||
|
|
@@ -91,19 +93,19 @@ meta: | |
| faq: | ||
| - question: "What's the difference between Node-RED and FlowFuse?" | ||
| answer: > | ||
| Node-RED is the open-source runtime FlowFuse is built on. It's how you build the logic. FlowFuse adds everything after the build: deployment across sites, version control, team access management, and enterprise security. You can use FlowFuse without prior Node-RED experience. | ||
| - question: "Do I need Node-RED experience to use FlowFuse?" | ||
| answer: > | ||
| No. FlowFuse Expert, our AI-assisted development tool, lets your team describe what they need in plain language and generates the logic. Your team can build without a steep learning curve. | ||
| - question: "Can FlowFuse work with our existing systems?" | ||
| answer: > | ||
| Yes, FlowFuse is designed for brownfield environments. It connects to and extends your existing MES, ERP, SCADA, PLCs, and other systems without replacing them or requiring modifications to core platforms. | ||
| - question: "How does FlowFuse handle security and compliance?" | ||
| answer: > | ||
| FlowFuse is SOC 2 Type 1 and Type 2 certified. It supports RBAC, SSO, audit logs, and air-gapped self-hosted deployments for environments with strict network isolation requirements. | ||
| - question: "How long does a typical deployment take?" | ||
| answer: > | ||
| Most teams are operational within days. FlowFuse is designed to start with a single use case and expand, not require a multi-month implementation before delivering value. | ||
| hubspot: | ||
| script: "hubspot/hs-form.njk" | ||
| formId: 159c173d-dd95-49bd-922b-ff3ef243e90c | ||
|
|
@@ -129,7 +131,7 @@ hubspot: | |
| <div class="container m-auto text-left max-w-screen-lg"> | ||
| <div class="mx-auto"> | ||
| <h1 class="font-medium m-auto text-5xl md:text-7xl text-center text-white max-w-4xl"> | ||
| {{ site.messaging.tagLine | safe }}<br>IT, OT, and IIOT | ||
|
Member
There was a problem hiding this comment. |
||
| </h1> | ||
| <p class="mt-12 text-center text-gray-200 md:text-xl m-auto max-w-4xl"> | ||
| {{ site.messaging.subtitle | replace("-", "‑") | safe }} | ||
|
|
@@ -141,10 +143,10 @@ hubspot: | |
| BOOK A DEMO | ||
| </span> | ||
| </a> | ||
| <a class="ff-btn group flex flex-col mb-6" href="{% include 'sign-up-url.njk' %}" | ||
| onclick="capture('cta-try-it-now', {'position': 'hero'})"> | ||
| <span class="text-base uppercase items-center text-base flex gap-2 uppercase items-center text-white hover:text-gray-200"> | ||
| <span class="ff-animated-link">TRY IT OUT</span> | ||
|
Contributor
There was a problem hiding this comment. For this treatment across the website, check my feedback here #5381 (review)
Member
There was a problem hiding this comment. @dimitrieh @Yndira-E I do appreciate this comment. I think Yndira is right to question this behaviour. When we port this page to vue, we should make a component for this, as we can then standardize CTA-links and other links. @Yndira-E Can you create a follow up PR to achieve the results you proposed? |
||
| {% include "components/icons/arrow-right.svg" %} | ||
| </span> | ||
| </a> | ||
|
|
@@ -256,11 +258,11 @@ hubspot: | |
| <div class="relative z-10 max-w-screen-lg mx-auto max-md:text-center"> | ||
| <p class="text-indigo-500 text-sm font-semibold uppercase m-0">The missing operational layer</p> | ||
| <h2 class="mt-4 md:text-5xl">FlowFuse is the industrial application platform that sits between your systems and your operations</h2> | ||
| <p>Whether you're extending an existing system, standardizing a proven solution across sites, or connecting OT and IT data flows, FlowFuse gives your team the platform to <strong>build once and run everywhere</strong>.</p> | ||
| <div class="flex gap-4 items-center max-md:justify-center flex-wrap mt-6"> | ||
| <a class="ff-btn ff-btn--primary" href="/book-demo/" onclick="capture('cta-book-demo', {'position': 'secondary'})">BOOK A DEMO</a> | ||
| <a class="ff-btn" href="{% include 'sign-up-url.njk' %}" onclick="capture('cta-try-it-out', {'position': 'secondary'})"> | ||
| <span class="text-base uppercase flex gap-2 items-center text-indigo-600 hover:text-indigo-800"><span class="ff-animated-link">TRY IT OUT</span> {% include "components/icons/arrow-right.svg" %}</span> | ||
| </a> | ||
| </div> | ||
| </div> | ||
|
|
@@ -304,23 +306,30 @@ hubspot: | |
| <div class="max-w-screen-lg mx-auto max-md:text-center"> | ||
| <p class="text-indigo-400 text-sm font-semibold uppercase m-0">What mature adoption looks like</p> | ||
| <h2 class="my-4 md:text-5xl">From one-off solutions to <span class="text-indigo-600">an operational application system</span></h2> | ||
| <p class="max-w-screen-md">These are not use cases. They are production applications running across the business. Built once, governed centrally, deployed across every site.</p> | ||
|
|
||
| <div class="mt-10 bg-white/40 border-2 border-white rounded-xl pt-8 p-5 flex flex-col gap-8"> | ||
| <p class="text-center text-indigo-600 text-3xl font-normal m-0">Operational Application System</p> | ||
|
|
||
| <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4"> | ||
| {% for category in operationalSystem.categories %} | ||
| <div class="bg-indigo-50 border border-indigo-300 rounded-lg flex flex-col"> | ||
| <div class="bg-indigo-600 text-white text-sm font-medium text-center uppercase px-4 py-2.5 rounded-t-lg leading-5 min-h-16 flex items-start justify-center"> | ||
| {{ category.title }} | ||
| </div> | ||
| <div class="flex flex-col gap-[18px] p-2.5 flex-grow"> | ||
| {% for item in category.items %} | ||
| {% if item.url %} | ||
| <a href="{{ item.url }}" class="group bg-white border border-white rounded-lg p-4 flex flex-col gap-3 hover:no-underline hover:border-indigo-300 transition-colors"> | ||
| <p class="text-indigo-500 font-medium m-0"><span class="ff-animated-link">{{ item.name }}</span></p> | ||
| <p class="text-gray-700 font-light m-0 text-sm leading-5">{{ item.description }}</p> | ||
| </a> | ||
| {% else %} | ||
| <div class="bg-white border border-white rounded-lg p-4 flex flex-col gap-3"> | ||
| <p class="text-indigo-500 font-medium m-0">{{ item.name }}</p> | ||
| <p class="text-gray-700 font-light m-0 text-sm leading-5">{{ item.description }}</p> | ||
| </div> | ||
| {% endif %} | ||
| {% endfor %} | ||
| </div> | ||
| </div> | ||
|
|
@@ -331,7 +340,7 @@ hubspot: | |
| <div class="flex flex-col md:flex-row gap-8 items-start"> | ||
| <p class="text-white text-3xl font-medium m-0 md:w-80 shrink-0 leading-10">Every problem solved becomes a reusable application</p> | ||
| <div class="flex flex-col gap-3.5 md:pt-2.5"> | ||
| <p class="text-indigo-50 font-light text-xl leading-6 m-0">That's how a small team manages operations across dozens of sites, without rebuilding from scratch every time.</p> | ||
| <p class="text-red-50 font-medium text-xl leading-6 m-0">Ready to build yours?</p> | ||
| <div class="flex justify-center md:justify-end mt-2"> | ||
| <a class="ff-btn ff-btn--highlight" href="/book-demo/" onclick="capture('cta-book-demo', {'position': 'oas'})">BOOK A DEMO</a> | ||
|
|
@@ -371,11 +380,11 @@ hubspot: | |
| </div> | ||
| <p class="text-red-400 text-2xl font-medium m-0">AI accelerates the build</p> | ||
| </div> | ||
| <p class="text-gray-700 font-light m-0">FlowFuse Expert, our industrial-tuned AI assistant, lets your team describe what they need in plain language, and generates flows, data transformations, and dashboard logic. No waiting on scarce developers.</p> | ||
| </div> | ||
| <a href="/ai/" class="group hover:no-underline flex items-center justify-end gap-1.5 text-indigo-600 mt-6"> | ||
| <span class="ff-animated-link">Learn more about FlowFuse AI</span> | ||
| <span class="w-5 h-5 shrink-0 flex items-center [&>svg]:w-full [&>svg]:h-full">{% include "components/icons/arrow-long-right.svg" %}</span> | ||
| </a> | ||
| </div> | ||
| <div class="border-2 border-red-200 rounded-lg p-6 flex flex-col justify-between bg-gradient-to-tl from-red-50/50 to-transparent"> | ||
|
|
@@ -386,11 +395,11 @@ hubspot: | |
| </div> | ||
| <p class="text-red-400 text-2xl font-medium m-0">FlowFuse governs the result</p> | ||
| </div> | ||
| <p class="text-gray-700 font-light m-0">Speed without governance creates new debt. FlowFuse provides the production layer where AI-assisted work becomes visible, versioned, secure, and reusable, across the enterprise.</p> | ||
| </div> | ||
| <a href="/book-demo/" class="group hover:no-underline flex items-center justify-end gap-1.5 text-indigo-600 mt-6" onclick="capture('cta-book-demo', {'position': 'ai'})"> | ||
| <span class="ff-animated-link">Book a demo</span> | ||
| <span class="w-5 h-5 shrink-0 flex items-center [&>svg]:w-full [&>svg]:h-full">{% include "components/icons/arrow-long-right.svg" %}</span> | ||
| </a> | ||
| </div> | ||
| </div> | ||
|
|
@@ -411,7 +420,7 @@ hubspot: | |
| <!-- Get Started --> | ||
| {% set cta = { | ||
| title: "Get Started with FlowFuse", | ||
| description: "Your first operational application could be running this week. Book a demo to see how, or start a free trial and build it yourself.", | ||
| buttonText: "BOOK A DEMO", | ||
| buttonLink: "/book-demo/", | ||
| position: "get-started" | ||
|
|
@@ -425,3 +434,4 @@ hubspot: | |
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.