This is amazing, very well done, perfect for what I needed! I was scouring the web for simple buttons all morning and couldn't quite find anything I liked. I was getting ready to include a "custom" Boostrap with just the buttons, but this is much better. Thanks!
Pretty nice. I saw the 3D buttons, and my initial reaction was they looked a little bland. Then I clicked and saw it press in and immediately my opinion changed because it looked very cool.
They definitely look cool, but also made me think I need to keep my trackpad pressed against my desk until the button had been fully depressed before any action would occur. Trained by too many 'slide from here to there to confirm' interactions, I suppose.
I'd actually say this is a usability problem. If i just tap my touchpad (on MBP), there's a click event registered, but it's very, very short. the response from the button depends on the duration of the click event. If I click and hold down the touchpad, i see the whole animation, but if i don't and just tap, i see either a quick flash or no animation at all. This could be really confusing, especially with the skeumorphic buttons that look like they would react in they were clicked ("I clicked it, but did the click register?")
This could be fixed by adding a minimum click length for the current animation to occur. If the click length is lower, the full (or a partial) animation could just automatically occur at a fixed (fast) rate.
Compass isn't very well maintained and someone I work with even said it may be discontinued. I'd look at a lighter mixin lib like bourbon (http://bourbon.io) and pull other elements from other places (e.g. grid from Susy (http://susy.oddbird.net/), which has now been rewritten to not depend on compass anymore).
Not sure what it's like now, but a fair few of the frontend people I've worked with were complaining about it a few months ago because the mixins it provides were unreliable.
Why? They're flat and simple because (if you buy into the flat movement's sentiment) we don't need skeumorphism to distinguish a button anymore, but when you press it it does something 'because feedback'.
It doesn't really matter what it does, we just need to know we pressed it, so why shouldn't the thing it does be 'go a bit 3d'?
I have been using bootstrap as it is easy to integrate as a backend developer but now starting to hate it, It seems so ugly now after using it for a while. will use this soon :)
Hrm, no real UI framework. I think a bit of backbone and some jquery libs like scrollto and pretty-something for the code samples (it's all in the view source hehe)...anyway, the real magic of how this works for those inclined is it's a gh-pages branch for the site, which makes jsonp requests to heroku where the buttons are compiled per the options you've selected, and then finally archived and returned to user. It was a fun constraint to work out but turned out to be doable and fun...but guys, pretty please don't DOS it :)
I'm not sure I understand your point? From my perspective, modifying is easier than making from scratch. The only time I've created buttons "from scratch" is when I was working with a graphic designer. As a developer, I always pull in things like this to speed up the process. It is undoubtably slower and would result in a worse final product if I attempt to learn all the details of what this person provides for free as a starting point.
I totally agree with wuliwong, infact I have never edited any design and have always used available ones(bootstrap) out of the box to save time as my motive as a developer is a clean working app than a beautiful app.
Guys, I sit somewhere in the middle on this. In fact, I'd say the ever hated "it depends"...are you in the prototyping phase? Have you toggled off the Buttons you don't want in the Builder page? If you're really into customizing, have you just considered stealing some of the raw ideas and/or scss? Really, we wouldn't mind :) Here's another approach...say you just want the pills and like the general direction but want to tweak it:
Go to the builder page, remove all but pills
Go in to the _options.scss partial and tweak some more
Optionally take all of what's left and then refactor to your liking
I'd claim you save some time with above and still get a fully customized button.
Regarding using something like Bootstrap "out of the box" is not something I'd personally want to do once getting my project into production...but again, I'm fine using for just prototyping and then tweaking the styles later. That said, to each is own
And another analogy I'd point out is if you're in Photoshop (or in browser), and you use something like icomoon app to make a nice set of font icons and then style some texture/shapes/etc. behind it for something pretty nice. I feel like that would be a completely valid and workable approach...that said, sometimes you'd want to make the artwork from scratch yourself and that would be valid too
I agree to an extent. In corporates etc. you're going to be building from scratch because these things won't fit in with guidelines and it's easier to build from scratch. However, it's good for quickness when working on personal projects. That being said I do find this one a little overkill and more than what you'd probably want without creating custom builds etc. also some of the behaviour and styling doesn't work as I'd assume. For example, drop down isn't drop down, it's more like drop on.
I agree with part of your point - I probably won't be plugging it into a project and using it as-is, but I can appreciate the source being out there. I often check the source for projects I respect to see how they accomplished similar things to what I'm trying to accomplish. For those learning advanced CSS and hoping to roll their own button styles, this could be a useful resource.
