📢Project Brief for Webflow Developer

Hi,

We’re launching a modern website hosted on Webflow CMS. The goal is a clean, modular site that follows Webflow best practices, is easy to manage, and can scale over time without needing custom code or future developer support.

Pages to Build

These are live Webflow URLs used only as structure references (not design references – they look outdated, which is why we need your help).

Example Structure Pages: (use Google Translate if needed)

•example.com (homepage)

• example.com/services (master services page)

• example.com/services/product1 (product 1)

• example.com/services/product2 (product 2)

• example.com/partners (partners page)

• example.com/pricing (pricelist table)

• example.com/blog (blog)

• example.com/contact-about (contact/about)

🎯Scope: Pages & Components Included (Just Examples)

1. Global Components & Style Guide

Includes setup of:

• Top navigation menu with correct linking (including /en/ support).

• Footer with all key links.

• Complete style guide: colors, typography, layout system, components.

• Footer as it is today (pages, services links = sitemap, social media, newsletter, etc.).

1. Homepage

/en/

Main landing page.

Sections: Hero, trust block, value propositions, product highlights, CTA blocks.

1. Services Overview

/en/services/

Index page listing all core service categories with links to each page.

1. Service Page – Type A (Packages)

Example: /en/services/migration

Used for services with product packages (Starter, Advanced, etc.).

Includes: intro section, tiers, pricing cards, CTA.

1. Service Page – Type B (Short Format)

Example: /en/services/microsoft365/licenses

Used for pages with short format and descriptive info.

1. Pricing Page

/en/pricing/

Full pricing overview for all products and tiers.

Tabular layout with product codes, names, price, CTA. No visual blocks needed.

1. Blog

/en/blog/

CMS-based blog structure.

1. Contact/About

/en/contact-about/

Simple contact form.

Very short company description.

1. Partners Page

/en/partners/

Custom layout showcasing:

• Partner value.

• Collaboration process.

• Referral benefits.

• Contact interest form.

Price Cards

Each service page has 2–5 pricing levels (Starter, Advanced, Premium, Enterprise, Add-on).

• Clear, editable, reusable (CMS-optional).

• Cost-effective options at the top, more complex/expensive below.

Multilingual Structure

Support English (/en/) and Swedish (/sv/) via manual page duplication (no Webflow localization).

• Example URLs: /en/services/product2 ↔ /sv/tjanster/product2.

• Add a simple header/footer language toggle (manual links).

• Build English version only, but ensure structure supports Swedish duplication.

Tech Stack

• CMS: Webflow CMS.

📦Design Style

• Clean, modern, readable, mobile-responsive.

• Modular, component-based layout for easy reuse.

• Fast load times, no bloated code.

• Visual Vibe & Inspiration:

o craftly.ai/ (webflow.com/made-in-webflow/website/crafttly)

o annus-site.webflow.io/

o stiddlewebsitemarketingsite.webflow.io/

• Animations (just ideas):

o whimsical.com/

o thorfin.webflow.io/

o temperstack.com/

• Colour Scheme (light and modern):

o whimsical.com/

o meetsidekick.com/

o webflow.com/made-in-webflow/website/crafttly

• Startpage Look & Price Cards:

o craftly.ai/

o annus-site.webflow.io/

o meetsidekick.com/

o leedflow.io/pricing/

o whimsical.com/pricing

Delivery Expectations

• General: 9 responsive, production-ready pages. Modular, scalable, no hardcoding.

• Webflow Setup:

o Full CMS for blog, optional for services/pricing.

o Global components: navigation, footer, CTAs, pricing cards.

o Responsive for desktop, tablet, mobile.

o Optimized load times and animations.

o Functional forms (HubSpot-ready) with confirmation/error states.

o Manual language toggle (/en/ ↔ /sv/).

o Basic SEO: title, meta description, OG image, favicon.

• Deployment: DNS setup, publishing, QA (no broken links/placeholders).

