Hacker News new | past | comments | ask | show | jobs | submit login
Pingendo – Free, simple app for Bootstrap prototyping (pingendo.com)
356 points by rhapsodyv on Jan 31, 2016 | hide | past | web | favorite | 67 comments



Slightly OT: Is it just me or is Bootstrap a bit of an overkill nowadays? I know you can import what you need and keep the lib size small but the overall framework feels aged and many feature are no rocket-science anymore. Still some features are handy but again, is it worth it?

Without any customization you have this typical thousands times seen Bootstrap look. Only few of the available Bootstrap themes have an original and from Bootstrap outstanding look but then you add even more bloat to your site figuring out what CSS you could leave out. You could also customize yourself but again why not quickly do the stuff without Bootstrap? FE development got quite far these days and today's CSS and JS is not your daddy's HTML anymore, Flexbox is great and there're tons of specialized and modular libs.

Besides, Sass and Less were never my favorites but this would be a minor pick. They are ok to get along.

Last but not least they claim to be mobile-first which is IMO far off and the biggest deal breaker. Just open the Bootstrap page on a newer iPhone (eg 6) and open the menu. There's some significant lag until the menu opens and then the menu-open animation sluggishly stutters running at very low framerate. This could have be done with native CSS and hardware-accelerated 3d-transforms in a responsive and butter-smooth manner with a just few lines. Just having a responsive grid-system doesn't make Bootstrap mobile-first.

I believe that Bootstrap could be good for non consumer facing sites where the audience is less demanding. Eg you need to build an internal reporting dashboard for some company departments and it doesn't have to slick, smooth or sexy. Just a dashboard which is faster and more flexible than sending Excel sheets back and forth. Then yes, Bootstrap is a good choice.

Don't want to be too negative, maybe it's just my cluenessless but could somebody enlighten me: why do I need else Bootstrap in 2016?


> Slightly OT: Is it just me or is Bootstrap a bit of an overkill nowadays?

Coming from someone whose PHP skills aren't too shabby but his graphical design skills stink, I'd say no.

From the very beginning of my current project, I've had difficulty finding a partner with strong UI skills. In fact, I chose my early frameworks almost solely upon needing to rely on the UI design of others. UI just isn't a strength. Hell, I don't even match clothes well and (I kid you not) I still keep a note in my phone about which colors of shirts and pants match together.

Although Bootstrap is fat, as you suggest, for someone like me having to do almost all UI on my own and who's been told his logo looks like it was done by a toddler with a large paintbrush, it is wonderful to be able to drop Bootstrap in so I can focus my attention elsewhere. A tool like Pingendo makes it even easier for me.


Identify with this completely. I've done a lot of web programming over the years with PHP, Java, Ruby on Rails and now some Go. I'm perfectly comfortable with Javascript and CSS in terms of making adjustments...

But if you ask me to build an interface from scratch with bootstrap I'm going to end up curled up in a ball on the floor.


Ok, very good point, I had to smile when I read...

> Hell, I don't even match clothes well and (I kid you not) I still keep a note in my phone about which colors of shirts and pants match together.


Bootstrap is not overkill due to the inclusion of mobile layouts alone. Reimplementing them from scratch in CSS and making sure the website still works 100% without elements breaking out of the CSS containers is difficult and a task many startups fail at.


I agree. Ask clients why they really want Bootstrap and it comes down border-radius on buttons and that blue background color.

It's definitely not a better way to create fluid-responsive viewports.

And the whole grid obsession has gone too far. Among graphic designers and studio artists, a "grid" was always just a fun-to-try curiosity for noob artists to learn composition. Grids are only seriously used by "op" (optical illusion) artists and a few OCD artists with an unhealthy obsession with geometric alignment, like maybe Edward Hopper.


Your ideas that grids and therefore alignment is some quirk among a few OCD artists is quite wrong. Good designers break grid all the time, but they all use grids and guides to some extent. Not using a grid is the sure sign of an amateur. Just because a grid is a well-known concept to everyone doesn't make it amateurish.


I have a BFA in this subject and 30+ years of experience designing graphics and interfaces back to Deluxe Paint and Photoshop 1. So I can't take an anon post seriously. What your saying demonstrates my point, it's a self-reinforcing trend that's gaining more traction, and I blame the popularity of Twitter for that. It was not common to see so many CSS grids until Twitter Bootstrap.

