New Moodle.org theme and menus

New Moodle.org theme and menus

by Martin Dougiamas -
Number of replies: 18
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
It's been some years since Moodle.org had a facelift but yesterday I finally switched over to our new "Moodle2" theme.

It's far from perfect yet, but it's usable and we hope you like it better than the old theme.

Some of the things still being worked on over the next couple of weeks are:

* better artwork for the front page and the other top-level content
* translating all the top level pages and menus into every language we support (the texts will be included in all standard language packs)
* creating versions of the same theme and menus on Moodle Docs and Moodle Tracker
* adding a few more things to the menus
* fixing a few small accessibility issues
* any other suggestions you come up with (MDLSITE-132)

Thanks to Helen and Julian and many others for their help and suggestions with the theme and menus, and especially Urs who came up with most of the new "look" and code. Cheers guys.
Average of ratings: Useful (1)
In reply to Martin Dougiamas

Re: New Moodle.org theme and menus

by Matt Gibson -
Nice job! smile

Will this theme, or a variation of it be available for download? I think the clean, uncluttered look would be a more friendly way into a lot of sites.
In reply to Matt Gibson

Re: New Moodle.org theme and menus

by Martin Dougiamas -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
Well, right now there is still heaps of work to do ... I estimate the new "look" is still only about 50% done. I'm working myself pretty much full time on tweaking things at the moment ... Something based on this might end up as a new theme in Moodle 2.0, but it won't look exactly like this theme. I think it's important that Moodle.org is a bit unique on the web.

Codewise for the menus and top level pages etc there is a lot of hardcoded PHP and a lot of magic going on, since the virtual "moodle.org" server is actually spread out across many physical machines and systems. All the strings are in language files. So this wouldn't be too useful for most Moodle sites.

What would be useful would be packaging all this up with a nice GUI into a proper CMS system for the front end (and there are a couple of modules/hacks out there already awaiting review).
In reply to Martin Dougiamas

Re: New Moodle.org theme and menus

by Chris Collman -
Picture of Documentation writers
I get it. Magic and branding, with a pinch of Martin, what a combination and hard to duplicate I am suretongueout.

I like the big buttons to push, the tabs and less busy front page as option. I think all those pieces are around. Maybe I should start a doc page "How to achieve the Moodle2 theme look without hardcode and magic".

That larger project will be on the backburner because I still have 26 quizzes to vet for our instructors.

Best Chris
In reply to Chris Collman

Re: New Moodle.org theme and menus

by Chris Collman -
Picture of Documentation writers
Hi all,
This is sort of stupid looking at the moment. Here is a draft of the Main page of Moodle Docs. For concept only, this pushes my mediawiki skills.

I was trying to see if it should have a 4 or 6 block link look. What the words should say and where.

And I don't have the letter generating software to complete the "Moodle Docs" so I cut off an O and it is "Moodle Doc" smile I don't have ideas for icons for teachers, admin, developers to place in the blocks, so I repeated the support group.

It is odd how the support group sort of looks unfinished or incomplete and the community group is all tied together. Wonder if we took an M, spun it 180 degrees, then rotated it to the angle of the disk, then put the support figures on it ? Wow, that is fancy and WAY beyond my Adobe Photoshop skills...maybe smile Hummm, there is an idea. Nah, I better go back to moving wood into the house and let someone with graphic skills make that call.


In reply to Chris Collman

Re: New Moodle.org theme and menus

by Matt Gibson -
Looks much better. I think different icons would improve it so that the options are visually distinct, but of course that can come later.

I'd really like to see a 'featured article' or something like Wikipedia has, but perhaps on a weekly basis, rather than daily so as to reduce admin. It would be great if this space were used to stretch people's existing skills or highlight things that can be done with Moodle that may not be very well known, but I'm not sure that many of the articles at the moment would be well suited.

What I've been thinking is that we have a lot of rather long pages that give very specific technical details about one thing e.g. adding a new assignment, but not a lot of the surrounding socio-technical knowledge that really makes Moodle useful in a practical setting. What would IMHO work better would be meta-pages, talking about e.g. how to setup your first assignment with an existing class that has little experience of Moodle. The focus would therefore be mostly on the social and organisational aspects and would point to the existing technical pages for reference. More of a how-to model than an encyclopedic one.

I think this probaly counts as off-topic now... mixed
In reply to Matt Gibson

Re: New Moodle.org theme and menus

by Chris Collman -
Picture of Documentation writers
Hi Matt,
I like your off topic comment. I took what I liked from your words and started a new thread in the MoodleDocs forum. Since I work with the encyclopedic viewpoint, I have issues AND recognize as the perpetual newbie, the need of what you are saying. So how do we do it is my post in MoodleDocs, with some suggestions of course.

Great off topic remark.

Best to all Chris

In reply to Martin Dougiamas

Re: New Moodle.org theme and menus

by Matt Gibson -
Agreed that moodle.org should be unique. I was thinking along the mini-CMS lines as well, especially regarding the drop downs, as it makes navigation more intuitive and consistent for those less familiar with breadcrumbs. I might start fiddling around with YUI to make one if I ever get any time.
In reply to Matt Gibson

Re: New Moodle.org theme and menus

by João Fernandes -
Hi to all
congratulations for the new theme!
I would like to ask two things:
  1. how can I integrate media wiki like you did, keeping the menus and logo on top, as in http://docs.moodle.org/
  2. how can I add the search box to the menu bar?
I would like to use these in http://laboratoriosescolares.net, which I started from Shaun's Newbury College theme (thanks Shaun). As you can see from the questions I'm not a programmer and maybe it's hard to explain it? :P
thanks
J
In reply to João Fernandes

Re: New Moodle.org theme and menus

by Tim Hunt -
Picture of Core developers Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers
There is very little integration. We just made a theme for MediaWiki that looks just like our theme for Moodle.

The search in the menu bar is a Google site search box. You can get the necessary HTML for that from Google, then you just need to add it to the header.html of your theme.
In reply to Martin Dougiamas

Re: New Moodle.org theme - where is code?

by Chris Collman -
Picture of Documentation writers
I have the same question as Matt? Where is the theme being kept for the current version of Moodle2, so some of us can look at it as a theme? How do those buttons work and new menus work?

I realize this is a moving target. Most of the heavy lifting seems to have been done, so how about a peek. BTW, I like it.

Just noticed the change of a couple of buttons on the front page of moodle. org (I liked the hands for support not keen about the side by side figures. Give the community button, why not a pyramid of 2 or 3 high figures that support and build ? Let me guess, that conveys a balancing act or a circus. I don't buy it from the inventor of the "Smiley cake". smile

I do think the new community button and those figures work. I think somebody changed the develope and download images which also seem OK to me.

Best Chris
In reply to Chris Collman

Re: New Moodle.org theme - where is code?

by Chris Collman -
Picture of Documentation writers
Much better icon for support. Two tier, plus shows interlocking support between everybody that hints at a puzzle with smiling faces, so it has been solved.

Best Chris


In reply to Chris Collman

Re: New Moodle.org theme - where is code?

by Martin Dougiamas -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
Glad you like it Chris! Yes I liked the idea of the reaching hands the most too but it turned out to be just too hard to render them clearly in the same style as these other icons which people seemed to like. But the pyramid is good too. Yes

What do you think about using the icons in the background like http://moodle.org/support ? Or should it just be plain like http://moodle.org/community ?
In reply to Martin Dougiamas

Re: New Moodle.org theme - where is code?

by Chris Collman -
Picture of Documentation writers
Helen has beaten into my head big grin, if such thing are possible: Plain is generally better. The background in support looks like a smudge on my monitor at home (with my old eyes). It does not add anything, IMO.

I can live with the "float", but it seems to be missing something. On the front page it lives in a box. Don't know if repeating the disk that Community stands on is a good idea, maybe a rectangle of the same color. Putting it in a box does not excite me. Placing it over a faded orange "M" will probably create more rendering or smudge issues.
In reply to Chris Collman

Re: New Moodle.org theme - where is code?

by Martin Dougiamas -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
Exactly ... my thinking with the "smudge" was to try and connect that image with the page better ...

Not sure the circle will help ... then it will just be floating too ...
In reply to Chris Collman

Re: New Moodle.org theme - where is code?

by Matt Gibson -
I have to say I agree about it needing to be on top of something. The community one does look a lot more complete because of the circle they're on. Odd really.
In reply to Martin Dougiamas

Re: New Moodle.org theme and menus

by Matt Gibson -
I just found Planet Moodle and like it a lot, but it's not immediately clear what it is - blog entries from developers plus news stories I assume, but for a novice who wouldn't know all the faces, it might be a little baffling. I would suggest a small para at the top to explain the sources.

Also, would it be worth having Planet Moodle as a parent item for indented sub items like Moodle news and Moodle buzz, as these are combined within Planet Moodle?
In reply to Matt Gibson

Re: New Moodle.org theme and menus

by Helen Foster -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers Picture of Translators
Matt, thanks for your feedback. I agree with you that Planet Moodle needs an introductory paragraph, so I've added it as an improvement to the tracker - MDLSITE-624.
In reply to Martin Dougiamas

Re: New Moodle.org theme and menus

by Olli Savolainen -
Wow, this is light years away from the old theme! Congratulations indeed, I love it.

In addition to the much needed simplicity introduced, bringing consistency across docs and the tracker makes moodle.org more usable, also when evaluating it by means of usability heuristics.

In addition, the graphical design really pleases my eye.