MODX 2020 Follow-up Article #1

Introduction

Back on August 18, I published an article here on Medium.com called MODX 2020 (and included in MODX.today). The basic premise of the article was to answer the question, “How do we make MODX more popular?” Go read it (or re-read it if that’s the case), or be lazy and keep reading below for some of the main points with my follow-up on them.

Since then, I have actually taken strides to start to exercise some brain cells and push some pixels together to flesh out one of the aspects of my vision: the MODXpress manager. This article is the first in a series of articles on different aspects. I considered sticking it into one giant article, but the simple reality is that I know you’re busy, and you’d rather read something quick and get on with your day.

This article starts with some general requirements I set with myself, and then focuses on basic navigation suggested and the dashboard page to display.

Need for a Second Manager

In the MODX 2020 article, I wrote about the need for a separate tool from the current MODX manager, called MODXpress. This tool would use the same core as MODX3. MODX3 is around the corner, but I decided not to wait, and rewrite history and start to work off of the current version of MODX.

To make this less of a chore on my side, I set myself a few requirements, which boil down to these simple ones:

  1. Make this an extra to install instead of a whole new tool that replaced the current manager. The rationale is that even in the end state, I would want any “manager” I created to be supplemented by the real manager.
  2. Make this work with MODX right now. The rationale is that there should always be a way of making MODXpress work within the context of a given core. If there is some way in which I want to extend what MODXpress does beyond what the current MODX core has, in the long run, maybe they make it into the core, but most likely, they just get incorporated into the extra. Notice that the word MODXpress has MODX in it.
  3. Use existing extras whenever possible. I don’t imagine myself much of a competent designer, nor a developer. I’ve always found that when you suck at doing something, find those that are good at it and use what they’ve done. (If anyone asks, I’ll officially go on record as saying I wanted to be efficient, because efficiency sounds a lot better than incompetence!)

A Quick Look at WordPress

In MODX Cloud, I installed WordPress to learn from it. Why? Because I honestly never used WordPress, and objectively, WordPress got a lot right when it comes to usability which is clearly demonstrated in their market share. I also think that just because you don’t use a given tool, it’s not justification to just dump on it. As for mockery, that’s different in my books and should be applied equally to things either loved or not.

So I installed WordPress, and I saw the login screen, which is simple, just like the MODX Manager.

Then I looked at the Administrative side of WordPress.

WordPress Dashboard

Right away, I knew that it was designed to be a blog administration tool. Why? The number of new comments, shows in the top-left corner, Posts is the first item in the main navigation and Comments is the fourth.

Tie-back to MODXpress: MODXpress should not try to compete with WordPress as a blogging tool: it should have a more generic approach. As well, with sites like Medium.com, the need to create a blog website becomes much less important.

The navigation items are well laid out, and are grouped in a way that I think most people would like.

Probably most impressive, is that there is the idea that even without searching around, the top part of the default dashboard begs to be customized, complete with a “Customize your site”. Just by clicking on this, you can make a lot of changes to your site. What I think works really well is giving the end user some smart categories, and then a few simple options. I think that it makes sense to provide a few more options, but not to overwhelm them. Another thing I like about the WordPress Administrative side of things is that it doesn’t keep reloading pages. Clicking on “Customize Your Site” brings up another page, but it’s not continually doing long page loads.

The Administrative site is also responsive (I installed and upgraded to 4.3.1, which was launched September 15, 2015).

Putting Together the Shell of MODXpress

Just having taken that quick tour, I figured I had enough to start on something for MODXpress. So I created a project, added Bootstrap and FontAwesome, and then started to screw around with adding some navigation with sub-pages. I used WordPress as an example, but I made changes where I thought they made sense.

WordPress Navigation
MODXpress Navigation

The main thing that would be different other than some labels is that instead of the home icon, it uses the MODX icon provided (as of November 20th? 2015) by FontAwesome! This is partially to suck up to you the reader who is no doubt both a MODX fan and a FontAwesome fan, but in a more general sense, it is used because in an international context, HOME means nothing.

Designing the Experience for the Initial Set-up of MODXpress

Then I looked at what the main task should be: for someone just setting up their site, you want them to feel like they know what’s going on and let them to accomplish something quickly. The best way to do that is to give them a few options. And the option that will make the most sense to a given user depends (partially at least) on their personality. There are those that just want to jump right in and get their hands dirty and will ignore documentation given to them. For them, we provide a site generator or adding a new page. For those that are the kind of person to read an entire textbook on a topic before diving in, we have a quick tour with a gift shop in the form of documentation at the end of the tour.

MODXpress Dashboard for the first time login

Site Creation Wizard

The Site Creation Wizard would ask you (if it were built, which as of now has not been) the type of site you want to build:

  1. A blog (i.e. Latest blog post page, individual blog entries and and an “About Me” page)
  2. A forum (i.e. main page of topics with sub pages for threads and blogs)
  3. A site for some business selling goods (i.e. home page, product gallery, individual product, contact page, location page)
  4. A site for an independent restaurant

As you can see, this list is far from exhaustive, but each choice would give you a full site up and running anywhere from within a few minutes to a few hours with no programming needed!

Once you select your site, you would be guided to those pages to edit using the same placeholder/value method which WordPress uses. There would be no mention of a chunk, a snippets, etc.

Again, I stress that I have not built this yet but will eventually and put it as a separate article.

Adding a New Page

Adding a new page would let you add one of many types of pages to your site. Just like in the Site Creation Wizard, once you add a page you could customize it.

The Tour

The tour for people who have not yet set up their site would walk them through the tool at a high level explaining the navigation, etc. Remember that this tour would stay non-technical: We’re not trying to teach them to program, we just want them to understand the way that MODXpress Manager works.

Feedback

Medium is a great tool for soliciting feedback, so feel free to make use of it.

Preview of Article #2

I’ve taken up enough of your time for today. You need to go see that person about that thing, or else you’ll have a bad rest of the day, and I don’t want to be the reason for that.

But before you go, Article #2 (which should be coming out in the next week or so) will focus on the post-MODXpress-site-setup experience with the Dashboard as well as explaining more about the Site Creation Wizard and Adding a New Page.

Later articles will delve into other parts (shown in no particular order) like:

  1. Media manager
  2. Pages
  3. Appearance
  4. Extras
  5. Security (I think you’re going to like this one)
  6. Settings

Thank you for reading.