Easel.ly - A nice HTML 5 infographics editor

http://www.easel.ly

by no_gravity • 14 years ago

107 58 14 years ago

easel.ly

adityar• 14 years ago

The overall UX is very good. I could not figure out how to modify the graph data (assuming I can).

program• 14 years ago

Put on:

1) support for characters outside ASCII (at least latin1, accented letters do appear as a space)

2) better copy/paste. Right now it has problems (FF12)

3) Custom page size

and it will be an excellent tool. Keep up the good work.

jqueryin• 14 years ago

This is all intended to be constructive, I really like where you're going.

I signed up and began skimming around. Not sure if you're just overloaded with traffic or if your lightboxes are having a hard time loading, but I can't preview any of the themes at the moment. Half of the time the lightbox preloader isn't going away.

Also, please consider adding more hotkey bindings for things. I really would prefer using my mouse as little as possible. I was trying to delete elements only to find that the delete hotkey doesn't work.

Also, as mentioned by adityar, I'm not sure what to do with your charts section. I can't see how the data can be manipulated, if at all.

Lastly, your objects paginator isn't paginating for me. I click on another page, watch the increment, but the icons don't change.

gawker• 14 years ago

Question for ya: Did you design the themes mostly yourself?

Personally, I feel like that if all infographics were the same, it would loses its appeal. The purpose of an infographic is to display information visually and grab attention at the same time. It's a step up from the typical graph. That said, getting designers to design new themes and providing them a cut might be an interesting way to monetize.

andos• 14 years ago

I really need something like this. However, I watched the video and came back unconvinced. You don't show me how to manipulate data. How do I get it into the canvas? Can I get it from APIs? from Google Docs? Can I bind data to attributes of the objects I drag and drop into the canvas? Can I filter and aggregate my data or must I preprocess it offline? We really need a web app that brings infovis to the masses — like a Garageband-ified Tableau. There's nothing like that yet. But if you are just a themed clipart canvas, you'll find a formidable competitor in PowerPoint.

sigkill• 14 years ago

In the introduction part of the video, I expected to be shown how to add and manipulate data. We also don't know if you can pull real-time statistics or is this going to be just a pretty front end for CSV/Excel sheets.

Your point about Powerpoint is spot on. And the bonus there is you can directly cut-paste graphs from Excel into it with the least amount of hassle.

crjn2• 14 years ago

So true, without data binding it is just a graphic editor or a mockup creator. Here is a new webbased dashboard/infographic app coming in few days http://www.infocaptor.com/help/infocaptor_enterprise.htm

It has the canvas drag drop and integrates with google spreadsheet or your database to build infographics style dashboards. Infographics without data is a static image, data adds life to it.

tedmiston• 14 years ago

I skipped the video in favor of the demo, but I couldn't figure out how to use my own data for the area graph either.

hajrice• 14 years ago

Love the idea...but why do you think someone would rather use this than just download a PSD with a lot of elements ?

I think the real value you could be creating is if you're able to get tons of designers giving you their 'infographic themes' for cheap, and then charging for access for the app. However, you'd have to make it more 'general', a lot of the themes seem to be very specific, for example, one is for some kind of data around the US demographics;

muyuu3• 14 years ago

I'm not going to spend a fortune in Photoshop.

However if someone provided me of a piece of software to this effect (producing output in open formats) then I'd be all over it. Where is this software?

Produce2• 14 years ago

http://www.gimp.org/

justindocanto• 14 years ago

Sounds awesome but here's my 2 cents/2 suggestions

1) you're creating a html5 app but you cant disable the buttons on your slider? you only have 1 slide so disable the arrows

2) you need some sort of demo of what the finished product looks like. doesn't have to be editable... just show me what it makes.

wisty2• 14 years ago

I honestly can't stand the popularity of info-graphics. In UX terms, most of them are just "painting the corpse" - pretty portrayals of fairly meaningless numbers. It's rare to have any kind of context to them (comparisons, time histories, etc), the information per pixel is often infinitesimal.

Still, they are popular for a reason - people know numbers are important, but will only look at them if they are nice and colorful. I guess I really just wish more people would look at tables, or simple line graphs; or read articles with a few numbers in them.

knowtheory• 14 years ago

The thing that is most horrifically frustrating part about "infographics" is that they take the worst offenses of fad-driven web design and mash them together with the worst offenses of static newspaper graphics.

They're almost always ugly, scattered potpourri of unattributed factoids. For the minority that do list sources, they're encoded into a fucking image, so they're not clickable to begin with!

"Infographics" are an abomination, and it is maddening that these guys have built a rich editor that starts with an HTML representation of their objects, and then freaking exports to a format that loses some of the most critically relevant information!

NathanKP2• 14 years ago

Well on the bright side, since they already have the code for creating an HTML representation of the objects it should be fairly trivial to make an embeddable version of the infographic which is HTML/JavaScript and which can even be dynamic.

