Proposal to improve the homepage and integrate Cristal information on XWiki.org

[tkrieck]

Hi everyone,

This is a joint proposal from @pauline and me outlining a set of improvements to the XWiki.org homepage and website. The proposal is driven by five primary objectives:

1. Refresh the homepage layout

2. Increase legibility

3. Provide greater visibility for Cristal

4. Improve the onboarding experience

You can preview the proposal using the Penpot mockup available at the link below. It illustrates some of the concepts described in this message.

Penpot | Design Freedom for Teams

Updated Layout

The current layout is compact and carries a high level of informational density. Our proposal aims to make the page more focused and easier to navigate by:

• Splitting the existing banner into separate components

• Organizing these components in a scroll-friendly structure

To fully view or engage with the current banner, users need to wait OR click in the banner buttons (dots), distributing the content vertically ensures better visibility. However, all information required for a user to have a basic understanding and try XWiki are still present in the first part of the webpage, before any scrolling is required.

To accommodate the new sections derived from the banner, we propose relocating the blog posts section, testimonials, and the “Powered By” area, listed in this order of priority, as illustrated below.

Regarding the Powered by area, sometimes some ancient projects show up here, could we restrict them a bit so only more recent or important ones are in the rotation?

Basic Layout

Desktop Mockup

Mobile version should also be done, of course. But I want to get your feedback on this proposal before going into the mobile route.

@amilica We’d very much welcome your feedback on the whole proposal, but also very specifically on the banners themselves. For me (Thiago), they are a bit too information heavy, what do you think?

Enhanced Legibility

The current base font size of 14 px is fine, but many elements scale down proportionally to 12 px, which can reduce readability in several contexts. To address this, we propose increasing the base font size to 16 px to improve clarity and text comfort across the site.

Another option is to increase the font size only on specific places (like the latest blog posts and testimonials) but that would leave the rest of the site (internal pages) with the same legibility problem.

Context:

Increased Visibility for Cristal

Cristal previously had its own dedicated website, the proposal is to incorporate its content directly into XWiki.org. To improve discoverability, the proposal includes adding Cristal-related entries to the homepage, the main menu, and the download page.

Main Menu

Update the main navigation to integrate Cristal. Here we are showing only the sub-items for the navigation items that need updates.

• Home

• About

• Projects

  • XWiki

  • Extensions

  • Cristal

  • Code Snippets

• Documentation

  • XWiki Standard

  • Cristal

• Contribute

• Support

Home Page

Create a section (banner previously) showing a bit of info about Cristal.

Download Page

• Add a 4th section for “Download XWiki” card

• Update order: Playground, XWiki Cloud, Download, mywiki.org

• Shorten the cards content:

  • Try XWiki in Playground - limited trial, access to the sandbox only.

  • Try XWiki Cloud - full trial from XWiki SAS with all features (including Admin actions & Pro extensions)

  • Download XWiki - full and free acess to the whole project, [license link]

  • Account on MyXWiki.org - for non-profit organizations and individuals, no uptime or support warranty, no programming rights

• Add Cristal in each card OR create a dedicated section for Cristal below.

Forge page

Add Cristal documentation link in the top level projects section.

Documentation

• Create a top level page for Cristal documentation at https://www.xwiki.org/xwiki/bin/view/documentation/cristal/

• Use the same documentation system as for XWiki documentation

• Migrate User, admin and developer documentation for Cristal standalone in Cristal documentation

Open question: Where should the Cristal extension documentation go?

Improved Onboarding

At the moment, users need to explore the homepage a bit to locate the “Download” and “Try” options. To streamline onboarding, we suggest adding two prominent call-to-action buttons to the homepage. These CTAs would link to the same pages already available in the main menu but would offer clearer and more immediate entry points for new users.

That’s it for now, as always we’d appreciate any feedback on these items.

Thanks!

[mleduc]

@tkrieck

To fully view or engage with the current banner, users need to wait OR click in the banner buttons (dots), distributing the content vertically ensures better visibility. However, all information required for a user to have a basic understanding and try XWiki are still present in the first part of the webpage, before any scrolling is required.

+1, carousels are considered a bad practice nowadays.

@tkrieck

Mobile version should also be done, of course. But I want to get your feedback on this proposal before going into the mobile route.

I guess the idea is to “flatten” all the blocks in a single column?
I’d be interested to see a mockup (in a separate proposal), as making the content of some blocks nice for screens with a small-width viewport is not so easy!

