ryan Posted February 17, 2017 Share Posted February 17, 2017 Last week we looked at progress on a new admin theme framework for ProcessWire. This week we’ll do the same, as development continues to move forward and we have a lot more screenshots to share (though keep in mind this is largely un-themed/stock). https://processwire.com/blog/posts/continuing-work-on-new-admin-theme-framework/ 17 Link to comment Share on other sites More sharing options...
ukyo Posted February 17, 2017 Share Posted February 17, 2017 Great to see uikit framework with processwire admin panel. Great job @ryan ! I have a question for you. Do you think to write a (uikit) icon picker admin panel, like font-awesome icon picker ? if your answer is yes for this question, can you make it compatible to use this icon picker with page editor also ? 2 Link to comment Share on other sites More sharing options...
Mike Rockett Posted February 18, 2017 Share Posted February 18, 2017 I definitely like the per-field border-control. Can't say I'm a fan of the card view, but that's because material design (and derivatives thereof) has never been my thing. The colour-control on a per-field basis also looks quite nice. I wonder if you could also add the option to only set the border colour, so that the background remains white. Great to see a new admin 'framework' coming into the picture. 1 Link to comment Share on other sites More sharing options...
ryan Posted February 19, 2017 Author Share Posted February 19, 2017 Quote Do you think to write a (uikit) icon picker admin panel, like font-awesome icon picker ? We're going to be sticking with Font Awesome as our icon set. While Uikit comes with its own SVG icon set (and one certainly can use those) the scope and quantity of them is pretty limited relative to Font Awesome. Previous versions of Uikit actually used Font Awesome as their icon set, but in Uikit 3 they switched to their own set. There just aren't enough of them to cover our needs, plus I'd prefer to stay consistent with icon usage. So not planning to implement any features specific to Uikit v3 icons at this stage. Quote I definitely like the per-field border-control. Can't say I'm a fan of the card view, but that's because material design (and derivatives thereof) has As far as I know the Uikit cards aren't related to material design. They are a default styling that Uikit has for something that is visually offset in a different way. With the default styling that they've got, I've found the card view helpful when you get into nested Inputfield elements, as it makes it a little easier to visually identify the hierarchy vs. the completely flat look. I understand all-flat look is what's trendy right now, and my intention isn't to get into the design aspect at all. Though I appreciate that the Uikit folks recognize that there is a need for this kind of thing. So it'll be up to the people that get into the design side to interpret how one translates the card style in a Uikit theme. Quote The colour-control on a per-field basis also looks quite nice. I wonder if you could also add the option to only set the border colour, so that the background remains white. This one will also be open to interpretation in the actual theming process. I'm just trying to make the colors as obvious as possible at present. 4 Link to comment Share on other sites More sharing options...
Mike Rockett Posted February 20, 2017 Share Posted February 20, 2017 16 hours ago, ryan said: As far as I know the Uikit cards aren't related to material design. They are a default styling that Uikit has for something that is visually offset in a different way. With the default styling that they've got, I've found the card view helpful when you get into nested Inputfield elements, as it makes it a little easier to visually identify the hierarchy vs. the completely flat look. Sure, though I get the impression of material design as it seems to be popping up everywhere, which is why the association is made. I must say, though, the general impression of the docs site is 'material', but that's probably because of the colour they chose for the header -- so many administration framework themes are using colours similar to that. The use of depth could well grow on me, but I would probably opt for smaller shadows. Perhaps this can be explored further down the line. Link to comment Share on other sites More sharing options...
tpr Posted February 20, 2017 Share Posted February 20, 2017 Perhaps using indentation for nested fields could be more clear and space efficient instead including fields inside fields, what do you think? Or is such level of modification out of scope for now? 1 Link to comment Share on other sites More sharing options...
lokomotivan Posted February 20, 2017 Share Posted February 20, 2017 Maybe can be good idea to use https://getuikit.com/docs/notification uikit notifications. Link to comment Share on other sites More sharing options...
lokomotivan Posted February 20, 2017 Share Posted February 20, 2017 And regarding cards, i think they can be nice, but used as fieldset container rather then per field, and maybe only in nested fieldsets. 1 Link to comment Share on other sites More sharing options...
renobird Posted February 21, 2017 Share Posted February 21, 2017 Some people think cucumbers taste better pickled. 2 Link to comment Share on other sites More sharing options...
lokomotivan Posted February 21, 2017 Share Posted February 21, 2017 And some people like to discuss about taste, so they can find something in common 1 Link to comment Share on other sites More sharing options...
renobird Posted February 21, 2017 Share Posted February 21, 2017 Just a reminder that these are not design literal mockups, they are base styling and default looks. Think of them as functional wireframes. 2 Link to comment Share on other sites More sharing options...
lokomotivan Posted February 22, 2017 Share Posted February 22, 2017 Got the point :). Often forget, and get carried away by design. Anyways, i like the term "admin theme framework", thats exacly what we need. Link to comment Share on other sites More sharing options...
Pixrael Posted February 28, 2017 Share Posted February 28, 2017 I like it, this new version of the admin theme is a step forward for Processwire. I'm a space fan in the design, I like when the user interface can breathe a lot, but I think it's too white or too "light" now, it's hard to see on a 27-inch monitor. I would like the color of the header bar, buttons hover and other small details can be configured in the administration, as well as the logo (keeping the height) to match the brand of our customer, this will be a great advantage. Of course the Processwire identity is maintained in the footer. I think the default color may match the Processwire website that I like and it's refreshing. The developer can customize with parameters in the administration, this can be achieved using a small css file with color codes to override some elements and this file can be generated when the profile page is modified. I was modifying some screens directly with the Chrome Inspector and this is the result. I made adjustments in the background tones, margins, colors, hiding elements like lines, etc. For example, the help paragraph that is always visible, it would be nice to display it on demand with help icon or directly by activating them in the VIEW menu. Because it is useful the first few times you use Processwire, but when you learn it only occupies an unnecessary space. 5 Link to comment Share on other sites More sharing options...
szabesz Posted February 28, 2017 Share Posted February 28, 2017 5 hours ago, Pixrael said: I'm a space fan in the design Me too, however, I'm not a fan of it in the case of administration interfaces. I do not like scrolling around, I prefer to see all stuff possible right in front of my face I'm not saying whitespace should be eliminated, but people often work on 11''-13'' laptop screens and not on 27" desktop monsters It would be nice to have some sort of whitespace settings and/or whitespace could adapt to the viewport size. 1 Link to comment Share on other sites More sharing options...
Pixrael Posted February 28, 2017 Share Posted February 28, 2017 I agree with you, in my sketch I adjust the margins and eliminate lines to make it more compact and clean... more contrast can help too 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now