Now that would be really interesting.

disappointment• 14 years ago

What an application like this could do is enable people who understand journalism and statistics but not design to get into making infographics. Even charts and tables are meaningless if they're compiled by people who don't understand what they say.

enjalot• 14 years ago

Why do you wish that people would change their consuming behavior and not their producing behavior? I think it makes more sense to improve the tools/standards for infographic creation (as you mentioned, there is value there) than it does to ask everybody to become a better consumer.

In any case, I feel like these kinds of reactions happen with the advent of every new communications "technology." When the masses get some new tool in their hand they overwhelmingly produce a bunch of shit. After the dust settles some small percentage of those people rise to the top by creating quality which is then happily consumed by everyone.

For me the best example is looking at the historical reactions to the printing press. At that time the only books were hand scribed by monks and they were all religious texts of high quality. When the printing press came out many people were upset that books would ruin education for everyone because so much crap would be printed. We all know how that turned out: a lot of crap WAS printed, but tell me the printing press was a bad idea. Now I'm not saying infographics are the next book, but they are a new communication medium.

wisty2• 14 years ago

> Why do you wish that people would change their consuming behavior and not their producing behavior?

Because it's a wish, and it's OK to wish for impossible things.

You're right - it's not an ideal world, and an imperfect solution is better than nothing. People need to know more facts, so they can contextualise new facts. Infographics (even bad ones) can help there. And good infographics do exist (though they can be rare).

elliottkember• 14 years ago

I have mixed feelings about this. On one hand, it seems like a pretty cool way of building these things. On the other hand, I feel as though putting tools like this in everybody's hands just leads to shitty visualisations.

Data visualisation is a bit of a science, and using it incorrectly can be hugely misleading. This is like saying "here, you can create professional-looking presentations with this new product called PowerPoint."

I don't want to put down the work that's gone into this app, because it looks great. I'm just annoyed with the number of shitty infographics that get churned out by people with no data visualisation experience.

crjn2• 14 years ago

Data visualization is a deep science and tightly related to business intelligence. It always start with data. You first list them as a simple table (raw data) and then you decide how best to show it to the world. So you start aggregating, clustering, ranking etc to refine the data and come to conclusions yourself.

Once you come to conclusion, you keep rethinking and validating that these are the right conclusions and once confirmed the next challenge is how to articulate your conclusions to the world.

You then go to your designer and give enough information to be translated to infographics/dashboard. You see it is a very involved process.

I always think my data can be easily converted to a bar chart, line or pie chart. Rest all are variations of the same. If you have a third dimension then you go to bubble or scatter charts. So visualization without data is just a wireframe

epaga• 14 years ago

Big no-no: At login, you just sent me my password in clear text via email. You should never, ever be able to retrieve my clear text password, even just in order to send it to me.

http://codahale.com/how-to-safely-store-a-password/

5vforest• 14 years ago

If they sent it to you at signup, it doesn't necessarily mean that they're storing it without encryption.

Smerity• 14 years ago

Email isn't sent in an encrypted form by default so this still indicates a serious concern. Either they a) don't hash passwords or b) are happy sending passwords in cleartext across the internet to machines that you don't directly control.

deelowe• 14 years ago

The only time a server should see a password is when it's generating or comparing against the salted hash using something like bcrypt. There should never be a way for a server to retrieve the plain text password. Ever.

jvm2• 14 years ago

The other replies to this comment are correct, but just to be clear: USER PASSWORDS SHOULD NEVER BE STORED ON THE SERVER, EVEN IN ENCRYPTED FORM.

jenius• 14 years ago

Yeah... I'm not super surprised by this really. Initially it looked fine, but the more I looked at the design and way the site worked, the more I realized it was really questionable in quality. For example:

- "Infographics are 30 to 40 times more likely to be viewed and shared vs. text." - an un-cited statistic they put upfront. almost ironic

- Left and right arrows don't do anything, they just hash the url

- Their feedback url isn't an actual place for feedback, it's a survey

- Click login - the back end is wordpress (?!)