@tkrieck

Another option is to increase the font size only on specific places (like the latest blog posts and testimonials) but that would leave the rest of the site (internal pages) with the same legibility problem.

Is there a good reason to have some content with a smaller font?

I suggest moving this specific point to a dedicated discussion, as it seems to be a large topic that goes beyond the homepage.

@tkrieck

At the moment, users need to explore the homepage a bit to locate the “Download” and “Try” options.

I’m not sure if I understand that one. Afaik, the download and try buttons are directly visible at the top right when landing on the page.
I’m not against repeating them in the content of the main page, but I wonder if it wouldn’t be more efficient to find a solution that would make the easier to find on all page?

[amilica]

Hello everyone! Thank you for working on this, Thiago! I think your changes are very good and it would be a big step in the right direction.

My main comments are on the homepage itself.

The need for a bigger change

I’d suggest having a more dramatic change, one that is actually aligned with modern standards of design, but also pretty aligned with the design system of XWiki Standard.

As we know, xwiki.org is the first search result when searching xwiki. This means that xwiki.org is probably the first contact of many possible leads (leads = people that may want to buy support or any other offers/services provided by the main sponsoring company, XWiki SAS ). This is why I encourage a bigger change.

The main point would be that even in the redesign, there’s still too much information in certain sections.

We need to simplify everything from layout to actual text.

You can consider this another proposal

---

Implementation wise - this is HTML + CSS work so 1 day of work would be enough from my side.

---

First 3 screens/section (first 3-4 mouse scrolls) - they get the most attention from the user, they introduce the user into the product progressively

#0 Navbar - more UI related - maybe we could make the sub-menu in a light gray color that would seem invisible on the Folds Area and it would make every page lighter (as it adds less detail)

#1 Above the Folds area - tagline, alternative to, buttons and large product image. I think a centered layout for this section would work really well.

#2 Trust us area - very important to quickly build trust in a new user’s mind (especially if they know much about xwiki), we pull the testimonials to the top, below the client logos.

#3 Features / Usecases - We build a section that places main attention on Features and Usecases without putting them in the Above the Folds area, where they get lost in the detail.

The next 1-2 screens - If the user got to them, they are motivated enough to read more, so we can give them more intricate information / more advanced / more specific information

#4 Metrics - We pull the metrics of the project after section 3. I believe these metrics contribute to the idea of stability and reliability so they really shouldn’t be last in the page. They are also short enough and easy to digest that they can be added between sections 3 and 5

#5 Projects - After metrics, we build a section for sub-sections that would require more attention from the user:

• XWiki as a generic platform
• 800+ extensions
• Cristal - the modern knowledge base

#6 Blog posts are not extremely sought after by new users and old users probably know how to get to them in some way. Thus, they could be at the bottom in a small section. If we want to highlight the last release in some way, there are design solutions for this that wouldn’t imply a lot of space taken.

---

Let me know what you think @tkrieck , @mleduc , @vmassol and everyone else that will see this discussion

[vmassol]

@amilica

As we know, xwiki.org is the first search result when searching xwiki. This means that xwiki.org is probably the first contact of many possible leads (leads = people that may want to buy support or any other offers/services provided by the main sponsoring company, XWiki SAS ). This is why I encourage a bigger change.

xwiki.org is the home of the XWiki open source project, which is independent from the XWiki SAS company (or any other company or individual). It has its own governance, see https://dev.xwiki.org/xwiki/bin/view/Community/Governance

So the goal of xwiki.org is not to draw leads for XWiki SAS (or any other sponsoring company). It’s to draw users and devs for the open source project.

[LorinaB]

For me, the biggest opportunity with this redesign is tightening the story the homepage tells in the first screen. The new layout already goes in that direction. I’d suggest we explicitly structure the top part of the page so it answers, in order:

• What is XWiki, in one clear sentence?

• Who is it for (one liner)?

• What can I do next (2 main actions)?

If we align on that, it becomes much easier to keep all the other elements (Cristal, blog, testimonials, powered by, etc.) from competing with the core message.

On Cristal, this is a great chance to clarify the project ecosystem. I’d advocate for a consistent short tagline wherever Cristal appears (menu, homepage block, download area).

Having one sentence repeated everywhere helps newcomers connect the dots fast, and also helps everyone that will talk in external communication about “XWiki + Cristal” as a stack.

