Theme progress update and screenshot

News
1

Howdy all,

I’ve been working on backend stuff in the theme lately, so the appearance hasn’t changed much; thus no screenshots lately. But, definite progress is being made. I’ve got most forms working, most menus working, and reasonable error messages for some things that don’t work yet. It’s getting closer to being actually usable. History/back button is still in progress, and needed before an alpha release, but I’ve got my head wrapped around the History API and Jamie and I have come up with a reasonable URL scheme that should work OK (it’s not perfect, but it is already better than the current framed theme, in terms of useful URLs…bookmarking of specific pages is going to become possible again, for the first time in seven or eight years since we moved to a framed theme).

But, there has been one cosmetic change that I think looks really nice. The icons_table function has been updated to use Bootstrap components, and it looks awesome (and is responsive, so it acts right on small screens, unlike the old table-based layout):

So, here’s the screenshot:

http://i.imgur.com/VxiFTqG.png

This is shown with the Ubuntu-inspired theme…as mentioned in a previous post, when this thing ships it’ll include a bunch of nice themes from Wrap Bootstrap, in addition to the very nice stock “flat” theme provided by Bootstrap 3.0. We’ll probably hire someone to work on a design of our own, assuming we have the budget for it (we’ve gotten a couple of donations to the theme fund, but only enough for an hour or two of a good designers labor…so we’d be pulling from the general company fund, which isn’t big enough to hire a good designer at the moment).

I keep being surprised by bits and pieces that need to be converted…Webmin is vast, and I’m being reminded daily of how vast, and it has a whole lot of layers of complexity in its UI. Sometimes things are much more complicated than they need to be (for now; we have big plans to correct those problems and also free ourselves from a lot of the technical debt in Webmin that has accrued over the years). It’s gonna be a little while longer before this thing rolls out for users (it still doesn’t actually work for most things…still some forms to fix, and a lot of paths to fix), but I’m knocking one or two things out each day. And, even after alpha, we’ll need another month or two to knock out issues with accessibility issues (we take great pride in Webmin’s usability for sight-impaired users, and don’t plan to lose that), other languages, and cross-browser and cross-device usage. While it’s theoretically responsive design, a lot of stuff isn’t very usable on tiny screens yet.

Back to the Javascript mines…will stick my head up and post updates when I’ve got something fun to report, hopefully daily now that we’re in the final days before an alpha release…

Cheers,
Joe

2

Today’s screenshot of happiness (at least, it makes me happy):

http://i.imgur.com/e5ilWQh.png

What I’ve been working on today is getting rid of all of the random links you find on the Virtualmin/Webmin System Information page (the “Configure this page”, “Refresh system information”, and “Virtualmin/Cloudmin documentation”), and putting them into nice little menus in the top navigation bar. I think it simplifies things a bit, and categorizes them into sensible locations.

What you can’t see in the screenshot is that there’s also a “Profile” and “Read Mail” link under the “Login: root” bit (that may become a little icon dude, though I do want to keep the information about who is logged in, since it’s been removed from the left menu section now).

I’ve got a handful of other bits to get rid of in the left menu (“List Virtual Servers” and “System Statistics”), but it’s 3AM, and time for all good Joes to go to sleep. Will tackle them tomorrow.

For now, I find the top navigation bar very aesthetically pleasing. (BTW-this is the stock Bootstrap 3.0 theme, which I think looks really nice, if a little plain, but as mentioned there will be several others to choose from.)

3

Very nice, can’t wait to get my hands on this thing! :slight_smile:

4

If I may add a suggestion, which actually I wanted to do in a long time but you catched me on a day where I am less lazy than usual :stuck_out_tongue:

Looks aside, what I always didn’t like so much from an end user perspective is the way the menu is organized. It makes it hard to find things. Actually I sincerely feel it’s a mess. It’s all over the place.

I think that reorganizing / renaming some things would greatly improve the usability. So I took the liberty to have some thoughts and came up with this revised structure. I did not rename any link (except when noted), the only thing I did was reorganizing things into new groups. Of course I might have missed some things, since I probably don’t have all features enabled in the account I used to look at the menu, but I think you should get the idea.

Here it is:

  • Virtual Server
    • Edit Virtual Server
    • Create Virtual Server
    • List Sub-Servers
    • Resend Signup Email
  • Accounts
    • Edit Users
    • Manage Extra Admins
    • Change Admin Password (formerly Change Password)
    • Change User Passwords (formerly Change Passwords)
    • DAV Authentication
    • Change Language and Theme
  • Files
    • File Manager
    • Upload and Download
    • Protected Directories / Protected Web Directories (should be combined)
    • DAV Shares
  • Status
    • Disk Usage
    • Check Connectivity
    • Running Processes
  • Web
    • Edit Web Pages
    • Install Scripts
    • Website Options
    • Website Redirects
    • Edit Proxy Website
    • Proxy Paths
    • Preview Website
  • Database
    • Edit Databases
  • Mail
    • Edit Mailboxes (same as Edit Users)
    • Edit Mail Aliases
    • Spam and Virus Delivery
  • Version Control
    • Subversion Repositories
    • Git Repositories
  • DNS
    • DNS Records
    • DNS Options
    • BIND DNS Server
  • Reports
    • Awstats Configuration
    • View Awstats Report
    • Analytics Accounts
  • Logs
    • Apache Access Log
    • Apache Error Log
    • Logged Webmin Actions / Webmin Actions Log (should be combined)
    • System Logs
  • Backup & Restore
    • Excluded Directories