- If you view the source, you can quickly see that this was made with a pre-assembled wordpress theme (http://test.nattywp.com/preview.php?theme=ifolio)

- The rest of the source is an absolute mess with inline styles and scripts

... if this is the amount of effort put into the landing page, it's hard to trust the rest of it...

jonknee• 14 years ago

That's because they're using WordPress, emailing passwords is how WordPress works.

Jacobi• 14 years ago

The idea is quite good, but I can't even change the color (a message box indicates that this feature is coming soon !). This isn't beta software. I expect from a beta version that all the important features are done.

robert00700• 14 years ago

Some keyboard shortcuts would be fantastic (Especially delete!)

sao• 14 years ago

Like the idea - as someone who regularly needs to put together shiny views of rather mundane data, I'd say it's less about the "infographic" (i.e. design elements) and more about having useful data views that convey the meaning represented by the data. So - there's a design challenge for you... come up with templates that aren't just "themes" but rather communicate an idea.

talmand3• 14 years ago

I'd be curious as to what problems they are having with IE to not support it. When I get in there it complains about me using IE but I can edit the objects they provide much the same as any other browser they do support. It's just the UI bar is not showing so I cannot create new objects.

It's just curiosity really, what's the technical hurdle in this case for IE?

joshmlewis• 14 years ago

I understand where you're coming from, but as a side note, I love how everyone is now for IE. It's quite ironic. I almost did this myself yesterday when I saw someone didn't support IE. I wonder how far this trend will go?

talmand3• 14 years ago

Well, it's not that I'm all for IE as it is not my browser of choice. I just choose not to ignore it since it is still a rather popular browser. I get curious as to why people choose to do so. If your web app requires a feature that IE doesn't support then I understand, but ignoring IE simply because of preference just seems like a lost opportunity.

But to suggest an answer to your question, I think we may finally be at the point that people can let grudges of the past go and realize the people working on IE today are not the people who created the problems associated to IE6 in the past.

At the least the website in general is rather nice about it all.

jvm2• 14 years ago

Nowadays with IE10 almost here and IE9 half-decent itself, failure to support IE is sort of a signal of unprofessionalism, since it usually takes a modicum of effort to support it. Personally I design sites first in Firefox, then extend support, and I find Webkit browsers are often more broken than IE.

tubbo• 14 years ago

lol I love the "charts" feature, because charts don't actually matter or something as long as they look like they're going up over time people will buy it

ChrisArchitect• 14 years ago

easel.ly - great name.

neilharris• 14 years ago

Hey guys, this is Neil from easel.ly. Firstly we're really enthused by all the responses. We are very early beta and currently could not be more bootstrapped. We appreciate the feedback and are working feverishly to fix many issues we have. We were not aware of the plain text password being sent out. My apologies and this has been fixed.

Thanks for all the great feedback.

fallenhitokiri• 14 years ago

do you plan adding an option to delete an account?

hitting "update profile" (tried to change my password) results in an empty page with just your header. (still pointing to profile.php)

NathanKP2• 14 years ago

I hate to be the grammar nazi but:

"When your ready export your infographic."

That should be:

"When you're ready export your infographic."

danso• 14 years ago

No, that's not being a grammar nazi...this would be:

"When you're ready, export your infographic"

(and that arguably isn't...commas are important)

wavephorm• 14 years ago

You forgot the peroid.

sgt101• 14 years ago

I loved this, I was productive in minutes.

Fab. Thank you.

taskstrike• 14 years ago

I saw a lot of these infographics on graphic river. http://graphicriver.net/item/elements-of-infographics-with-a...

I hope you paid the correct license for these things.

zobzu• 14 years ago

Somehow this is quite slow in FF (its fast in Chrome)

laconian• 14 years ago

85% (big pie colorful pie chart showing 85%) of people don't like infographics. 40% (big pie chart of 40%) of infographics are false. 75% of people don't care that these pie charts add up past 100%. 100% of those people just want to see their biases confirmed by colorful pseudoscience and bogus statistics.

hk_kh• 14 years ago

What are the benefits of using [this] vs, let's say, a free svg editor like Inkscape?

You could argue that Inkscape is just a svg program, while this site is "easy" to use.

And yet, it seems to me a couple of svgs with palettes and objects, maybe some reference fonts and a bunch of tutorials on what are the key points of an infographic would suit a better purpose.

dandelany• 14 years ago

I'm sure this is still a work in progress, but the charts feature doesn't really do anything at the moment, it just sticks a chart-looking image into the infographic.

Honestly, like many people, I'm more than a little annoyed at the popularity of low-information-density infographics. That said, I like the idea behind this project, as a tool like this could definitely encourage people to create better, richer infographics with more interesting data. However, if this is to be the case, the "chart" module should be the first module that you get working correctly - charts are THE most important part of infographics, everything else is just fluff. The fact that the most important feature is currently just a placeholder does not bode well for this project.

I will stay optimistic about the future of this tool, but call me when you get charts working, until then it's basically just a drag and drop design toy.

Lambent_Cactus• 14 years ago

I get that you're going for a mashup of "Easel" and "Easily" as in "Easily create Infographics!" The spelling, however, makes my mind go first to "Weaselly", which I imagine is not the association you want to create.

adventureful• 14 years ago

Small suggestion: add information to your html title. I often bookmark services to come back to when I have more time, and the title merely says "easel.ly" - which is non-descriptive. I customized a description on my end of course, but the point being, it might help users if you put into the title what easel.ly is / does.

adam890106• 14 years ago

What tools are they used, or what kind of tools do you recommend to build html5 apps like things? (js libraries, frameworks etc)

Easel.ly - A nice HTML 5 infographics editor

Related Stories