Design Approach

Here's how I recommend that you approach a Webflow CMS design.

Start with the general concepts of the data you're wanting to present, and how you're wanting to present it- and then work your way into the specifics of how to best accomplish that with Webflow.

Here's a broad strategy that can save you tons of grief later.

Model your data

Sketch your data model on paper, or on a markerboard, or in Figma.

For example, let's imagine an events site with Events, Venues, Cities, and Genres.

1. Draw those objects as boxes
2. For each box, describe what each of them will contain as fields of information. Think about the data types you'll use for each field.
3. Draw lines to describe how those boxes will relate to each other
4. Think about how those relationships will work. Are they refs or multi-refs? Use refs whenever possible, and use the crucial design principles in the previous section to guide your decisions in planning this.

Redo your data model several times until it makes good sense, and keep improving it until it is as simple and efficient as possible for the problems you're trying to solve.

Plan your views

Think of your UI as presenting Views of your data. List them out. In our event site, these views might be;

• A list of upcoming events
• A list of past events
• A list of cities
• A list of upcoming events, in a specific city
• A list of genres
• A list of upcoming events, by genre
• A list of genres, by city

Think through these views. Which are static pages? Which are collection pages? How will navigation work between them?

Sketch the complex ones out, roughly. Think about how you'll construct them using as few collection lists as possible, and how those lists will be bound, filtered, and sorted.

Review your Model relationships

Consider how the elements of your model interconnect.

Your Views will give you the best guidance on how to do this efficiently. For each view, what Collection Lists will you be creating? Where will those Collection Lists go?

Because of the way Webflow's CMS relations work, you're most efficient if each View is based on a primary table, with no more than "one hop" to any additional data it needs.

Ideally, in most cases, that hop will be a Ref ( not a Multi Ref ) pointing to the data it needs.

Consider your UX

User eXperience ( UX ) refers to factors like ease of use, intuitiveness, speed, and accessibility. How will the user get what they need to get easily, from wherever they're at?

Prototype your CMS & UI design

Before you invest any time in data-entry, or styling your site, you need to prove these things;

1. Your data model makes sense, achieves what you want, and is manageable for your site admins.
2. Your page designs make sense, and will work. Nail the collection lists, binding, filtering and sorting decisions and prototype them long before you worry about styling.
3. Your navigation and UX makes sense. The user will understand how to get from X to Y to Z and it will give them the experience they need.

‍

Once you've completed a pass on this exercise, return to the top and repeat it again, like ironing a wrinkled suit. You'll find it gets smoother, and tidier as you repeat.

‍