5

Those are great ideas, Hal9000. I think the new theme is a good time to look at usability with fresh eyes. The last time I did any usability studies was about seven years ago. Virtualmin has gotten more complex since then, in that a huge array of new features have appeared, and new configurable options have shown up. Simplifying and making things more intuitive is always high on our todo list, but it’s not always easy to see the forest for the trees, in terms of what would make it easier.

Sometimes ease of use simply means “What I’m used to”, so we have to be careful about moving things around…but, if we’re going to break with tradition with the new theme (and we are) and the new Webmin 2.0 branch (and we are, it’ll be the first time Webmin has ever broken backward compatibility with modules and themes), we might as well take this chance to fix some usability mistakes we’ve made in the past.

I’d love to hear from other folks on how this particular categorization of links sounds, and if there are any changes folks might like to see from this. Or, if there are things that folks think really shouldn’t be changed.

6

Here are a few things people keep asking me about accessing. They have trouble with the webmin section.

Mail Queue (postfix or sendmail whichever is enabled)
Change root password
etc

Things you would do on a cPanel or Plesk box, to make it more user friendly for people switching over.

7

Changing root password I’ve already begun to address in the new theme…there’s a User menu now in the top bar which includes a link to editing the user, including password (and maybe eventually a “Change Password” popup box that makes it really simple, I dunno).

As for mail queue…I’ve added a Read Mail link in the user menu, which would take users directly to the root mailbox (or the mailbox of whatever user is logged into Virtualmin). But, you’re thinking of the system Mail Queue management page? Is that something that people need to look at often? I can’t remember the last time I looked at our mail queue. I’ve checked the mail logs occasionally, but the queue…hmm…what’s the use case for that?

8

I keep having people ask me where they can see the mail queue, lots of people. A few of them comment how easy it was in cPanel/WHM to look at the queue.

My idea was to make it more easier to use, right now they have to click webmin -> servers -> postfix -> mail queue.

My idea was something under system information or somewhere else to show the mail queue page depending on which SMTP server is selected in the configuration.

I love Virtualmin, but a lot of people won’t use it because things are too difficult to find. I am not suggesting making it look like cPanel, but make the basic stuff in WHM accessible from the main screen, without having to dig in the Webmin tab.

Also another is smart relay/relayhost, that is buried in the postfix module.

9

Very very good!
If you need help with the ui designing please let me know, i will be happy to contribute :wink:

10

I tend to look at the mail queue if a user asks me why their mail doesn’t arrive at the destination. :slight_smile: Doesn’t happen too often, more like occasionally. Usually they have some misspelling in the destination or so which I can help them with then.

Concerning “things are too difficult to find”… What about a “Favourites / Bookmarks” feature where you can collect links to your most frequently used Virtualmin/Webmin pages? The monitoring software I use (Zabbix) has that on its dashboard page (favourite graphs, favourite screens, favourite maps).

11

I think the top priority should be to make things more organized/discoverable for the virtual server owners, which would be our customers. Something like a Mail Queue is rather an admin task, and I personally don’t care that I need to go to the Postfix module and open the queue there. Webmin is such a powerful tool for admins, it would be hard to organize things and please everyone.

I like Locutus’ suggestion about a Favourites/Bookmarks feature. Maybe the whole menu could be made configurable, so every admin can organize things as he wishes. But maybe that is a bit complicated to implement. I guess the first step to do would be to clean up the mess a bit (like my example above), that’s probably the best option in terms of implementation effort / user benefit ratio.

12

How is this going to effect the current way to use overlay themes ? It’s the one thing I use extensively.

13

Sorry for the slow reply on this one. Missed it when it came in.

In the short term, it will not effect the current theme or its overlay capabilities. We plan to maintain the Virtualmin framed theme for at least six months to a year after the release of the new theme; we need time to figure out accessibility, in particular, before leaving behind the old theme that is known to be accessible to those using screen readers, and other accessibility technologies.

The new theme, however, changes a lot about the way themes work in Webmin, and while overlays will still exist (and will likely end up being a lot nicer to use and a lot more flexible) they will likely not be at all compatible with the current overlay system. Overlays will be handled in the form of CSS overlays. Which allows for much more extensive customization, but also requires all new code.

In the Webmin 2.0 branch, which is coming up pretty soon, we’ll be breaking theme and module compatibility for the first time in Webmin’s history. Thus, we’ll need to maintain the 1.x branch for quite a while after that in order to make sure no one using custom stuff gets left behind.

What specifically are you using overlays to do? I’d be able to write up some examples of converting in the documentation if I knew what your use case is. If adding logos, that’ll be easy; a CSS stylesheet overlay with a single line of code will be able to change an image. If using it to integrate frames of other apps or something, that’ll be more complicated, as the HTML in Webmin is getting much simpler, but is changing completely. It’s literally not recognizable as Webmin HTML anymore, once all of these changes take place (and that’s a good thing; Webmin still treats the browser like it’s 2001).

In short, we’ll help you make it work. But it’s not going to stay the same. If you need it to stay the same for a time, you’ll need to stay on the old theme until you get the chance to update to the new way of doing things.

14

Any news about this? It looks great.

I would really love to see this implemented as a base for future designs. I mean, I’m sure people would build themes for the products, but they need a modern base first to use as a core. I think this on the right track.

15

It’s been a quite thread – any updates ?