The problem is, non-designers are buying and selling these frameworks and themes. Often designers aren't even part of the purchase process. And how many designers would object: "You're making a mistake because you will regret the technical debt of this." Hey, more billable hours for everybody when it comes time to maintain the grid within the grid from hell, which was FUBAR code from day 1, further obfuscated by some proprietary WYSIWYG. Wow, the screenshot looks great though! How many designers even use the Bootstrap grid properly, assuming it was a good idea in the first place?

The fundamentals of composition haven't changed in hundreds of years. This is false: "Not using a grid is the sure sign of an amateur." Yes, grids go back to the Renaissance, but it's more often a crutch for a new artist copying a master, or for an OCD personality like Edward Hopper. You can feel the cold, painful rigidity of his work, it's amazing--but if the guy was my personal friend, I'd say he needs to loosen up and take off the training wheels. But hey, that's just my opinion ;-)


> Among graphic designers and studio artists, a "grid" was always just a fun-to-try curiosity for noob artists to learn composition.

Some very famous graphic designers used a grid as the basis of their designs.

http://www.amazon.com/Grid-Systems-Graphic-Design-Communicat...


If you're going to use a grid, it's typically a starting point, when you're looking at a blank canvas, blank screen, blank piece of paper. And as your work takes shape, you no longer need the grid. The finished work may still have some pleasing hints of underlying structure, even though the grid has been taken away. You may want to shift things just above or just below alignment to create a little interesting tension, which you can see in Cezanne's work. But usually the grid is completely gone by the time you're done. Most of the time, it's not there to "rule" the composition from start to finish. The grid is typically a reference point.

Anyway, my real complaint about grids is all the technical debt it adds, and in the case of Bootstrap it's bad, in my opinion. And it's totally unnecessary. If you want two columns, just work from 50%, you don't need a complex system for that. It's harder to make changes when there's a cryptic grid system in place. When I see code like class="grid-12c" next to class="grid-9b" I'm thinking what the hell? Is that supposed to be human-readable? To me, it seems like a bad trend. If people want grids so bad, then why did we stop using tables 15 years ago? Seriously. I thought floated divs were a step in the right direction, more akin to how designers/artists work, like I can just imagine Matisse saying, "Float that margin a little lower. Perfect!"


> If you want two columns, just work from 50%, you don't need a complex system for that.

That's what you'd think, but intuitive CSS working differently, or not at all, depending on your browser is what made Bootstrap necessary in the first place.

Bootstrap's great feature is that it works at all. I assure you that rolling your own site with a level of functionality provided by Bootstrap is a massive pain in the ass.

Tables were a pain in their own way. Don't you remember "font" tags?


Do clients really ask for Bootstrap specifically?


I build WP themes for agencies. They often specify bootstrap or foundation as a starting point.

This makes more sense in a context where they are dealing with a lot of freelancers and don't want to deal with 25 idiosyncratic ways to implement a dropdown menu.


I specify bootstrap or whatever as a starting point because it's important to me to have a "toolbox" of stuff to pull from. Even after the themer's work is done, I need a set of UI elements to design with as my project's design evolves. A really good example of HTML/CSS toolboxes are a bunch of the themes at wrapbootstrap.com. Here's an example one I like:

http://simpleqode.com/preview/paperclip/1.3.2/ui-elements.ht...

For a programmer I have a pretty good graphic design sense, so I can limp along and build my own components while keeping an overall consistent style. A lot of other programmers are awful at this and I've seen some hideous stuff. Rando freelances are the extreme case, but even if you're stuck having a programmer without UI horse sense do UI work, having a framework based UI toolkit is a huge help.


bootstrap is great for when you want to build something, you know a lot of people know it already and you don't really want to go through the process of creating your own CSS. I mean think of all the java and .net teams that don't have a dedicated resource for UI and how much they can accomplish with it just going by the docs. If they didn't use bootstrap, there's hardly another framework that matches that gives you all of the components so that you're not distracted from the real meat and potatoes of the web app with making your own modals behave. It's certainly not perfect, but it's damn reliable and as good a standard as I've seen.


You're not alone in your concerns. Dynamically generating static layouts seem rather silly to me.


I don't think you should focus too much on that. Indeed, there is a "frontpage express" part, in it, but the app is still super useful should you remove that.

