Live data from Hacker News

Show HN: Use Easel to style and build Bootstrap interfaces

easel.io

41–50 of 55 posts

Re: Show HN: Use Easel to style and build Bootstrap interfaces

#41
It's ok, but there are bugs. After deleting all of elements from the demo project, and inserting a heading and a layout element, I ended up with this:

http://i.imgur.com/V9QOP.png

I also noticed that it takes me longer to drag and drop shit around than to code it in HTML/CSS.

Re: Show HN: Use Easel to style and build Bootstrap interfaces

#43

Perhaps I missed it, but one thing I didn't see was how to upload or point to new web fonts. That would be very nice.

This is one of our next features. We've had a lot of feature requests for a better font integration. If you have a typekit account, we will soon be able to use that. Email me: ben@easel.io and we'll set it up.

Re: Show HN: Use Easel to style and build Bootstrap interfaces

#44
post #41

It's ok, but there are bugs. After deleting all of elements from the demo project, and inserting a heading and a layout element, I ended up with this: http://i.imgur.com/V9QOP.png I also noticed that it takes me longer to drag and drop shit around than to code it in HTML/CSS.

If it's a nav bar with positioning set to fixed-top, it will be z-index'd on top of the container. The container will need top margin to bring it out from under the nav bar. This is something we should probably do automatically, but right now we're using the vanilla bootstrap behavior.

Re: Show HN: Use Easel to style and build Bootstrap interfaces

#45
Things I like about Easel:

- Zipfile export contains everything you need to demo your site with a web server

- The UI. It's simple and elegant [1] in its most minimal implementation, but grows in complexity in the right ways when you need it to. The menus are easy to understand at the core, and the functionality behind it should be self-evident to most front end devs. Kinks can be worked out but the overall implementation is effective. I don't like that the RHS menu overlaps with the design you're working on, but I take partial responsibility for using a 1366x768 display.

Things I don't like about Easel:

- Exported stylesheets for demo app aren't perfect [2]

- Elements don't snap to grid.

- It's extremely buggy. Some features flat out don't work, some work but are an eyesore. After clicking "Upgrade", I should not have to type "ESC" to exit the Upgrade path for example.

- The left hand side menu - the dropdowns make it seem like I have multiple choices to select from. It took me a while to realize my mouse wasn't failing to select from an apparent dropdown list.

- The right hand side menu - it should be dockable, minimizable, an arrow should be there, something should let me hide it from view if need be. This comes in handy when selecting multiple elements on a small screen.

Things I like about divshot:

- Edit CSS. This is a nice feature. Not that I want to be editing much code in a browser, I have Vim for that. It's just that access to the raw stylesheets gives you fine grain control over everything.

Things I don't like about divshot:

- Edit CSS was buggy and slow to load changes.

- The export to HTML/CSS feature is essential, but please don't make me have to link to your hosted version of my static assets. I don't enjoy CSS templates that employ href's to placehold.it either for this reason. I want to not worry about my Interweb connection status when running a server on localhost to preview the HTML as I integrate it into a bigger project. This is make or break important for me. Send all of the static assets I need in a zipfile.

- Previews. I don't want to see the dark blue bar on the RHS in preview mode, maybe turn it off when I switch to full screen mode?

- Color scheme. Prototyping should be energizing. Doing mockups should be (is) more exciting than many other phases in the app development lifecycle, because it's the closest you ever get to pure creativity without being weighed down with technical decisions. Give me a simple, lightweight tool that makes it easy and fun to make creative app designs with. The dark blue UI brings me down.

[1] http://imgur.com/hrUcE

[2] http://imgur.com/d3QJA

Re: Show HN: Use Easel to style and build Bootstrap interfaces

#46
Designer here. I was just using Easel yesterday before you added Bootstrap. I was trying to work 'visually'. Great first impression. VERY glad to see you've added bootstrap! Noticed a few things about the first Easel (Easel Pack (?) interface elements): I'd like the ability to paste color codes instead of using a color-circle. I need the colors to match the corporate identity and can't do that if I can't paste the exact color code. I also need the colors of elements to match, so I'd love to be able to create a color swatch. You have solved a lot of things for me with the Bootstrap integration. I really like the way you're going about it. Good work man!

Re: Show HN: Use Easel to style and build Bootstrap interfaces

#47
Oh with regards to your payoff: "Design & build in your browser" I don't design in the browser. I do build my design in the browser. I design on paper, using Photoshop, Illustrator and what not. If you're designing you don't have a clear idea of what you're going to make and you're changing things, replacing, resizing... Wouldn't recommend that in a browser ;-)

Re: Show HN: Use Easel to style and build Bootstrap interfaces

#50

Designer here. I was just using Easel yesterday before you added Bootstrap. I was trying to work 'visually'. Great first impression. VERY glad to see you've added bootstrap! Noticed a few things about the first Easel (Easel Pack (?) interface elements): I'd like the ability to paste color codes instead of using a color-circle. I need the colors to match the corporate identity and can't do that if I can't paste the ex…

I'm glad you've found it useful. We're planning on improving the color selection but until then you can actually just paste in the exact hex code if you highlight the current hex code in the color picker. Hope that helps.
Post reply on HN