cellear's picture

Posted by cellear on Tue, Feb 25, 2020 - 8:50am --- Updated: Jun 11 '20 - 5:23pm

People should be able to use backdrop without needing to know how to create or modify a theme.

(This initiative was originally titled "Include several ready-to-use themes" but the name has been changed to allow other implementation options.)

Many potential users of Backdrop are not themselves skilled visual designers, and don’t have access to (or the resources to afford) a suitable designer. We should offer site builders the capability to create usable sites even if they lack either the technical ability to edit the HTML, PHP, CSS, JavaScript, and media elements that comprise most themes, or the design skills necessary to select visually-pleasing options.  Or both!  Backdrop is a content management system, we shouldn't require our users to bring to the table anything besides the content they are looking to manage.

For an initial MVP, I propose that we find or construct three or four ready-to-go themes, and either include them with the basic download, or make them a one-click install.  In order to be usable by the most inexperienced user, the themes should be:

  1. Usable out of the box, without requiring any customization, programming, or configuration.
  2. Fully tested and debugged, so that the can be expected to work for a common set of defined use cases
  3. Limited in number, so that anybody needed to support Backdrop will know how many ready-to-go themes are available and what they are
  4. Fully documented, so that users know what to expect without having to explore the themes themselves.

Once again, I think WordPress does a good job with this.  In WordPress, It's possible to "try on" a theme without committing to it, which I think is both cool and useful.

Accepted answer

The PMC has voted that Theme development should not be necessary to use Backdrop CMS should be an official Backdrop initiative. 

Luke (@cellear) you are it's lead, and we would love an update from you each week in the developer meeting, starting next week. If you can't make the meeting that's fine, but please drop an update here in these comments :)

Most helpful answers

In the meantime, there have

In the meantime, there have been some suggestions in the Ready to wear thread of the Backdrop Zulip live chat which 3rd party templates or themes could serve as example for Backdrop themes. I'm listing the suggestions here for reference:

I don't feel strongly about

I don't feel strongly about having these themes in core. But, I do think that the lack of available out of the box finished themes is hurting adoption of Backdrop CMS and that an initiative to make sure that there are more theme options in either contrib or core is important.

Comments

Tue, Feb 25, 2020 - 11:15am by stpaultim

I don't feel strongly about having these themes in core. But, I do think that the lack of available out of the box finished themes is hurting adoption of Backdrop CMS and that an initiative to make sure that there are more theme options in either contrib or core is important.

Olafski's picture

Tue, Feb 25, 2020 - 2:03pm by Olafski

Having more ready-to-go themes in Backdrop would be great. Do you already have specific themes in mind?

I guess, if we want to provide them in Backdrop core, the expected quality standard could be a barrier. In my opinion, a realistic goal would be one new core theme a year (like WordPress does btw, as far as I know).