I've been prototyping a lot last year, and it was never straightforward because I have to compose with provided elements to build something looking a minimum like what I wanted.

Pingendo will allow me to do just that: quickly add, remove, switch components the fastest possible, and just focus on the product. This is the most important thing when wireframing.


> Dynamically generating static layouts seem rather silly to me

This sounds like another good reason, I didn't think about it. Could you elaborate on this? Thanks


As a web developer who works almost exclusively with Boostrap and finds the beginning stages of building a site with Bootstrap to be very tedious, I love this. My boss (does a lot of web design work but not coding) might find this interesting too. He's been wanting to be able to sit and make mockups but can't find the motivation or maybe time to do it.


Also, some quick feedback: The HTML and CSS panel was hidden by default for me. It was a little hard to find. There's also no quick way to hide it again that I can see. I have to resize it to minimum. Might be worth exploring how double clicking works with PHPStorm (maximizes it) and adding a minimize option to right click context menu. Also undocking options for CSS/HTML would be nice for dual screen use.


Suggestion for you FAQ:

> 4) Why use Bootstrap? > Because Bootstrap is the most widely adopted development framework, with the largest thriving community and most extensive documentation.

How about something a little better than "because everyone else is using it", such as:

"Bootstrap gives us a common vocabulary of classes and components that makes it easier for beginners to build fully-functioning markup, and makes it easier for developers of all levels to communicate with one another. It also provides constraints on the otherwise-unlimited possibilities of HTML+CSS which makes it possible for us to build this GUI tool that interacts with it."


Meh, it's not a terrible way to market something: https://en.wikipedia.org/wiki/Social_proof

Also, the more CDNs using it, the more likely is to be in your browser cache, and the easier it is to find devs.


There's too much fluff in that description. If i were a potential user and saw that line, i would just close the tab without trying to understand what you're trying to say. The op rightly described the essence of what makes bootstrap compelling imo.


Not being able to understand something doesn't make it "fluff". I believe that there is actual meaning to what I wrote (maybe you disagree, and that's okay... but it would be nice to hear what exactly you think is "fluffy" about my explanation).


As opposed to the original explanation, yours actually applies to virtually any CSS framework, so makes no argument after all.


Agreed.

And if you really wanted to, you could supplement it: "...making it the most widely adopted development framework."


I'm very impressed, thanks for this app. Until now, I used Pencil for prototyping on linux, which was not very efficient because it's more focused on desktop app building.

Totally love the fact that there's a real browser behind and I can just add bootstrap classes on elements I want. Great job, instant hook.


What is up with every app requiring 10.8 and above? It's fine for others but very unsettling for developer tools. I still know devs on 10.6.x!

This is even more weird when you consider that laptops that came with 10.7 went out of AppleCare a few months ago.


> What is up with every app requiring 10.8 and above

Even Apple has stopped supporting 10.8 and below.


This app is built on Electron, which requires 10.8.


Why can't everyone just upgrade?


It can be very messy to upgrade for a sizeable chunk of developers. Linked libraries, lost compatibility. If the system gets unstable you lose years of installed dependencies. I mean some of the unix apps take literally hours to install, and a faulty upgrade can lose tens of them. You forget how you resolved conflicts, gotten stuff to work.


Why would you figure out how to install something, and then not automate it so you didn't have to do it again? I think if you can't recreate your system in an afternoon with just a backup of your user files, then you're already on borrowed time.


Every tool that makes prototyping cheaper & faster is more than welcome!


I've made an app & website that lets you quickly try out java snippets on android, e.g. if you see a code snippet on stack overflow you can just copy paste it and throw it in and let it run on your phone. But I didn't continue with it because no one uses it :) https://runondroid.com/


Yo that's pretty neat right there...


Nice. It looks useful to me.


If the tool itself only supports running on Chrome and Safari (i.e. webkit), I wouldn't trust the tool to produce code anywhere near standards compliant or deployable on the public web.


The website says they are funded, how do they intend to make money? or this a nonprofit?


From the FAQ:

3) Is Pingendo free? Yes. What is free today will be free tomorrow. Premium services are coming and they will pay our bills.


Free beats the rest ;)


This thing is amazing. I am a backend developer, and over the last couple of years becoming "full stack" for web projects. For me I can do CSS/Photoshop stuff but I'd rather hand code assembly language than CSS wrangling anyday. So this tool is great.

