Hacker News new | past | comments | ask | show | jobs | submit login
Show HN: Survey Builder with Drag/Drop Logic Branching (visimojo.com)
165 points by martinaglv on Dec 5, 2012 | hide | past | favorite | 64 comments



Wow, this looks really good. I've spent some time designing UIs to solve the same problem, and you've done a better job than I did.

I just have a couple thoughts:

1. Give the demo by pointing out things in the actual application. Psuedo UIs or presentations aren't nearly as effective.

2. Allow me to use the scroll function (in both directions, like on a trackpad or magic mouse) to move around the interface. At first I thought it was broken before I realized I needed to click and drag.

3. When dragging a question to reorder, change it so that you are dragging the actual question, not a copy of the question. Leave a dashed border around where the question was.

I often find it helpful to highlight the drop-able areas as well, but this may not make sense for this use case.

4. Make the Settings and Delete icons on the questions more clear. Since they are hidden in the bubbles it is hard to tell what the icon actually is. Be clear first, clever second. If one of those has to go, get rid of clever. (paraphrasing Jason Fried)

Very nicely done. Keep iterating and you'll have a great product.


Amazing advice! Thank you very much.


Very cool, I built something similar for a marketing application called Bronto a few years back. Here's a screenshot:

http://cl.ly/LMn2

Same kind of in-out flow but for marketing, sending emails, segmenting contacts, etc. The fun part was drawing the bezier curves using canvas between each node!


This looks very good! I took the decision of fixing everything to a grid early on and still pay the price for it (I have yet to make connections overlap properly). Having everything floating free on the stage is probably a better approach.


http://jsplumb.org/jquery/demo.html is a library to make all the connecting easier. I've used it. It's pretty nice.


I like the fixed grid. It forces the user to not have a mess out of it. As for the connections, maybe the "metro map" style would work (with rounded corners).


I have some experience in this area, here is my wishlist that I haven't seen yet in dynamic survey/assessment builders:

1 - Form Item labeling. I can't say "First Name" = 'firstName' in wufoo, instead it gives it an arbitrary id of form_1_154. This is BS and means I have to create a mapping table.

2 - Embed on site. Give the ability to embed the form as-is on an existing website without having to rely on an iframe or other such hacks.

3 - API. API. API. Allow the creation, deletion, edit, export, and import of form information.

4 - Internationalization. Allow me to translate my text in X languages.

5 - Reporting. This is where wufoo really has a good setup.


I love the 'Story' Page. Honest, passionate, ballsy. Hold on to the fire, dude!

"Visimojo is developed by Martin Angelov, a 23 year old developer / designer from Bulgaria. What makes this project interesting is that it shows how a kid from the farthest corners of Europe can build a service that can teach the incumbents in a $7 billion industry a thing or two about interface design."


My screen's resolution is 1200x1920, which is, apparently, not big enough to run this...?


Oops, didn't occur to me that somebody would have their screen in portrait. Will fix it in a moment.

I do think that there should be a minimum resolution set as the application is unusable on small screens. Any suggestions on how to handle it gracefully would be greatly appreciated.


In all honesty, the size requirement is terrible. I took one look at the page saying I need a bigger window and hit ctrl-w and thought: "well maybe that was a cool page, the headline sounded good. Oh well". I'm not against resizing my windows, it's just that with nothing but a headline to go on, I'll just move on to the next thing. Even if you don't show me the app, but instad a splash page and some screenshots that keep my interest, with an explanation of why I need to resize, I'll probably think, "Oh ok, and it's new, cut them some slack" and resize away.


Agreed. That screen was my first impression, which hasn't made me at all curious enough to faff about with my browser to make it display properly. Since I use OS X, I have no reason to run my browser maximised.

Also, the mere presence of such a 'feature' just makes me think that the design wasn't thought through well enough. I actually don't know, because again there's no effort made to convince me otherwise.


one of my opera side panels was on (width 40px) and it complained, and I gave up and came back to read the comments, then went back in and switched the panel off and it was fine. I would suggest, why not work out exactly how many pixels it has to be to not look rubbish. then set the limit at that. or, put it as a warning that it could look much better as it is intended to be used at a higher res. Once read, the message can then be dismissed?


I agree with the above - rather warn the user then shutting them out completely!


I'm on a 13inch screen. Even if I zoom-out I can't access the application. That's a shame.


I ran into to this, but I noticed that the site was loaded anyway, just covered with a <div> on top. Just open up the developer tools/firebug/etc.. and delete the div#globalerror.


1366 by 768 (we have several hundred screens that size in the College I teach in) and no dice. We are on Windows 7 administrated staff and student computers, and we run Explorer 9.


Seems like there is no limitation in height, but in width. Try stretching your browser outside your screen for 80px. :-)

That solved my problem.