You Handle

• Design, Full site setup, content implementation, deployment.

• Ensuring a functional, editable site.

Revisions & Collaboration

I don’t expect perfection from day one, but a few reasonable revision rounds would be great, especially for layout, spacing, or logic if anything feels off. The goal is a clean, professional, and solid site we can both be proud of.

Extra Context

What We Do (Short Summary)

We offer structured digital workspaces and intelligent workflows tailored for small to midsize businesses using Microsoft 365, Google Workspace, and AI tools. We provide downloadable templates, automation blueprints, visual guides, online training, and full-service setup packages – ranging from ready-to-use productivity kits to advanced ecosystem design and AI-powered automations. Our goal is to replace digital chaos with clarity, reduce friction, and create scalable, low-maintenance systems that just work.

Ideal Customer Profile

Small and midsize businesses with:

• Up to $3M in annual revenue.

• Up to 30 employees.

• No internal IT department or only basic IT competence.

• A need for structure, automation, or better use of tools they already pay for (e.g., Microsoft 365).

Tone & Style Guide

• Overall Tone: Straightforward, clean, minimal. No corporate fluff. No vision talk. Focus on clarity, benefits, and usability.

Apply with your Webflow portfolio and experience building modern, modular sites. Let’s create something professional we’re both proud of!

Thanks,

And yes we are looking for a long term collaborator.

• No visual blocks needed
• Support English (/en/) and Swedish (/sv/) via manual page duplication (no Webflow localization)
• Clean, modern, readable, mobile-responsive
• Fast load times, no bloated code
• craftly.ai/ (webflow.com/made-in-webflow/website/crafttly)
• Colour Scheme (light and modern):
• whimsical.com/
• meetsidekick.com/
• Responsive for desktop, tablet, mobile
• Functional forms (HubSpot-ready) with confirmation/error states
• Manual language toggle (/en/ ↔ /sv/)
• Basic SEO: title, meta description, OG image, favicon
• Deployment: DNS setup, publishing, QA (no broken links/placeholders)
• No internal IT department or only basic IT competence
• A need for structure, automation, or better use of tools they already pay for (e.g., Microsoft 365)

• Footer with all key links
• Footer as it is today (pages, services links = sitemap, social media, newsletter, etc.)
• Partners Page
• Each service page has 2–5 pricing levels (Starter, Advanced, Premium, Enterprise, Add-on)
• Clear, editable, reusable (CMS-optional)
• Cost-effective options at the top, more complex/expensive below
• Modular, scalable, no hardcoding
• Up to $3M in annual revenue

• example.com/services/product1 (product 1)
• example.com/services/product2 (product 2)
• example.com/partners (partners page)
• example.com/contact-about (contact/about)
• 🎯Scope: Pages & Components Included (Just Examples)
• Global Components & Style Guide
• Top navigation menu with correct linking (including /en/ support)
• Complete style guide: colors, typography, layout system, components
• Used for services with product packages (Starter, Advanced, etc.)
• Includes: intro section, tiers, pricing cards, CTA
• Used for pages with short format and descriptive info
• Full pricing overview for all products and tiers
• Tabular layout with product codes, names, price, CTA
• Example URLs: /en/services/product2 ↔ /sv/tjanster/product2
• Add a simple header/footer language toggle (manual links)
• Build English version only, but ensure structure supports Swedish duplication
• CMS: Webflow CMS
• Modular, component-based layout for easy reuse
• General: 9 responsive, production-ready pages
• Full CMS for blog, optional for services/pricing
• Global components: navigation, footer, CTAs, pricing cards
• Optimized load times and animations
• You Handle
• Design, Full site setup, content implementation, deployment
• Ensuring a functional, editable site
• Revisions & Collaboration
• I don’t expect perfection from day one, but a few reasonable revision rounds would be great, especially for layout, spacing, or logic if anything feels off