For typography, if we decide to touch font sizes, my only strong ask from a brand/content side is consistency. Having one clear base for xwiki.org (including docs and extensions) will make screenshots, tutorials, and external links look more coherent and modern over time.

I’d be happy to help with the the homepage copy and CTAs once the layout is stable, and to propose A/B variants for messaging if needed.

Now from a marketing perspective from the XWiki SAS team (XWiki SAS - the main sponsoring company XWiki Standard):

On onboarding, what would help us a lot in campaigns is to standardize a small set of entry points and reflect them clearly on the homepage (e.g. Playground, Cloud, Download, maybe MyXWiki). If these 2–3 actions are visually dominant on the page, we can reuse the same wording in ads, blog CTAs, and docs, so users always land on something that feels familiar.

[amilica]

I understand that completely. Well, even if we change from leads to users and devs, the same thinking applies.

Users want clarity when exploring a new product, don’t want to feel overwhelmed. They also want the product that they might use to feel and be competitive with what they might already use. It’s very important for users to feel like the documentation will always be there if they fail to do so.

Devs - I will suppose they want to engage with open-source projects that…

• don’t seem too hard to start with
• and/or engage skills they might have and/or are relevant to their dev journey (career or hobby)
• and/or make a difference in the world
• and/or are similar to proprietary product they use, but they want a better or just open-source version of it
• (other reasons can be added)

A homepage that seems cluttered and old-styled says - “this is an old project, not extremely well maintained, it might not be easy to start with, maybe uses old/unrelevant frameworks, the documentation might be very technical and all over the place“

We want our homepage to not say that.

[vmassol]

@amilica

I understand that completely. Well, even if we change from leads to users and devs, the same thinking applies.

Yes, we need to think in term of users and devs, not in term of leads. It’s not exactly the same though as you wouldn’t write the same text for leads or for users/devs.

@amilica

A homepage that seems cluttered and old-styled says - “this is an old project, not extremely well maintained, it might not be easy to start with, maybe uses old/unrelevant frameworks, the documentation might be very technical and all over the place“

(off topic)
Just to play the devil’s advocate (since I agree with you about having a nice and clear homepage - who wouldn’t want that? The devil’s in the details): Actually my past experience shows that developers are more likely to help on an open source project if they see something not finished and where they could help. Projects with nice web sites, nice docs, nice code, people answering questions, don’t attract developers that much, since there’s nothing to fix and it’s hard to fix something (the low hanging fruits have already been covered). This is a bit what I mentioned in Vincent Massol Think Tank - How can I improve my OSS project managment skills?
(/off topic)

[amilica]

@vmassol

Just to play the devil’s advocate (since I agree with you about having a nice and clear homepage - who wouldn’t want that? The devil’s in the details): Actually my past experience shows that developers are more likely to help on an open source project if they see something not finished and where they could help. Projects with nice web sites, nice docs, nice code, people answering questions, don’t attract developers that much, since there’s nothing to fix and it’s hard to fix something (the low hanging fruits have already been covered). This is a bit what I mentioned in Vincent Massol Think Tank - How can I improve my OSS project managment skills?

I don’t think this is actually off topic, tbh.

I think this may be an actual effect happening, but it’s happening also because it’s not very easy to figure out what to fix when just discovering a project. Most open-source projects (even the really polished ones) don’t have any way of quickly discovering their to-do list from their website. So if we fix the second the problem with a subtle CTA in the first 2 screens/sections of the homepage, the polish of the homepage shouldn’t matter.

[tkrieck]

Hi everybody, sorry for the absence, but I’m back now to answer some of the questions.

@mleduc

Is there a good reason to have some content with a smaller font?

Sometimes this is desirable for less important pieces of content (dates of postings for example). But here there are a lot of content that’s long text format.

@mleduc

I suggest moving this specific point to a dedicated discussion, as it seems to be a large topic that goes beyond the homepage.

That’s ok, we can always change the specific points directly on the homepage and not affect the whole instance.

@mleduc

I’m not sure if I understand that one. Afaik, the download and try buttons are directly visible at the top right when landing on the page.

Visible, yes. But outside the “flow” of reading starting on the banner.

@mleduc

I’m not against repeating them in the content of the main page, but I wonder if it wouldn’t be more efficient to find a solution that would make the easier to find on all page?