Some ideas for discussion:

  • Look for nice WordPress themes, and port these.
  • Start to build ready-to-go themes in contrib and see later which are good core candidates.
  • Build the ready-to-go themes as sub-themes of the Basis core theme, so that we have a good starting point and quality standard.

    (I've some more thoughts regarding the Basis sub-theme idea but had no time so far to elaborate them.)

Wed, Feb 26, 2020 - 10:48am by brad.bulger

I agree that having more themes available, whether core or contrib, would be great. I'd add that many themes seem to be geared towards read-only types of sites. Most of the sites I've ever been involved with using Drupal or Backdrop have been heavily interactive, with most of the content coming from the users, not being presented to them. So good looking forms, menus, etc. are important.

Wed, Feb 26, 2020 - 12:34pm by cellear

I don't have specific themes in mind.  My thought it to have an experience as close as possible to http://www.csszengarden.com/ , which is a demo site that shows the range of experiences that can be accommodated with CSS.  CSS Zen Garden is built around a single HTML page, and allows you to change the attached stylesheet to show the dramatic differences that can be achieve using only CSS.

I'd like people to be able to have a similar experience with Backdrop, where they can select between a small number (at least 3, no more than 5 or 6) themes and see different usable presentations.

 

 

jenlampton's picture

Thu, Jun 04, 2020 - 2:04pm by jenlampton

The PMC has voted that Theme development should not be necessary to use Backdrop CMS should be an official Backdrop initiative. 

Luke (@cellear) you are it's lead, and we would love an update from you each week in the developer meeting, starting next week. If you can't make the meeting that's fine, but please drop an update here in these comments :)

Fri, Jun 05, 2020 - 11:33am by cellear

Awesome!  Off we go.  I think it makes sense to move development to github; I'll create an issue, and then post the link here.

Thu, Jun 11, 2020 - 6:47pm by cellear

Here are some adjectives that can describe themes.  Ideally the R2W themes would display different combinations of these attributes.

  • dark/light
  • playful/businesslike
  • parallax/full-bleed/video backgrounds/special effects
  • retro/modern/edgy/futuristic/minimalist
  • compact/open
  • flat/3D/Material Design/skeuomorphic
  • monochromatic/colorful
  • vibrant/muted
  • chunky/elegant
  • simple/elaborate
  • textured/shiny/glossy/fuzzy
  • Asian/African/Middle Eastern/teutonic/western
  • Avant-garde/brutalist/impressionist
  • sports/activities/interests
  • Bootstrap/SASS/color picker

I think our theme choices should include both light and dark themes, and both businesslike and...less businesslike.

What did I miss?  Which of these seem most critical?

 

 

Olafski's picture

Fri, Jun 19, 2020 - 12:13pm by Olafski

In the meantime, there have been some suggestions in the Ready to wear thread of the Backdrop Zulip live chat which 3rd party templates or themes could serve as example for Backdrop themes. I'm listing the suggestions here for reference:

Thu, Oct 22, 2020 - 5:47pm by cellear

At today's meetings, I promised to provide a burndown lists of tasks needed to complete R2W -- at least, to a releasable phase.  Here's that list:

Themes

  • Complete list of candidate themes
  • Group them into broad, easily-differentiable categories
  • Choose the best (or most appropriate) representative from each category
  • Theme Switching.  Is it possible to mimic a tabbed interface like the Style Guide module provides for other content?  
    http://ready2wear.simplo.site/admin/appearance/styleguide/pelerine
    (Or other customizations to the switchtheme presentation, for example as something other than a select list -- it would be nice to have the list of theme remain visible)
  • Thumbnails would be nice.  Perhaps not just a screenshot, but I some standard content?  Theme Thumbnails seem to mostly show off the content selected for a fake home page, they often don't tell you much about the themes themselves.
  • Perhaps some guidelines for describing themes that doesn't sound like advertising copy?
  • Bare minimum would be Bootswatch presentation: https://bootswatch.com/ Very minimalist, but you can see at lest some of what changes.
  • Wordpress theme page does not do a good job of presenting differences.  All the thumbnails really tell you about is the layout and content on the front page: https://wordpress.org/themes/
  • Themeforest might help: https://themeforest.net/category/cms-themes

(Our task is simpler -- we don't have to describe all themes, we just need to provide a few solid options.)

Layout

  • We've moved some key elements that affect appearance out of the theme system and into our new Layout system.  For Wordpress, Drupal, and other systems one of the big differences between themes is layout.   Is it possible to provide new users with a way to choose from pre-packaged layouts? 
  • This page, from the Drupal Out-of-the-box initiative, is mostly about layout. It demonstrates a few layouts.  Could we package a few choices that work with different themes, content, and color palettes?
  • Our layouts are powerful, but confusing.  Is there a better way to convey the differences than this set of tiny icons?:
    Core Layout Templates

Color palettes

  • Should a choice of color palettes be a selectable option, like themes and layouts?  Is this dependent on color module support?  How many themes have that?  Should we promote that?  (Should we limit R2W themes to those that support color module?)

Content

A lot of the differences in the thumbnails presented with themes on Wordpress, Drupal, and our our Themes page is due to the choice of content displayed in the thumbnails.  This exaggerates the differences between themes in a way that isn't helpful -- people can be drawn towards one theme over another for reasons that don't have anything to do with the themes themselves.  It would be nice to have an easy way to compare themes (and ideally also layouts and color palettes) with the same content, probably a choice of content.

The Drupal out-of-the-box initiative was mostly about content:

Designs for the Out of the Box experience intiative [#2900720] | Drupal.org

Documentation

Ultimately, I think a key deliverable for this initiative is a bit of documentation, in the form of a checklist: follow these steps to get started with a good-looking site. The default Dashboard content points in this direction:

Get started

 but to get a newbie going we need more detail than that.  Perhaps something like:

  1. Create necessary content types (if "page" and "post" aren't enough -- ideally I'd like to delay this a little)
  2. Create/gather/generate enough content to fill things out
  3. Choose and customize your layouts
  4. Select a theme
  5. Select a color pallette
  6. Set theme options, if applicable.

The order of these options can certainly be shuffled around.

The scope of how to create a good-looking site is obviously potentially huge, and I don't want to pretend we can cover it all.  That being said, for topics we don't cover, we may want to point to other sources of information.  (Particularly on topics that newbies might not be thinking about, like mobile presentation, accessibility concerns, multi-lingual options, security, and maintainability.)