[HN Gopher] Wireflow - free, online, open source tool for creati...
___________________________________________________________________
Wireflow - free, online, open source tool for creating user-flow
prototypes
Author : Brajeshwar
Score : 323 points
Date : 2023-12-20 15:55 UTC (1 days ago)
(HTM) web link (wireflow.co)
(TXT) w3m dump (wireflow.co)
| dominick-cc wrote:
| I'm having trouble loading the webpage
| reichardt wrote:
| Looks awesome! The YouTube video linked inside the GitHub README
| seems to be unavailable: https://youtu.be/zm0XbLmXtXY Would love
| to see an up-to-date demo video.
| xet7 wrote:
| What has happened? Has some other news raised more interest in
| this project?
| hbcondo714 wrote:
| At first glance, this looks useful but is it being maintained?
| Their main branch on GitHub hasn't been updated in years:
| https://github.com/vanila-io/wireflow
| xet7 wrote:
| 1. Originally, Wireflow was made with Meteor, when there was a
| way to save data.
|
| 2. Then there was a rewrite with React, but not yet a way to
| save data.
|
| 3. Then maintainers did have some other projects where they did
| spend most of their time.
|
| That brings my questions, are some interested in this kind of
| tool? Would some like to contribute more to Wireflow? Has some
| news about other similar tools bring more interest to have
| Wireflow maintained even better?
|
| Just thinking, as one of the maintainers of Wireflow.
| simulo wrote:
| You could ask for feedback on
| https://discourse.opensourcedesign.net/ where quite some UX
| designers in open source projects hang out. I personally
| remember nokias flowella fondly, but I do not know if it does
| the same as wireflow.
| debarshri wrote:
| I had contributed the Dockerfile to the project when it was
| last posted in HN.
|
| Friendly maintainers but I think being built by an App
| development studio, I can imagine they have different
| priorities.
| highmastdon wrote:
| I'm a heavy user of excalidraw. I wonder if it would be
| possible to extend something like that to add "flow" design.
| It could be as simple as defining the dotted arrow as the
| view direction, ie. when an element is clicked, show this
| bounding box, where the dotted bounding box is used to zoom
| to that level.
| bunsenhoneydew wrote:
| You may already do this but if you haven't, check out the
| excalidraw plugin in Obsidian:
| https://github.com/zsviczian/obsidian-excalidraw-plugin
|
| Zslot has put an incredible amount of work into it and it
| extends excalidraw to have a lot of additional
| capabilities. You can also use it within Obsidian canvas
| for some of the flow stuff you mention but you could very
| likely just use the plugin.
|
| Zslot is constantly updating it too so you get new features
| and updates almost every other time you open it. Amazing
| work done there.
|
| And Obsidian is just awesome too :)
| haolez wrote:
| On a side note, Meteor always seems like a good idea at the
| beginning, but I see lots of projects failing with it. It's
| unfortunate.
| fl0id wrote:
| Seems to limited to me fwict. Likely very basic icons for
| each step. Might as well just use a normal flowchart
| _betty_ wrote:
| Almost feel like it'd make more sense to merge with another
| tool, like tldraw
| pedro_rtm wrote:
| If it got to the point where it replaced the feature set of
| Adobe XD, and it remained free and open source, I could see
| this being useful. It took me a while to get the hang of
| Figma, and sometimes you don't need that sophistication at
| the very early stage.
| CyberDildonics wrote:
| What is a user-flow prototype?
| thoughtpalette wrote:
| All the steps it takes a User to accomplish an action. Usually
| low fidelity (wireframes vs finished designs). The prototype
| part I'd assume means you can click through it (like Figma
| prototypes).
|
| E.g. Login Form. Could should initial state -> error state ->
| submitting state -> success state. Could be a "User Login
| flow".
| dalore wrote:
| > It have built in live chat which give you ability to
| communicate with your team mate and still be in the same app
| while you collaborating in real-time.
|
| Not to be the grammar tsar, but if anyone from there is reading
| this it could do with a little fixing.
| tomgs wrote:
| Small typo: it says permisions instead of permissions in the
| feature sidebar
| lfmunoz4 wrote:
| Anyone know of a similar project but written in VueJs?
| gervwyk wrote:
| What tools are others using to build these wireflows? We find
| figma too detailed and mockup does not quite get us there (not
| sure why).
|
| Any recommendations?
| cebu wrote:
| excalidraw is my go to for that in-between
| keerthiko wrote:
| I have no trouble using Figjam for this, or just figma but
| borrowing the arrow connector objects from Figjam
| staplers wrote:
| Figma isn't ugly enough for developers to want to use. /s
| baoluofu wrote:
| I find balsamiq is quite easy to get to grips with. My biggest
| complaint (at least for the desktop app, haven't tried the
| cloud version) is the lack of an "infinite" canvas.
| neeleshs wrote:
| I use balsamiq for both flows and UX "paper" prototypes. My
| only gripe is not being able to easily re-use groups of
| controls
| vanviegen wrote:
| I like text-based editing but found plantuml lacking in this
| regard, so I created my own thing. It's basically a html/css
| template engine with a library of (hand-drawn-ish) components.
| You can use it as a VSCode extension ('WireText'), featuring a
| live preview.
|
| https://gitlab.com/saxion.nl/42/wiretext-code#wiretext-vscod...
|
| A (non-text-based) alternative I kind of like is Quant-UX:
| https://quant-ux.com/
| lf-non wrote:
| Your solution is awesome. Thanks for sharing.
|
| Love the indentation based DSL - this looks very intuitive.
|
| I do a lot of quick sketches with excalidraw but I easily see
| wiretext-code replacing that with a better workflow where I
| can extract out components and prototype by composing those
| instead of copy pasting around.
| zachthewf wrote:
| Whimsical is amazing.
|
| https://whimsical.com/
| sublinear wrote:
| I've used Zeplin on a few projects and it was a good
| experience.
|
| > mockup does not quite get us there (not sure why)
|
| I can only speak as a dev, but it's incredibly frustrating when
| design agencies leave out too many details or don't
| consistently follow guidelines. No tool is going to fix that.
|
| On my side of the fence we generally don't care about the tools
| used as long as we have a completed design to look at that
| isn't late and isn't going to be pulled out from under us. I've
| seen product managers lie about all reviews being completed to
| "get devs started early" only to see the next revision break a
| ton of work. They also lie about copy text being final not
| realizing the impact even one word can have on everything. I've
| seen designers commit sins ranging from using system or
| licensed fonts causing them to have to rework an entire layout
| to not even exporting assets properly or at all before handing
| off to devs. If you have people like that, the back and forth
| and pain is endless for everyone.
| edg5000 wrote:
| Draw.io (freeware, cross-platform desktop app). I have used it
| for diagrams mainly, but also for quite a bit of UX mockups.
| Its strength is diagrams though. But it is quite generic also
| in a way.
| petepete wrote:
| I use Excalidraw for this kind of stuff. It has the best
| interface of all the tools in its class and it's easy to create
| diagrams/flows/mockups that peope recognise are 'in progress',
| but still look great.
| bunsenhoneydew wrote:
| I use excalidraw for almost everything. Brilliant tool. I
| already mentioned it in another response in this thread but
| using excalidraw inside obsidian via
| https://github.com/zsviczian/obsidian-excalidraw-plugin has
| been a game changer for me.
| lxe wrote:
| I clicked and started drawing. Can export as image. No logins, no
| signups. What a delight.
| pazimzadeh wrote:
| No signups is great.
|
| But what do you mean by drawing? Are there supposed to be
| drawing tools?
|
| It looks like bunch of templates for constructing site-maps?
|
| Is this supposed to encompass mobile design patterns as well?
|
| I understand it was done in less than a month but if you take a
| few days to learn something like Principle
| (https://principle.app/) then you could the rest of the work in
| two weeks and have an interactive full scale prototype in at
| the end.
| sublinear wrote:
| I'm a bit confused about the delivery of this. It's presented as
| an installable web app, but seems to be completely broken in
| chrome for android.
|
| I'm not sure what I expected trying to check it out on my phone,
| but I'd at least expect to be able to run it on a tablet. The use
| case for running it on a phone might be to view, but not edit a
| project. One might need to review changes and reply to an email
| chain or teams chat between meetings from their phone if this was
| going to be used in the real world. Would suck to need to juggle
| nth-revision PDF exports about an app design. Everyone hates
| that.
| saint11 wrote:
| This looks really useful! I wonder if it's easy to fork it to
| make game design icons.
| pihentagy wrote:
| What is the point of this project? I can just add screens
| (which are stock graphics, can change the text). I can add
| relationships between screens (but not clickable).
|
| So this looks like a sitemap.
|
| Is that all?
| juliushuijnk wrote:
| Wrote an article a while back about the idea of creating flow-
| charts like that based on your actual smartly-minified
| wireframes. https://medium.com/proof-of-concept/the-story-of-a-
| true-ux-t...
|
| I eventually want to incorporate something like this in my tiny
| ux app (https://www.tinyux.app), but have not yet gotten around
| to it.
|
| It would be so cool if you could start either from the flow, page
| or component perspective, but all are essentially using the same
| source of truth.
|
| Had a presentation once to a room of UX designers who really
| liked the vision and concept. Then I showed them my prototype
| with vim-like text commands to manipulate wireframes and got a
| lot of blank stares. Still makes me laugh to think about that
| mismatch of expectations.
___________________________________________________________________
(page generated 2023-12-21 23:02 UTC)