Skip to main content

The foundations of a new UX for cPanel

cPanelAdamF
Hey everyone, cPanel is looking for comment/feedback on a new direction for its upcoming User Experience refresh. While simple, elegant and minimal, the new user interface work will eventually provide a much "closer to the metal" and thus more powerful way of theming/branding cPanel for our customers, much more coherent experiences for end-users to achieve their goals, and screen-size responsiveness so that cPanel looks great no matter the device you use to access it. That's where we're headed with it and we're taking small foundational steps in that direction by applying what we've learned from previous UI endeavors directly to the product as it stands right now. Expect to see a developer-preview of this theme available in coming releases. - Out of Date Link Removed - Have a peek and let us know what you think. We'll be watching the comment thread here, but if you'd prefer to let us know what you think directly, send us an email at paperlantern.feedback@cpanel.net[/EMAIL].

Comments

55 comments

Date Votes
  • cenourinha
    It looks great. Love the new icons design and "bootstrap" style. Keep up the good work :)
    0
  • cPanelAdamF
    We're actually getting pretty serious about adopting Twitter Bootstrap 3 deeply into the product. For a UI Toolkit, we're quite happy with what's its capable of and we've definitely heard all of the feature requests for it.
    0
  • chrismfz
    Why not use a style like WHMCS' admin frontend ? Everything in movable tabs (even the content in left) with minimize options and why not resizable too (ok that's too much) ? Also why not a "Favourite" tab on the top which we can drag the icons we need most in the order we like.
    0
  • cPanelAdamF
    ultimately we'd like to get to this kind of an experience, yes. Right now we're concentrating on building the foundations which we'll later come back and build these ideas onto.
    0
  • electric
    I would like to see the entire "email" management system in cpanel changed. It happens frequently that a customer doesn't know they have a forwarder AND a mailbox... or they want only a forwarder but they also create a mailbox because they don't understand there is a difference. It's confusing to non-technical users what features/functionality is enabled or possible for any given email address. So instead of having separate pages for email account management, forwarders, auto-responders, filters, etc.. consider that the users just want to manage their "email address". I think it would make more sense to have a single "email addresses" page that lists ALL different email addresses, regardless of if it's a forwarder, mailbox, auto-responder, or whatever. Then customer selects an email address to edit, and sees a page for the selected email address that shows whatever different options are enabled for it -- mailbox, forwarder, autoresponder, filter, etc.. So we have a single page for : EMAILADDRESS@DOMAIN.COM - List of forwarders in a text box (and save ability, so they can update just be entering/removing emails from the box) - List of autoresponders - Mailbox (enabled/disabled) and then if enabled, the usual pw reset, how to cofigure, quota, etc.. - List of filters The idea is that the customer can see an entire overview of the selected "email address" and manage its features and functionality all from that single overview page. I think this would be much better than splitting up all the different email functions into multiple pages. Thanks. :) [COLOR="silver">- - - Updated - - - Another idea is to make the horizontal navigation section a configurable list of "favorites". So it would work like the bookmarks bar in Chrome. You can enable the bookmarks bar, and then add bookmarks to your favorite sites, so they are all quickly clickable. There should be a way to drag or "bookmark" any page in the cpanel, and then it is added to this horizontal menu "bookmarks bar", just like a browser.
    0
  • cPanelAdamF
    These are great ideas, Electric. Please submit them to [url=http://features.cpanel.net]cPanel Feature Requests so that we can get community consensus on them.
    0
  • fibreserv
    great This cpanel looks great and is there still going to be options to customise it?
    0
  • cPanelAdamF
    Re: great [quote="fibreserv, post: 1555732">This cpanel looks great and is there still going to be options to customise it?
    Yes, absolutely. We may move away from the current branding/theming mechanisms found in X3 towards something simpler and more powerful, but YES, we are definitely working to provide better customization and more powerful styling options.
    0
  • WireNine
    Adam I can't say enough good things about the new UI it is ages ahead of the current one, how soon can we get our hands on this? The coding & design looks beautiful. The current X3 customizations are a pain to deal with.
    0
  • cPanelAdamF
    [quote="WireNine, post: 1556831">Adam I can't say enough good things about the new UI it is ages ahead of the current one, how soon can we get our hands on this? The coding & design looks beautiful. The current X3 customizations are a pain to deal with.
    A pre-release alpha will be available in 11.42, which is coming out at the end of Jan 2014. Resellers will be able to set accounts to try out the new Paper Lantern theme but there will be some known issues. For example, screen size responsiveness will be limited at first and you won't be able to brand the interface at first. Those things will return with future releases, though, so stay tuned! edit: release date and grammer
    0
  • cPanelKenneth
    To add to Adam's statement, cPanel & WHM version 11.42 is now available in both EDGE and CURRENT tiers. Paper Lantern is included in 11.42. We welcome your feedback on it.
    0
  • cPanelAdamF
    Here's how to play with Paper Lantern: For non-reseller accounts: Contact your reseller and request to have your account set to the Paper Lantern theme. For Resellers (and those with reseller privileges) Log into WHM and choose Modify an Account from the sidebar. Select an account from the account selection areas and click Modify. Choose Paper Lantern from the 'cPanel Theme' selection box on the account and then click save. If the user is currently logged in, instruct them to log out and log back in again to see the new theme.
    0
  • urgido
    waiting for custom options for this.
    0
  • cPanelAdamF
    [quote="urgido, post: 1568232">waiting for custom options for this.
    They are coming ;-)
    0
  • WebHostPro
    I love it! Can we have a way to choose the top used icons and have them at the top under most popular or a term we choose? It would be very helpful to new users to be able to find the most used options right at the top.
    0
  • chrismfz
    Many users don't :D (There is a panic thread in WHT about the new theme) @cPanelAdamF Is this possible in the future to have an option in ACL to let users choose among themes ? For example let users inside cPanel choose between x3 or paper lantern or something else too. (We should control the available list too, I don't want someone from x3mail to switch to x3 for example) We can force globally from package editor a new theme, but there is a chance many users won't like it. It should be an option from inside cPanel -not WHM- to let users choose too. In Feature Manager perhaps it could be doable.
    0
  • Infopro
    Hardly a panic thread, IMO. @DWHS, Not sure there's a need for that, the search at top works great. @chrismfz, I would think that will be an obvious option. It's not now as this is still a very early release.
    0
  • WebHostPro
    [quote="Infopro, post: 1575592"> @DWHS, Not sure there's a need for that, the search at top works great.
    The search at the top really doesn't work great for new users. When you have extreme newbies they wouldn't even know what to search for. By having the important options like wordpress, site builder, email, ect.. right on top that will help guide them to the common options.
    0
  • cPanelAdamF
    [quote="chrismfz, post: 1575582"> @cPanelAdamF Is this possible in the future to have an option in ACL to let users choose among themes ? For example let users inside cPanel choose between x3 or paper lantern or something else too. (We should control the available list too, I don't want someone from x3mail to switch to x3 for example) We can force globally from package editor a new theme, but there is a chance many users won't like it. It should be an option from inside cPanel -not WHM- to let users choose too. In Feature Manager perhaps it could be doable.
    We've actually contemplated doing exactly this. There would need to be some basic things there to actually do it: [list]
  • As a mail-only user, I should NOT be able to promote myself beyond my permission level by changing my theme
  • As a cPanel user whose reseller is not willing to participate in the Paper Lantern alpha, I should not have the option to change my theme
  • As a cPanel user whose reseller IS participating in the Paper Lantern alpha, I should have the option to change my theme. I should only see the themes that my reseller specifies.
  • As a cPanel User whose reseller IS participating in the Paper Lantern alpha AND my reseller specifies only one theme available to me, I should NOT be able to change my theme.
  • As a Reseller, by default my users should NOT be able to change to a different theme than the one I set for them.
  • As a Reseller, I want to configure a package such that all users with that package have the same set of themes available to them.
  • As a Reseller, I want to specify the themes my users should have access to on a user-by-user basis I miss anything?
    • 0
  • cPanelAdamF
    [quote="DWHS.net, post: 1575532">I love it! Can we have a way to choose the top used icons and have them at the top under most popular or a term we choose? It would be very helpful to new users to be able to find the most used options right at the top.
    We'll eventually get there, yes. Currently the Quick Links are basically just a flat list based on some of our internal metrics BUT we do understand that our customers want to specialize their services and will need the means of managing that list. So...yes....just not yet ;)
    0
  • chrismfz
    [quote="cPanelAdamF, post: 1575841">We've actually contemplated doing exactly this. There would need to be some basic things there to actually do it: [list]
  • As a mail-only user, I should NOT be able to promote myself beyond my permission level by changing my theme
  • As a cPanel user whose reseller is not willing to participate in the Paper Lantern alpha, I should not have the option to change my theme
  • As a cPanel user whose reseller IS participating in the Paper Lantern alpha, I should have the option to change my theme. I should only see the themes that my reseller specifies.
  • As a cPanel User whose reseller IS participating in the Paper Lantern alpha AND my reseller specifies only one theme available to me, I should NOT be able to change my theme.
  • As a Reseller, by default my users should NOT be able to change to a different theme than the one I set for them.
  • As a Reseller, I want to configure a package such that all users with that package have the same set of themes available to them.
  • As a Reseller, I want to specify the themes my users should have access to on a user-by-user basis I miss anything?
    You made it so complex now.... :p Just kidding :D Yeap, until now we didn't have any other options for themes (official cPanel themes). Now that we have 2 (or maybe 3 with x4 if it goes on), it should be an option to change it as a user. If of course reseller/admin permits it as you said.
    • 0
  • cPanelAdamF
    yeah, I wish things were as simple as they looked at first. ;-) We'll see what we can do.
    0
  • WebHostPro
    Still love it, but it needs a little structure. Can we get a super light colored frame around the content?.vB
    0
  • cPanelAdamF
    [quote="DWHS.net, post: 1601301">Still love it, but it needs a little structure. Can we get a super light colored frame around the content?20361
    No...but only because we're making BIG changes to the overall layout in the upcoming 11.44 release...not because we disagree that something is needed to better differentiate the UI Groups from each other. Paper Lantern in the upcoming 11.44 release is pretty different from the version you're looking at in 11.42. Here's a screenshot .vB You can also poke at it by visiting
    0
  • WebHostPro
    Cool, good luck!
    0
  • Jeet
    Good step in the right direction. But guys, reduce the size of the icons. 48x48 is too large and takes up lots of space. We have to scroll down a lot even on large monitors. 32x32 does look good. (Check the attachment for a quick mockup I did) .vB
    0
  • SouLz
    Really looking forward for this to be brandable. Our website actually matches the styling of the paper_lantern and will make our cpanel interface very snazzy i must say! Do we have an ETA on when we could be expecting this? Progress is looking very good.
    0
  • cPanelAdamF
    [quote="SouLz, post: 1612372">Really looking forward for this to be brandable. Our website actually matches the styling of the paper_lantern and will make our cpanel interface very snazzy i must say! Do we have an ETA on when we could be expecting this? Progress is looking very good.
    We start cracking that nut in the next release (after 11.44). We have to balance delivering customizability with new features of the UI...and we have new features in mind that we really want to get to.
    0
  • musti19
    I have some recommendations: 1. I think if the background is lightgrey or something else, the icons&name could be read better. (The contrast between background and icons) 2. the search input field should be smaller (width) 3. On larger displays, the icons are bigger,must be fixed(from Jeet) 4. The settings should be displayed in a modal box instead of forwarding 5. The header menu (with Home, Addon-Domains,..) could be a flat design and the hover effect like bootstrap 6. The user dropdown and logout button could be within the header menu 7. The div areas in pages e.g. in e-mail-accounts, should be in each divs with a frame or background-color. i uploaded a example with simple div around the areas.
    0
  • MaraBlue
    I love it, I absolutely LOVE it! I can't wait to release this to our customers! Just waiting for the header to be brandable (*nudge* *nudge*). I actually like having the icons big (48x48). Though I haven't tried accessing it yet from a mobile, I'm thinking the bigger icons would make the theme more mobile-friendly. I did notice that even though Chirpy/ConfigServer's blog posted that the MailScanner FE is compatible, the MailScanner icon (in users' cPanel) is in the wrong place (i.e.- not in the "Mail" section). If I "reset interface" it moves to the very bottom, in the "Advanced" section (also not the right place). The Softaculous icon is missing altogether, though they also said they've updated to be compatible with Paper Lantern (though that might be their next release). Installatron's icon is right where it should be. ::thumbs up:: Is there a way to reset the cPanel icons server wide? Obviously we can't expect end-users to click the "reset interface" link. I seem to remember a script that did something similar, though I haven't had to use it in years (and my Google-fu seems to be failing me on this). EDIT: I tried /usr/local/cpanel/bin/rebuild_sprites
    That didn't fix it/put the 3rd party icons in the correct places. Can I just say again how beautiful Paper Lantern is, and what a welcome (albeit long awaited) change this is? Thank you, thank you, thank you!!! --- For anyone else looking how to move the MailScanner icon to the correct section, this reply from ConfigServer: [QUOTE]cPanel are still developing Paper Lantern and so it's difficult for us to provide support for it until they have finalised it. For now, if you want to move the MailScanner icon to the email group you need to edit: /usr/local/cpanel/base/frontend/paper_lantern/dynamicui/dynamicui_mailscanner.conf Then change group=>mail to group=>email That should be all you need to do.
    0

Please sign in to leave a comment.

Didn't find what you were looking for?

New post