I am the creator of Visimojo and I will be happy to answer your questions. The app is still in beta and my todo list is rather long, but I decided to release it publicly and collect some feedback.


This could be improved if you do not already have it on the todo: http://imgur.com/a/9o1bA

All I did was move the box. The connections remain the same. The "No" connection should be distinguished from the "Yes" and default connection.


Thank you for the suggestion! The connections need a lot of improvement. I will experiment with different colors to make them easier to distinguish.


try playing with the transparency on hover


Awesome app! Looks promising!

Q: You where asking permission to perform tasks when I was not using the app on my google account. Why is that? :-)

Tip: Id love to see you obscure the URL instead of using ID: http://visimojo.com/survey/take/114 as it would be extremely easy to ruin other peoples surveys. :-)

Q: I will definitely use this app when creating my surveys, and I would very well will be willing to pay for it! What would your pricing-structure be?


Re: Saw the pricing of $24/month on the page. Dunno why I missed that.

Would you consider charging for each Survey or each Response instead?


I like the URL idea - ID numbers are not very friendly (and as you said are bad for privacy).

I'd like to keep pricing simple - pay a fixed price and use it as much as you like. This to me is both easier to implement and will encourage people to use it more.


Yeah, URL Fix is key I think...

But about the pricing; consider this: * You'd probably earn hellofalot more with individual pricing? I mean, I pay per sent SMS/Email/Whatever on other services. It's the usage that will cost you money in terms of data-transfers?

If I'd use your service with a newsletter of 100 000 subscribers, let's say 10% would answer my very quick survey, you'd have to host these 10 000 users throughout the survey with $26 in your pocket.

It might be sustainable in the long run if you have enough users that does not utilize the service that much - but with a couple of enterprise users you might be out of luck(?)...

I'd still consider thinking twice about your price-structure, you might want to charge 24/month, including X answers or something?

I'd certainly be willing to pay a fixed price per month (Maybe lower) and then $0.xx per answer to my survey?

Best of luck! :-)


I got a screen resolution error at 1280x1024, but clicking onto the demo video and then hitting back in my browser got me to the app (which looked absolutely fine at my res).

Other than that, looks awesome, and really responsive on my slow netbook which is great for an app like this.


Thank you! The reason it runs nice on your netbook is that it was developed on a netbook :)

I should handle the resolution better - I set 1366x768 as a base minimum for screen size, but a width of 1280 is perfectly acceptable, and I will update it in a moment.


Your users are going to be non-technical such as managers not software developers. The message is misleading. It is talking about screen size not screen resolution.

Moreover, why shouldn’t I be able to use this at 1024x768?


Is there a real reason you can't just get rid of the size requirement? People can see to resize their browser window if they're feeling cramped and it's practical.


How will you treat using your surveys and the builder as part of another app, as a service? API, restyling, white label and pricepoint.


I am not a big fan of white labeling. I'd prefer to keep the service standalone.


This is really great. I love how you did the google docs demo as the starter modal.

Looks like a great product, but I think most of the people building these would be less technical. I saw "rick click to delete" while on mac/chrome, there's no mouse play built in.

Maybe consider simplifying the initial screen to just one block and a "do this next" message so that the user can try it? At least for lesser tech users, if you can define where they're coming from (or more often).

ex: split facbeook / twitter / HN traffic in and make assumptions as to what kind of users are coming from where.


I worked for a mystery shopping company for about 4 years and we relied heavily on surveys. There are some of the things we ran into with our "system" that I thought I'd share.

1. It would nice to have more advanced logic. For example, if I had a matrix question ranking my like or dislike of an array of sports, it would be nice to allow control flow so that I could ask follow up questions on sports I didn't like. You could do that now with separate questions for each sport (Do you like basketball? Yes/ No -> Explain), but if you rated them in a matrix there is really no way to do that as far as I can tell.

2. Using previous answers as variables of following questions. (What did you order for lunch? Sub/Pizza) -> (Did your find your %answer% to your liking)? You could accomplish this by having the Sub answer follow one path and the Pizza answer follow another path. But that would create separate questions for reporting when really you just wanted to know if they enjoyed their order, but you'd like to personalize the question based on their own answers.

3. Another logic example might be that regardless of an answer on question A, you'll go to question B, but question B might have some of it's options disabled based on the answer to question A. Again, your system could handle this by branching each answer on question A to it's own path with a modified version of question B only showing the relevant options, but I would again assume that this would create separate question B's in reporting when you might not want that.

I do realize these are edge cases and someone needing this functionality might not be your target audience. Just thought I'd share.

Great, great job so far. As others have said, it looks really good and I found it really intuitive.


SurveyAnalytics does all of the things you mentioned above, and I feel like Qualtrics does as well. Not that every system isn't limited in someway though. For examples, I've not seen anywhere that can branch based on a ranking question, which would have been great for me there for awhile.


I wanted to try it, but it's not answering at the moment.

