Page tree
Skip to end of metadata
Go to start of metadata
Your Rating: Results: 1 Star2 Star3 Star4 Star5 Star 90 rates

GREY Mind map style of display of content relations on Magnolia based siteGREY


The concept maps you see here are prototypes only. View them the same way you would view a miniature building in an architect's office. You will notice differences in font type and size etc. These were just to get a feel for the idea.

Magnolia CMS Concept Maps are 'mind map' style diagrams where a central concept is surrounded by topics that correspond to concepts/topics/areas in the official documentation, training material and other sources.

A Magnolia CMS Concept Map is not an organogram or hierarchical structure. A Magnolia CMS concept map is an at-a-glance information resource; it gives you a concept and shows the most immediately related Magnolia CMS concepts on one level (and maybe some IT and web concepts in general) and then one (max two or three...) sub levels of related information. We are not teasing out a concept. We are linking concepts to concepts in a neat visual way that invites the reader to delve deeper or to move on to another topic. We may also employ concept maps to show the exact relationship between related/connected concepts.

From wikipedia:

Concept maps - Mind maps differ from concept maps in that mind maps focus on only one word or idea, whereas concept maps connect multiple words or ideas. Also, concept maps typically have text labels on their connecting lines/arms. Mind maps are based on radial hierarchies and tree structures denoting relationships with a central governing concept, whereas concept maps are based on connections between concepts in more diverse patterns. However, either can be part of a larger personal knowledge base system.


Like the three laws of robotics, right now Magnolia CMS Concept Maps have three simple rules.

1) Restrictive

Too many information bubbles and the map becomes confusing. The information should be relevant to Magnolia CMS. The Magnolia CMS rabbit hole is rich and wondrous enough; no need to show the visitor all around the whole of IT Wonderland. To draw an analogy, while a concept map of a 'car' might include 'chassis', it probably should not include 'chase'.

2) Relevant

Make things become 'obvious' through clarification: not just repeat the obvious. Keep the concept map relevant. Just because a topic is worth mentioning on a map doesn't mean that it deserves a map for itself. A good rule of thumb regarding the specificity of a possible map is 'take a step back'. Go up a level. Does a component merit a concept map? Or should component simply be a concept on a concept map called Template? Obviously everything is relevant, but we don't want to include everything! Instead of 'relevant' we could say 'appropriate'.

3) Relational

Second level concepts on a Magnolia CMS Concept Map should be no more than one step removed from the central-concept. There's nothing wrong with having sub-levels of conceptually related topics, but a concept is in Magnolia CMS, then that concept is in some way related to everything else in Magnolia, so there's no need to expand the conceptual circle too far. Perhaps by relational we should mean the more obvious_ 'explains the relationship between the different object, elements and nodes on the map'.

Modules as a starting point

As each module is a discrete unit the most obvious place to start with a Magnolia CMS Concept Map is with the Modules. For now the first prototype concept maps reside on the wiki, but in the long run they could make it to the official documentation.

Enhancement points:

  • Colour-coded nodes indicating that a page or component exists in our documentation.
  • Coloured lines, directional arrows for dependencies or to indicate hierarchy. So Template > Component, Page, Area > Web page
  • Hover over augmentation. (User hovers over a node and suddenly it explodes to life.)
  • Click nodes. Click to open and close a node. Move from one node to another, so....
  • Smooth transitional graphics
  • Concept Map as App. for Mag 5
  • Single tap makes a node central. Double tap brings user to documentation regarding that node/or opens a list of relevant links.

Phased Approach

Phase 1 - Static Concept Maps

This is essentially the outline as above, but with a text back up that points to the relevant documentation section to the items mentioned on the concept map.

Phase 2 - Semi-interactive Concept Maps

Mind maps become interactive and link to Magnolia CMS documentation, wiki pages, other mind maps etc. through basic hyperlinks.

Phase 3 - Fully Interactive Magnolia CMS Concept Map

Searchable, graphically pleasing, the fully interactive Concept Map allows a user to look around the Documentation, in the shape of an interconnected information sphere with clickable nodes. Great for touch screen devices.

Use case ...

Sitting on the U-bahn on her way to the office, Lisa Von Schilling - the brilliant, quirky and stunningly beautiful CTO of a Carparts R Us - is checking out the Magnolia-CMS website to learn more. Carparts R Us is rapidly expanding and more and more dealerships are using the web to make orders. A company that deals in car components for dissemination in the European market needs to stay on top of distribution trends.

The company website - once the zenith of cutting edge - has become slow and unstable. The is accessed by multiple dealerships, not all requiring the same kinds or brands of products. There have been complaints about time being wasted having to look through product lists of irrelevant goods. Worse, although the distribution has a central office, there are distribution points scattered throughout the markets - and in each distribution point there are users that need access to the CAR PARTS R US websites to make quick updates when products become available or stock is depleted.

As CTO, Lisa needs a solution that can handle what is becoming an increasingly messy situation. Time is short, the meeting is in less than half an hour. She is tired, a bit grumpy and the U-bahn unusually busy.  She needs something visual, immediate - something that gives a good overview of the product but that can lead to further information if she needs it. As her perfectly manicured fingers lightly tickle the shiny tablet screen, she smiles as she navigates the neat interactive Magnolia CMS Concept App... _

Close up shot of user clicking the CAS button on the LDAP Concept App.


Smooth graphical transition to CAS node. Node expands and new concept nodes appear.

Close up of fingers gently brushing the screen. The image moves and zooms in on the ACL link.

Lisa smiles to herself as slips away the sleek white tablet. "Magnolia..." she whispers as she steps onto the platform.


  1. I like the idea. For productive use I would lose the caps though, it makes it hard to read. And definitely use the same font throughout the whole concept map.
    (thumbs up)

    1. Cool. Thank you. See note. All prototypes.

  2. Since it's a concept page, you should use the same heading as for the other concept pages.

    I agree with Natascha that this is a great idea. In order to become real concept it should also list suggestions on how/where such thing will be implemented.
    What I could envision as one way to achieve this is to use existing categorization module and use categories as those central topics and provide functionality to generate image maps from existing categories. That way users can facilitate already developed categories and give them extra use case.

    1. Thanks Jan. Was unaware of the protocols for this page. Added following a 'seems like best place' rule. Will be updating.