I think if the target audience is "non designers" who just want to get something done, it's perfect. I generally throw together UIs at work and pass them on to our designers who of course throw it out and put in real stuff, but at least they know they're starting with a functional product to work from. That's where I think this tool will really work for people.


Pingendo for Bootstrap 4 preview available here http://v4.pingendo.com/playground.html


This is amazing, best yet! Wondering what's the status of that? Can't see save button..


Anyone have details on the technology behind it? I mean is it a cross platform single app written in JS/Electron or individual native languages etc?


It's an Atom/Electron app.


Would have loved if they'd signed the code so I didn't get the "unidentified developer" message when I try to run it on OSX.


FYI, if you right-click the application icon and choose "open" from the popup menu, it will let you run the app.

(I agree that it's annoying to have to do that though)


is it a coincidence? Bootstrap also introduces something similar today - bootstrap studio (https://bootstrapstudio.io/)

is there any difference?


Is Bootstrap Studio really from the Bootstrap devs? According to this website (https://bootstrapstudio.io/) Bootstrap Studio is a tool developed by Zine EOOD, a Bulgarian company: http://zine.bg/


This looks very very similar to http://blocsapp.com (as in the UI being almost an exact copy).


I've been using Pingendo for about 1 year now at home and at work. Super fun app to use, and makes some really nice and clean code in the end.


I'm on Safari trying the demo (v4), it's missing the scroll bar :/


froze 5 min into using the app, whilst browsing stock photo to insert as the hero image...

the app felt very clunky. As a developer, I felt very restricted.. This definitely not intended for developers...


I downloaded it one day and realized it was a attempted closed software atom app...just unzip it if you want to comment out their JavaScript security line. Other than that it seems like they took most of their code from a similiar atom project that is completely free and open source.


What's the name of the open source version? It sounds interesting.


I'm the author of Pingendo. Which is this "similar atom project" you mention ?


not sure if he is talking about this - https://github.com/atom


Sorry got pingendo mixed up with the pinegrow devs pushing their 100$ software around here when there are great alternatives such as this. Sorry for the trolling. I'll delete my comment once I'm on a desktop. Question where is the "pin" in these bootstrap editors names coming from?


http://pinegrow.com, now that you mention it :)

Pine in Pinegrow comes from Pine trees and no code comes from Atom. Besides Bootstrap, PG also supports Foundation, plain HTML, converting HTML pages to WordPress themes, master pages, smart components etc and aims to be a kind of modern Dreamweaver replacement.

And sorry that you feel offended by my kids having to eat.


Not offended your kids have to eat but does it have to be filet mignon every night? I'd gladly charge $20-$40 on my card for software anyone can easily get the source for and unlock the saving functionality but I feel like I have to pay $100 because half of you user WILL just steal it. Wrap some security around it and prove the business will be around for a few years and if I missed the boat and still hate front end work then I guess I'll have to pay. But it's a free world charge what you want and I'll stick to firebug.


early adopter of pinegrow here. I even bought multiple licenses early on, just to support them. It's become a critical part of my work now. And it's pretty affordable. Any software isn't going to be worth it if you don't find use out of it or use something else. But I'd be quite unhappy if I didn't have pinegrow to work on UI at my current job. I love how easy it is to copy and delete objects and I build screens for stakeholders (and then devs to work on)

firebug / chrome dev tools are great, I still use them along side pinegrow, but they aren't pinegrow. And pinegrow doesn't do everything perfect. I will ocassionally open up the same files I'm working in pinegrow inside a code editor for more robust tools, BUT pinegrow has been excellent to work visually on some of the mindnumbing things I'd have to do in code if I didn't have it.


Pinegrow starts at $49 and has been around for two years since 1.0 release. Makes me so happy that I'm my own boss and don't have to prove anything to a person like you :)


So, thanks to your comment, I learned that pinegrow exists. I'm completely impressed. It's clearly a non-trivial amount of work put into a pretty solid-looking package. Why are you so offended by a piece of software asking to be purchased?


[flagged]


If you actually felt sorry you should probably delete that trash post of yours.


It's better to flag comments than make the thread worse by continuing a bad subthread.

To flag a comment, click its timestamp to go to its page, then click 'flag'. You need a small amount of karma (currently 31) before flag links appear.


[flagged]


You can't comment like this on HN. Please post civilly and substantively, or not at all.




Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact

Search: