A "flowchart" has very specific meaning in programming contexts [1]. This tool is for wireframing [2]. It's also really just for the flow between pages, as the pages themselves are all pre-baked. There don't seem to be any tools to connect elements of the pages to one another, although some of the example diagrams have that feature and completely different toolbars.
> A "flowchart" has very specific meaning in programming contexts [1]. This tool is for wireframing [2].
Wireframe also has very specific meaning for UI/UX people and this is not it. This is some combination of site map and user flow diagrams tool, and it's actually very close to diagrams that IME people who do this type of work have to draw a lot of. So it might not do what you'e expected by the title, but that probably just means you're not their target audience.
s1mon 1302 days ago [-]
Agreed. I was trying to imply that you could almost do something like a very simplified wireframe, if the prebaked images happened to be close enough to the layout of your intended pages on your site. But part of the point of a wireframe is to show the hierarchy and layout of elements on the page, and how they connect. You have no control over any of that other than choosing the closest diagram, and connecting whole pages. I’m sure there is still some value to the tool, but the description is not accurate.
keerthiko 1302 days ago [-]
On the official site they call it a wire flow or user flow tool, which feels correctly more vague and less misleading.
neogenix 1304 days ago [-]
Looks cool. However, for me in Firefox the dragging of elements from the left bar to the canvas doesn't work. It works fine in Chrome.
pjmlp 1304 days ago [-]
Yep, another Chrome only application.
alskdj21 1304 days ago [-]
What works for me was dragging from the corner of the <div>, not from the svg itself. (Firefox 81.0, Ubuntu 20.04)
Looks neat! Great work.
1304 days ago [-]
franckl 1304 days ago [-]
it doesnt work for me on firefox/osx unfortunately
Same here (Firefox 81.0 on OSX.) No errors in the javascript console.
TehCorwiz 1304 days ago [-]
Same dragging issue here.
Firefox Developer Edition 82.0b4 (64-bit) on Pop_OS.
cryo 1304 days ago [-]
It seems to work by dragging the whitespace around the icons, not the inner portion.
j45 1304 days ago [-]
This app looks great - it would be really helpful to use it in Firefox where a lot of devs, designers and techies are.
oizo 1304 days ago [-]
Not working for me either. Firefox 80.0 on Linux Mint 20. Dragging outside svg's doesn't do the trick either.
vanilataher 1304 days ago [-]
Unfortunately, we did not have enough time to take care of the firefox related issues. :( However I think this is doable with the right polyfill.
zakki 1304 days ago [-]
it works for me using right click and drag the object on the left to the canvas. I am using firefox on mac.
nextaccountic 1304 days ago [-]
Dragging with right click works with firefox on linux
Coxa 1304 days ago [-]
Same, latest firefox on windows
bauerd 1304 days ago [-]
The project website autoplays a terrible sound on page load and gave me half a heart attack. You should remove it
superasn 1304 days ago [-]
Yes, that is such a strange this to do. I'm really confused why a website would play a loading sound!
notJim 1304 days ago [-]
Playing any sound is bad enough, but they seem to have specifically chosen one that is designed to give you a stroke or something. It's honestly kind of amazing to me.
fb03 1304 days ago [-]
it's only a half stroke tho.
rockostrich 1304 days ago [-]
I immediately closed the tab. What year is it? 1999?
captainill 1304 days ago [-]
This is not a good experience. Very bizarre choice.
deanclatworthy 1304 days ago [-]
It's obnoxiously loud.
ivan_ah 1304 days ago [-]
This is great. I didn't see a way to save the diagram "source" which would enable the user journey: edit-edit and save partial progress today, then load and continue editing tomorrow.
Still even without save this is already very nice way to explain user flows in a website. Good job!
Some suggestions:
• plz remove the sound that plays when you go to the homepage https://wireflow.co/ (I know it's just a short sound, but sets an unpleasant precedent)
• perhaps there could be an "import your own page type" and they get added to the sidebar? (user uploads will be pngs, not nice svgs as the stock ones but still)
• add save + load option (to keep it simple, use native format of the app, assuming json)
• keep it simple and single purpose: it's super nice and simple right now, but if you add lots of features it won't be
• show some example user journeys (to give visitors ideas how they can use for their own project)
vanilataher 1304 days ago [-]
You are awesome! Thank you for sharing those cool ideas and valuable suggestions.
looks very polished. Great work! Havent seen many opensource UX tools
Wishlist:
1) App Screen Dimension (iphone, ipad etc)
2) A way to resize the Dimensions (longer, leaner, shorter etc)
3) Popups, Modals
4) Micro interactions (menu on/off)
5) A way to annotate, add sticky-notes on the canvas.
6) Whiteboard type of pen tool to markup areas (ex: this block is for next sprint)
7) A play button to preview the site (clickthro)
Thanks again for sharing!
the_arun 1304 days ago [-]
8. Didn't see a way to save our creations for later use. That would be good
vanilataher 1304 days ago [-]
It was there on version 1, this is version 2 and a lot of features are on roadmap.
itsdsmurrell 1302 days ago [-]
Looks very useful. Your main website has this twice on it:
"Vanila crew is in love with Meteor.js, which is latest technology based on JavaScript (Node.js). It gives you fast, realtime, scalable applications which work on all modern browsers and devices."
It's possible that you wanted to make the second instance "It makes your applications fast, real-time, scalable and able to work on all modern browsers and devices" ;)
TooCreative 1304 days ago [-]
When I go to the editor, Chromium shows me a little plus in a circle next to the bookmark icon. Hovering it with the mouse shows "Install Create React App Sample". What on earth is this?
onion2k 1304 days ago [-]
It's the default title for an installable web app created with React's 'create-react-app' tool.
yonl 1304 days ago [-]
Looks really polished. Great job. I didn't see any pricing in the hosted version. Are you not gonna monetize the hosted version?
virgilp 1304 days ago [-]
Your URL for "become a backer" doesn't work - maybe you want to fix that :)
anjanb 1304 days ago [-]
ALT+D (to go to the address bar in chrome and other browsers) doesn't work once I drag element from the left panel to the canvas. Please make it work. otherwise, looks good.
nawgz 1304 days ago [-]
How much work is actually done here? Looks like it uses gg-editor to do everything from a glance
ryan-allen 1303 days ago [-]
This seems overly abstract to me, but we need better tools for these kinds of things!
murukesh_s 1304 days ago [-]
Looks neat. Wish you can add floating text labels and option to add custom svgs and pngs
gengear 1304 days ago [-]
really nice Firefox has dragging issue. works fine if dragged on the whitespace.(firefox 81.0 windows 10)
moltar 1304 days ago [-]
Looks great! Very neat.
senectus1 1304 days ago [-]
really really nice!
Igorvelky 1304 days ago [-]
Does NOT work on FIREFOX.
Are you * serious? XD
victor106 1304 days ago [-]
> Vanila crew is in love with Meteor.js, which is latest technology based on JavaScript (Node.js).
Surprised to see this. I thought the development of meteor.js has stopped.
ocdtrekkie 1304 days ago [-]
One of the reasons I actually am a bit sad they removed Meteor from this version of Wireflow is that Meteor assumes storage is server-side, instead of using localStorage, which I find a very irritating trait of "modern" web apps, where everything you did is forgotten when you switch devices or browsers, clear your cache, or what-have-you.
My impression of Meteor over involvement with a Meteor-based project for a long time is that Meteor was seen as cool when you sit and play with the demo code, but once you're out in production projects it starts to get pretty hairy. It seems to work pretty well for side projects, but probably isn't super ideal to build your business on.
FWIW, it's been pretty stable though for a number of years, and stability is severely underrated in web dev.
indymike 1304 days ago [-]
Meteor has been under active development for a long time. It's not nearly as hot as it was 5-6 years ago, but it's still definitely a thing. A lot of the team that built Meteor went on to work on Apollo, the GraphQL data library. One of my companies has a Meteor based app...
xet7 1304 days ago [-]
Meteor.js has newest Node.js LTS etc dependencies, and is actively maintained.
vanilataher 1304 days ago [-]
Actually vanila crew moved away from meteor.js but hadn't have enough time to update the landing page to current trend (next.js reactjs etc.). You know technology changes a lot.
non-entity 1304 days ago [-]
I was under a similar impression. I recall it being a midly interesting idea, before a lot of people determined it had too many issues and it fizzled out and the company began to push some other project.
Rendered at 09:59:01 GMT+0000 (Coordinated Universal Time) with Vercel.
[1] https://en.wikipedia.org/wiki/Flowchart [2] https://www.experienceux.co.uk/faqs/what-is-wireframing/
Wireframe also has very specific meaning for UI/UX people and this is not it. This is some combination of site map and user flow diagrams tool, and it's actually very close to diagrams that IME people who do this type of work have to draw a lot of. So it might not do what you'e expected by the title, but that probably just means you're not their target audience.
Looks neat! Great work.
Firefox Developer Edition 82.0b4 (64-bit) on Pop_OS.
Still even without save this is already very nice way to explain user flows in a website. Good job!
Some suggestions: • plz remove the sound that plays when you go to the homepage https://wireflow.co/ (I know it's just a short sound, but sets an unpleasant precedent) • perhaps there could be an "import your own page type" and they get added to the sidebar? (user uploads will be pngs, not nice svgs as the stock ones but still) • add save + load option (to keep it simple, use native format of the app, assuming json) • keep it simple and single purpose: it's super nice and simple right now, but if you add lots of features it won't be • show some example user journeys (to give visitors ideas how they can use for their own project)
Wishlist:
1) App Screen Dimension (iphone, ipad etc)
2) A way to resize the Dimensions (longer, leaner, shorter etc)
3) Popups, Modals
4) Micro interactions (menu on/off)
5) A way to annotate, add sticky-notes on the canvas.
6) Whiteboard type of pen tool to markup areas (ex: this block is for next sprint)
7) A play button to preview the site (clickthro)
Thanks again for sharing!
It's possible that you wanted to make the second instance "It makes your applications fast, real-time, scalable and able to work on all modern browsers and devices" ;)
Are you * serious? XD
Surprised to see this. I thought the development of meteor.js has stopped.
My impression of Meteor over involvement with a Meteor-based project for a long time is that Meteor was seen as cool when you sit and play with the demo code, but once you're out in production projects it starts to get pretty hairy. It seems to work pretty well for side projects, but probably isn't super ideal to build your business on.
FWIW, it's been pretty stable though for a number of years, and stability is severely underrated in web dev.