I've used Google Consumer Surveys and Survata (highly recommended :) http://survata.com/ ) recently, and I didn't feel constrained by the survey choices. Did you detect a market need for this?


Really nice an intuitive, the only thing I couldn't seem to do is assign multiple flags to one answer?


Awesome. Put a notice notifying we need to click and drag the board to move around. By default we tend to use our mouse scrolls. You can simplly put a css `cursor:move` property on the dragable area to let us know its dragable.


Nice. I think you should try to make it more space-efficient so people can view it on smaller screens. The boxes can be packed closer together, even if you keep a fixed grid.

I wonder if you could also let it serve as a Wizard for people basides just a questionnaire. So it would suggest results based on a user's choices. (That could include links, but I don't it should automatically re-direct to the page.)

Depending on how simple you want to keep it, it might make sense to add a more advanced logic than just checking one boolean. For example, maybe let a later box depend on which specific choice was chosen earlier.


This is great. I'm building something exactly like this for internal company usage. We have a few different parts of the site that involve surveys (though I called them dynamic wizards). We occasionally need to tweak the flow so I have versioning capability added.

I initially started with a DSL that would generate everything for me but I decided a UI would be nicer.

Great job. Ours will never be available for public consumption and has to be tightly integrated into our site so it'll never see any kind of third party usage, but it's nice to see someone else doing it too!


Remove the "Next" button when it's not necessary (when there can be only one answer to the question). Just go to the next question when a user clicks on an answer to the current question.


Sounds reasonable, but one issue is what to do if the person chose an answer by mistake. Will I then have to show a back button on the next question?


Yeah, I think a back button will be a good solution.

I'd prefer to click a few times to fix a mistake then have to click twice for every answer.


Although the market is substantially smaller, this would be really cool to mash-up with Twilio to create Interactive Voice Response menus (Press 1 to get your account balance, Press 2 to speak to a representative, etc).

You could also allow users to select Text-to-speech or integrate eLance or http://www.voices.com/ and sell human voice-overs.


Not trying to be facetious but doesn't Poll Daddy solve the branching issue now? How does your product compare to something like Poll Daddy for the like to like features? Is it as easy to share/embed and view reports etc?

What I'm really looking for is a surveying solution that helps me conduct Relative Importance Testing. I haven't seen that anywhere out in the market.


"Visimojo works best on screens that are at least 1280x720. Maximize the window to enjoy it fully." my resolution is higher


Sad for my 11-inch MacBook Air.


Wow! I've imagined about his kind of polling product. Two thumbs up for making this possible.

I have a suggestion along the lines of what nathanbarry suggested, I thought using scroll to zoom in and zoom out, and having collapsible (tree structure like) questions will make it easy for users to create long polls.

All the best :)


Like it - but price is putting ME off. Would you consider per survey, instead of per month, pricing plan?


This is really great work.

Slightly off-topic; there have been a ton of great submissions "Show HN" posts lately. I find myself signing up for most of them just because I either think they are useful right now or will be very shortly. This is no exception. Keep up the great work all.


Looks really nice, like the idea of visually laying out the survey, I guess this is what people do with pen and paper anyway. Some way of customizing the style of the survey would be useful for embedding on your own site.


Agree with the above, why not have a customisable CSS sheet later? This is what we're doing at our startup, and it empowers developers to create some awesome stuff!


Amazing service, the only thing missing (and that would stop me from using it) is the ability to check the Free Text input with a regexp (to be sure that the user input is a valid email, phone number etc...)


Very nice! I'm curious how well it scales for long surveys. I used to work at SurveyGizmo and some of their customers would build epically long surveys, sometimes dozens of pages.


Check out another good project that is trying to re-invent the survey/form space http://www.typeform.com


2 more things: Autosave would be awesome!

Missing scrolling with the mouse, now I need to drag to scroll... Scrolling with the trackpad on a Mac would be so neat!


Yet another future feature request, probably already on the todolist: Password protection on Surveys.

Keep up the good work!


Will do! Thank you for the suggestions :)


I find it awesome that your survey tool functions very well, but also that it is performing so well under the load of HN #1 thread. Nice work!


For the sake of accessibility, I suggest adding the necessary functionality to allow users to zoom in using their browser (C-+ or C-=).


Is there a way to ask an open question (no list of predefined answers, but a text box for the user's answer) ? I cannot find it.


Looks great, don't have time to go through it in detail right now, but first impression - the ui and idea are awesome.


quite interesting, I'll have to take a closer look at what you've done.

My employment for the past 6 months has been on a wide and deep dataset collection tool, one that takes in arbitrary questions that can have both validation rules and workflow rules applied.

Getting the tooling designs correct and usable seems to be the hardest part.


Are you using jsPlumb? I just spent some time on a project that uses jsPlumb for a similar effect.




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

Search: