abynim/userflows

A plugin for generating user walkthroughs from Artboards in Sketch.

userflows's Issues

Generate flow diagram not working

Hi @abynim, thanks for your plugin, it's amazing.

I have a simple file with a few connections, but when I select generate flow diagram (either via menu or shortcut):

• The page '_Flows' it's not created
• No flow diagram is created (even if use a different, existing page)
• The Connections group is now hidden

I'm using the latest version of both your plugin (2.0.4) and Sketch 42 (36781).
Video here:
https://youtu.be/Q9lJnisUx5A

Feature Request: Ability for custom page name

Currently a page called _Flows is created. Which may or may not fit into someones naming system. You can rename it, however when a new flow is created it won't respect the new name.

User flow not working for Sketch version 39

User flow not working for Sketch version 39...latest release

Issues with copy/pasted items randomly getting connections

Making a connection from one item to another artboard. When I created the connection, another random connection came from a copy/pasted element to another artboard at the same time. Was fixed when I recreated these elements instead of copy/pasting them.

Request: Update Generated Flow Diagram

Ability to update an existing flow diagram without having to generate a complete new one with title and description.

Also, this is a great plugin, thank you for making this!

Possible to remove bounding box around element? So its just the dot.

Plugin not working with latest Sketch version

Hi there

I started using the plugin, which I love but it stopped working after a while. I have a message confirming that the link was created but is not showing. Same for the removing action, it is confirmed by a button at the bottom.

Thanks,
Letizia

in certain cases connecting to a "duplicated" artboard doesn't work

If you try to connect to a duplicated artboard after a connection has been made to "original" artboard, the new connection will be made to the original artboard also.

Steps to reproduce:

1. Create Artboard (Let's call it A1, you don't actually have to rename it)
2. Create another Artboard (Let's call it A2, you don't actually have to rename it)
3. Add 2 shapes (say Rectangle R1 and R2) to A1
4. Create Connection from R1 to A2
5. Duplicate Artboard A2 to create Artboard A2_dup
6. Create Connection from R2 to A2_dup

You should now see a connection made from R2 to A2 instead of R2 to A2_dup
This only happens after you duplicate something with an existing connection. If you duplicate before any connections are made, everything is fine. So it's an edge case, but a relatively common one.

Feature request: Keep connections when pasting page to different file

It would be quite nice if connections where kept while pasting whole page to a different document. Currently they're being transferred and visible, only until a 'Redraw Connections' keyboard shortcut is being pressed, then they disappear.

The reason this could be useful, is when you work with multiple designers on one project and trying to follow a git-flow like approach with separate files for features and one master file. This involves manual merging of documents, hence pasting artboards with already made connections.

Do you think this is possible to achieve?

PS Love the plugin!

Install Sketchpacks Relay Integration

https://github.com/integration/sketchpacks-relay

Incorrect starting point

I have a larger layer that hangs off the artboard. I'm trying to have a flow arrow go from one artboard to another by selecting this layer. The RED arrow is pointing to the incorrect start as its overhanging the wrong artboard. It should be where the green arrow is, and not the hidden layer. Make sense?

Feature-Request: Avoid connection lines to cross over artboards

Hi and congrats!
Awesome plugin!
I would completely fall in love with this plugin if the generated flow boards didn't look like spaghetti monster porn.
It would be great if there was a way to keep the connection lines from crossing over the artboards but instead move in the space in between the artboards either automatically or manually by hand.
I understand this isn't at all easy but I think it would make a world of difference in the generated output and the flexibility of use!
Cheers!

Attach connection to closest edge of trigger & artboard

Problem
As you can see from the attached image, there are currently two issues:

• Connectors on triggers can appear on the top, bottom and right, but not on the left side of the trigger (typical for "pointing back" to a previous screen)
• Connectors always attach to the top-left of an artboard. This means the connector often cuts through the artboard it comes from and links to.

Proposed solution
I realise this may not be an easy feat, but...
It would be really great if the connecting line between a trigger and the related artboard would always connect to the nearest edge (or better, the nearest point on the nearest edge).

Note: in the proposed solution the connectors are straight because it's a quick sketch, not because I would suggest making them straight instead of curved

Incorrect renders of text with overriding fill colors.

When I have text "12:30" that has a different fill color as shown below, generating a userflow only respects the color near the text options. Sketch export doesn't behave this way.

User Flow stopped working on Sketch 3.8.1

UserFlows stopped working on sketch 3.8.1. It creates the bitmaps but the it does not export it to the proper page designated and the does not create a proper canvas

Feature Request: Custom text styles for conditions / flow diagram

This would be super helpful.

FYI: Don't install via Sketch toolbox.. yet.

Tried to install latest version via Sketch toolbox but I don't think it has been updated yet.

Just download the sketch plugin file from here and double click to install. Working brilliantly.

Thanks Aby!

Hide connections doesn't hide conditions

I hide the connections before exporting to Invision, that works fine though my conditions aren't hidden and are uploaded to invision. Would be nice to have those hidden as well, saves me having to delete them in Invision afterwards.

[Feature Request] Integrate with Sketchpacks Relay to serve auto-updates

More details found @ https://github.com/integration/sketchpacks-relay

Example

UserFlows doesn't work on Sketch 4.xx

Can't create user flow links with the latest version of Sketch 4.xx.

(Not a) Feature Request: Merge 'User Flows' with 'Craft Prototype'

User Flows is a great capability expanding Sketch further and fits my work an interaction designer (and I believe especially interaction/UI/UX designers in agile environments) well.

However currently using User Flows and Craft Prototype adds a layer of complexity and manually crafted redundancy without an overview of the flows in Craft Prototype.

Therefore @abynim I would love to see Craft Prototype growing into an even more mature extension of Sketch giving it the super powers it deserves.

Feature Request: Flow diagram 'Connection Schemes' & styles

I generate flow diagrams with different purposes/level of detail, according to WHAT I'm showing I change background colors, connection colors and text styles.
My suggestion is in 2 steps:

Step 1
It would be great if one could assign document styles to connections (color), background color, Diagram Title (font, size, color, ecc..), Diagram Description (font, size, color, ecc..) and Artboard Titles (font, size, color, ecc..). By the way, is there a way to avoid the artboard titles being numbered? (Home -> 1. Home .. just wondering if I missed something)

Step 2
This is more complicated. Rather than having to duplicate pages with all the artboards and then creating a different connection scheme (and having to maintain at that point several pages) it would work wonders for me if I could create a different 'Connection Scheme' with, from step1, different styles associated with them on the same page or for the same artboard set.

Here's an image to explain my proposal:

(Update: in che Flow Scheme 2 the path should read 'Case 2 flow path..sorry!)

Once you can apply different connection schemes to a page/set of artboards you can get pretty specific about the flows you might want to represent without the overhead of duplicating pages and maintaining artboards. (converting an artboards/pages to symbols doesn't help because you can't link a specific item within a symbol).

Generate Flow Diagram breaking for me

Hi there!

Really lovely plugin. So, so simple to set up and use. It worked well at first, but on a new project I made from scratch it broke a little. I'm confused and could use some help.

Here is a screenshot of how my flow is set up currently:

Here is the result I'm getting:

I've tried doing different connections and having things on conditionals vs not on conditionals and still getting wonky results.

It worked well on a separate project:

What am I missing?

Thanks so much!
Jason

Plugin not working in Sketch 3.6.1

Hi there.

UserFlows isn't working in Sketch 3.6.1.
I think this plugin is very useful.
Is there a fix for this issue?

Thanks!

Not Sketch 3.8 compatible?

Just tried using User Flow after the latest Sketch update and it didn't work.

Allow for more if/else statements when creating conditions?

I have one flow where there's 5 device centric screens - as is I have to create the conditional box with one if else, then edit to add an option, edit again, edit again, etc. Being able to spawn more inputs on the initial creation would be appreciated. :)

New link connected to one artboard

Hi! After updating User flows 2.0.3 (from 2.0.0) links don't work http://take.ms/i5m4K
Sketch 41.2 (35397), MacOS Sierra 10.12 (16A323), User Flows 2.0.3

Feature Request: Multiple Flow Arrow Colors

I have a need to show different types of connections (usually progressive actions vs. regressive actions). It'd be awesome to make a keyboard shortcut that's the same function as a connection, but a secondary color you choose in settings.

How can I set quickly flow arrow border thickness?

I want to change default arrow border 3 to 7. Can I quickly change it? Or Do I have to separately choose layer of flow arrow?
Great works, thanks for this plugin.

Removing an existing link

Hi @abynim ,

Loving your work here. You can't possible imagine how much designers/devs are crying with joy now.

I noticed there was no instructions on 'Remove Links'.
For example: I linked Button A to Artboard A, now I'm changing Button B to Artboard A. How can I go about doing so?

Starting Board to generate separate flow not working

Hi, I have several processes on the same sketch page with different and independent flows not connected to each other.
The boards that start each process have this naming patten:

• Home (the first designed)
• Home Medic
• Home Housing
  When I try generating the flow diagram from the 'Home' process all is ok. If I try generating a diagram from the other two it will pick a random artboard of the first flow and generate the diagram from there. It doesn't seem to recognize any board I select of the other two processes.
  Any ideas?

Feature Request: Ability to assign a link to a nested symbol

@abynim First I want to say awesome plugin!!! This is really going to help to create quick 1-off flows for UX reviews.

Personally, I create flows using symbols containing multiple elements & nested symbols (E.g. 1 Symbol that includes Page Title, Back button & Search button) that I replicate across any # of Artboards.

If there was a way to assign the Link start point to a nested symbol element that would be really beneficial!!! Currently, you need to break apart your symbols to accomplish this task.

"Generate flow diagram" dialog

@abynim, very useful plugin. thanks for developing it.
A few UX recommendations IRT "generate flow diagram" dialog

1. When the dialog opens, place the focus on the Flow name, so i can start typing immediately.
2. put the Flow Name field first (above the "Start from" field)
3. if a single artboard is selected when the "Generate flow diagram" is invoked, pre-fill the "Start from" with the selected artboard
4. in the ""Start from" dropdown - list the layers in an alphabetical order

Feature request: Add top to bottom flow direction

Would it be possible to add an option that allows users to specify the direction of the flow diagram? For example, I'm using this plugin with a desktop design and the long, left to right, flow of the PDF is a little awkward to share. It'd be awesome if I could tell the plugin to generate a top to bottom flow that coincided with the natural flow of a multipage PDF document.

Change "Connections" group name for InVision Sync compatibility

I need to avoid that my connections are automatically published to InVision when i save the sketch document.
The solution I suggest is to rename the Connections auto-generated group to -Connections
Or we could let the user to choose the group name in the settings panel.

Published Releases

Currently, UserFlows v2 is not being served by Sketchpacks.

To take advantage of Sketchpacks Relay, it's best to publish semantically versioned releases to be served to your users.

• Creating releases

Typing in either field in the dialog causes Sketch to crash.

Using both Sketch 3.3.1 or 3.3.2:

• Select elements to link for flow
• Run the plugin
• After the dialog appears, typing anything on the keyboard causes Sketch to crash

Note that even if I hit cancel, Sketch will crash on any keyboard input afterwards.

I'm not sure if this is your plugin per se, or Sketch itself. But I use other plugins with dialogs and don't have this issue at all.

Connections in Exports

First of all, great plugin, thank you!

When exporting artboards from some files, like to Zeplin, the connections seem to somehow get picked up in the export as well. This only happens in some of my files, others work as expected. The connections group is non-modified, and hasn't been accidentally been brought into the artboard. I believe this has something to do with the file itself, which has been around for a while (from back in the day where each artboard had a checkbox to ignore/include anything above it). Does this sound realistic to you, and do you have any suggestion for how I might look under the hood to figure this out?

Erased links reappearing

Hello there. Nice work with the plugin. Really useful, i must admit it.
I have only one problem, and I don't know why...
Everytime i try to erase/remove a link, when I draw a new one, all the others that were drawn, reappear. And I end up with dozens of old links, all at once. It's like I can never erase them...
Any ideas ?
Thank you !

Option to not allow lines to cross artboards

The autogenerated lines cover up other artboards. Is it possible to route them around (possibly only with straight lines).

Reset (Remove) all links & Remove link from non-existing layer

1. It will be useful if there is a command Reset (or Remove) all created links.
2. If you have a layer then link it to an artboard, then after deleting the layer the link remains, which is OK. But since the layer doesn't exist anymore, there is no way to remove the link coming from it.

Honor opacity settings of the Flow Indicator Color

Currently, opacity changes to the Flow Indicator Color have no effect. So long as flow indicators are crossing over UI elements, it would be useful to be able to cut opacity to them for readability.

Plugin not working in Sketch v3.4.4

I updated to Sketch 3.4.4. When I attempt to generate a flow, the flow is generated incorrectly (a small artboard with nothing on it) on the incorrect page (always generates on the currently active page).

Feature request: Annotation description per page

I would like to be able to set description per page. Now i make them manually. Just underneath the image would be great!

Feature Request: Link 2 artboards

It would be nice for the ability to link 2 artboards without needing a layer. Frequently, I need to show the flow between 2 screens over a period of time, without a click action.

Flow Lines Point to Wrong Artboard

When I try to create a link from a symbol to a new artboard, the arrow is pointing to the wrong artboard, not the one I selected. I have already made many links in this document but now it stopped working correctly. Can an artboard go corrupt to cause this?

Shortcut for Define Links (Create Link?) not working / present.

In both 2.0 and 2.0.1 I don't have the cmd shift k shortcut appear in the menu, and there's no plugins with conflicting key combinations (unless there's something really hidden).

It gets rather tedious having to add things via menu.

Plugin broken in v3.4.4

I too have discovered User Flow is broken with the v3.4.4 update to sketch. I LOVE this plugin! It saves me hours, and I DEPEND on it.
On "Generate", app creates a tiny/empty artboard on the current page. It ignores commands to create a new page, or load into another page.

How to set which side of the hit target the line will draw from

Right now every time I create a connection, the line is drawn from the right of the touch box. I looked around and can't find a way to set which side it is drawn from.

thanks!

flows 2 doesn´t work on OS Sierra

# Description

Flows 2 doesn´t generate the flow diagrams when I try to do it. It simply does´nt do nothing on sketch Version 41.2 (35397). Even after I quit sketch, instal it and restart the computer.