Hi Kayn. There's also an ongoing conversation about Jenkins 2.0. It's hoped that a big part of this will be improvements to the UX. KK listed UX as being high on his wish list.
>From a UX perspective, we've been trying to put some things in place to help us do things better (using more modern tools, better patterns etc). See my early contribution on this topic to the Jenkins 2.0 thread <https://groups.google.com/d/msg/jenkinsci-dev/vbXK7JJekFw/iBcSiCJKBgAJ>. Hopefully it will help give some perspective. Regards, Tom. On Thursday, October 8, 2015 at 2:24:40 PM UTC+1, Kayn Ty wrote: > > glad to hear it is still up! > no problem with jelly, i am used to Twig template engine and Angularjs, it > should be not so different. > > I recommend to use NPM and Gulp for front-end workflow improovements (auto > refreshing localhost, compiling, concatenating, managing dependencies, > check test coverage). > I personally prefer SASS than less to compile the css, it is more powerful > and fast. > Jasmine is also a great companion to test things. > bootstrap and font-awesome are also great sidekicks to theme with ease. > All these tools could be launched easily when you start from scratch by an > other one called Yeoman webapp generator ("yo" on NPM). > > so as a first step i cloned the official repo to my own github > https://github.com/tykayn/jenkins > > i also found this uitheme plugin, > https://github.com/jenkinsci/uithemes-plugin maybe i would be more > efficient to contribute on this if i want to build a custom theme, but i > should first understand how to make a processor > <https://github.com/jenkinsci/uithemes-plugin/blob/master/processor> > module if i understood well the readme. > > > Le mardi 6 octobre 2015 19:27:36 UTC+2, Gus Reiber a écrit : >> >> Hey Kayn! >> Awesome. >> Unfortunately, theming has died on the vine here a little bit. My friend >> and co-worker, Tom Fennelly had/has queued up some some core changes for >> Jenkins geared toward enabling LESS driven CSS to manipulate a significant >> portion of the Jenkins GUI, but that PR died in review. >> >> Since then, he and I with some guidance from KK and Daniel Beck have been >> looking for inroads to refactor the existing Jenkins DOM to be a little >> more semantic and refactor the Javascript to be a little more modern and a >> little more amenable to testing via Node.js and Jasmine. >> >> ...so the good news is that you are at the very front of the line for >> providing input on how all this should be done. The bad news is that at the >> moment, there isn't really any doc, largely because the enabling >> infrastructure isn't yet fully born. >> >> If you can tolerate some amount of work-in-progress vibe, feel free to >> contact me direction and I will do what I can to get you up and show you >> around, greiber(at-sign)cloudbees(dot-com). >> >> You can also follow my efforts (an any other Jenkins GUI efforts I am >> aware of) via Twitter: @gusreiber >> You can also follow me on Google+: plus.google.com/+GusReiberUI/posts >> >> >> >> >> >> On Tuesday, October 6, 2015 at 6:42:29 AM UTC-7, Kayn Ty wrote: >>> >>> hi folks, >>> i would love to contribute to this UI refresh. >>> i am looking for ressources to understand how it is organised and how to >>> test my new theme locally. (i know nothing about java, i am a front end dev) >>> i can't find docs about theming, can you show me please ? >>> >>> Le lundi 26 mai 2014 15:54:21 UTC+2, Tom Fennelly a écrit : >>>> >>>> Hi guys. >>>> >>>> I've just started looking into ways in which we can "refresh" the look >>>> and feel of the Jenkins UI, as well as looking at tackling some of the >>>> main >>>> usability issues. I've really only started, but have committed a small >>>> bit >>>> of code to a branch on github at >>>> https://github.com/tfennelly/jenkins/tree/ui-refresh. As you might >>>> notice... Daniel Beck has already posted some good comments/feedback >>>> on the commit >>>> <https://github.com/tfennelly/jenkins/commit/d586be517616a3ba33ac11c6b5a85965d473c8ab> >>>> . >>>> >>>> What I've experimented with so far: >>>> >>>> 1. Tweaking the main layout in >>>> core/src/main/resources/lib/layout/layout.jelly (and added some CSS to >>>> style.css). Everything was layed out with tables, so I changed that to >>>> use >>>> divs instead, allowing us to more easily do things like make the >>>> sidebar >>>> disappear on small screens (if that was a good idea) etc etc. Here's a >>>> screenshot of that: >>>> >>>> https://www.dropbox.com/s/vngs5jjailatanq/Screenshot%202014-05-26%2012.49.31.png >>>> 2. Modified the main project/job configuration page, in an effort >>>> to make it less cluttered, by adding accordions for the different >>>> config >>>> sections. The only way I found I could do this was to wire in some >>>> javascript to manipulate the page post-rendering. Kohsuke says there's >>>> a >>>> way of doing the bulk of the DOM manipulation within Jelly templates, >>>> but I >>>> failed to work that one out yet - I'm sure it will be "obvious" after I >>>> see >>>> it :) Not sure if accordions are the correct choice. Here's a >>>> screenshot >>>> of what it looks like: >>>> >>>> https://www.dropbox.com/s/wsy96r1czhzhy5z/Screenshot%202014-05-26%2012.54.39.png >>>> >>>> The above commit obviously breaks things e.g. the breadcrumbs + some of >>>> the styling is screwed up (I added Twitter bootstrap, causing the css's to >>>> clash). What I've done so far is really just hacking to see what we could >>>> do. I'm keen to hear the opinions of the community... what people thing >>>> we >>>> should concentrate on... what should we avoid... what are the risks etc >>>> etc. I'm aware there is some prior art in this area e.g. OHTAKE >>>> Tomohiro's work <https://github.com/jenkinsci/jenkins/tree/ui-changes>, >>>> the Simple Theme Plugin >>>> <https://wiki.jenkins-ci.org/display/JENKINS/Simple+Theme+Plugin> and >>>> others. >>>> >>>> General comments/challenges/risks, as I see it: >>>> >>>> 1. Jelly + Stapler are not the easiest to work with. At least I've >>>> found it quite difficult to figure out where to make changes. >>>> Sometimes it >>>> was obvious.... other times it was anything but e.g. tweaking the >>>> project >>>> config page to get Jelly to create a series of <table> elements (Vs one >>>> uber <table>). In the end... I found it easier to do it post-rendering >>>> via >>>> Javascript, which is not good imo. >>>> 2. What will be the effect on plugins of changing project config >>>> layout. I already see some strange behaviour e.g. I added an "Execute >>>> shell" build step... it works fine in the "uber <table>" layout, but is >>>> screwed up after I manipulate it - prob easy to fix, but still an >>>> indication that some of the plugins are sensitive to changes in their >>>> surroundings. >>>> 3. Use of <table> for layout seems to be quite popular Vs using >>>> <div> + CSS. >>>> 4. New more "modern" icons? >>>> >>>> After a few brief conversations with some of my colleagues at CloudBees >>>> (Kohsuke, Jesse Glick, Mic Neale and others), it seems like the most >>>> "doable" approach for now is to stick with making changes to what's there >>>> right now i.e. jelly templates, javascript and CSS. We also talked (not >>>> in >>>> detail) about the possibility of working towards more modern technologies >>>> and approaches e.g. a Single Page App using the Jenkins REST API Vs the >>>> current server-side approach with Stapler and Jelly. To do that now, >>>> however, seems a bit like trying to "boil the ocean" (quoting one of the >>>> guys there). What do you guys think? >>>> >>>> So I hope there's an appetite/interest in this and I hope people will >>>> let us know where they would like to see this go (or not, as the case may >>>> be). And of course, if anyone is interested in getting involved in a >>>> "hands-on" way, then that would be even better :) I think the next steps >>>> are for me to gather peoples opinions and formulate an actionable plan >>>> that >>>> people can see and comment on if they want to. >>>> >>>> Regards, >>>> >>>> Tom. >>>> >>> -- You received this message because you are subscribed to the Google Groups "Jenkins Developers" group. To unsubscribe from this group and stop receiving emails from it, send an email to jenkinsci-dev+unsubscr...@googlegroups.com. To view this discussion on the web visit https://groups.google.com/d/msgid/jenkinsci-dev/93516f25-5c15-4fc8-9f97-c3c20dbc54a3%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