This optimization is not necessary on other pages because they (1) might be dedicated to downloading or (2) not the overall purpose of the page (like the documentation or the blog for instance). For those cases, the download/try only on the header is fine. The thing with the homepage is that we want to give the user an overview of the project and present testing options as quickly as possible.

@amilica

I’d suggest having a more dramatic change, one that is actually aligned with modern standards of design, but also pretty aligned with the design system of XWiki Standard.

I liked your layout options as it expands on mine quite well. And I think we can do it quickly at least partially now. See below:

@amilica

#0 Navbar - more UI related - maybe we could make the sub-menu in a light gray color that would seem invisible on the Folds Area and it would make every page lighter (as it adds less detail)

I’m not against it, but changing this would touch every page on xwiki.org ,and we should test it to see if this also works on internal pages.

@amilica

#1 Above the Folds area - tagline, alternative to, buttons and large product image. I think a centered layout for this section would work really well.

+1 nice one

@amilica

#2 Trust us area - very important to quickly build trust in a new user’s mind (especially if they know much about xwiki), we pull the testimonials to the top, below the client logos.

+1

@amilica

#3 Features / Usecases - We build a section that places main attention on Features and Usecases without putting them in the Above the Folds area, where they get lost in the detail.

The next 1-2 screens - If the user got to them, they are motivated enough to read more, so we can give them more intricate information / more advanced / more specific information

I think this one might need more proposals. I understand the main idea and I agree with it, but we’ll need a proposal ready for these two areas. From what I can see, it is like taking the first banner and breaking it even more than I’m proposing and including the “Powered by” into it as well. My point is that we need that the content that we have now can be laid out nicely as you put in the boxes, OR if we need to add/remove stuff to fit everything together.

@amilica

#4 Metrics - We pull the metrics of the project after section 3. I believe these metrics contribute to the idea of stability and reliability so they really shouldn’t be last in the page. They are also short enough and easy to digest that they can be added between sections 3 and 5

Another option would be to put them together in the “Trust Us” section. But maybe that would leave that section too “light” (for lacking a better word) with little pieces of light content.

@amilica

#5 Projects - After metrics, we build a section for sub-sections that would require more attention from the user:

+1

@amilica

#6 Blog posts are not extremely sought after by new users and old users probably know how to get to them in some way. Thus, they could be at the bottom in a small section. I

My opinion is to remove it altogether from the homepage.

@amilica

If we want to highlight the last release in some way, there are design solutions for this that wouldn’t imply a lot of space taken.

I like this as it is a nice way of leading someone that got so far in the home content. +1 from me

@LorinaB

I’d be happy to help with the homepage copy and CTAs once the layout is stable, and to propose A/B variants for messaging if needed.

Thank you for offering your help @LorinaB. I guess this goes hand in hand with the option @amilica is proposing. And also with what I replied about point #3 from her proposal above.

@LorinaB

I’d suggest we explicitly structure the top part of the page so it answers, in order:

• What is XWiki, in one clear sentence?
• Who is it for (one liner)?
• What can I do next (2 main actions)?

This specific part I think is not too hard to start right now. The first banner can be reworked like your first and second points. And the third one is close to the one already in the proposal.

@LorinaB

On Cristal, this is a great chance to clarify the project ecosystem. I’d advocate for a consistent short tagline wherever Cristal appears (menu, homepage block, download area).

Having one sentence repeated everywhere helps newcomers connect the dots fast, and also helps everyone that will talk in external communication about “XWiki + Cristal” as a stack.

I agree. For this proposal, I just copied what we have on cristal.xwiki.org so it’s not optimal. It would be nice to have a specific proposal about this on the Cristal category here on the forum, it’s easier and more focused to discuss that way.

@vmassol

Projects with nice web sites, nice docs, nice code, people answering questions, don’t attract developers that much, since there’s nothing to fix and it’s hard to fix something (the low hanging fruits have already been covered).

This is a very interesting perspective and one that hadn’t crossed my mind until now, thank you.

@amilica

So if we fix the second the problem with a subtle CTA in the first 2 screens/sections of the homepage, the polish of the homepage shouldn’t matter.

I really like this idea, and it could be done in the current website also (before starting bigger changes)

[tkrieck]

Hello everybody! So far most of you didn’t have any feedback regarding the items under Increased Visibility for Cristal. Should we consider them ok for implementing the way it’s proposed?