With the upcoming sunsetting of Invision (R.I.P.), my agency has run into a pickle with how best to present designs and web pages for our clients.
In a perfect world we could provide our clients with a link to the design’s Sketch Cloud page where they can review the entire flow, try the prototypes and provide comments there. Unfortunately, this sort of freedom is too overwhelming for many of our B2B/C ecommerce clients. The moment they see a massive canvas of (organized!) artboards and pages they lose track of everything. While there are often one or two tech-savvy members of a stakeholder group, most are accountants/sales managers who aren’t accustomed to the design/tech industry.
While Invision built itself on prototyping (and later dev handoff) tools, what we found them to be most useful for was providing a simple way to present stakeholders a clear way to progress through a design flow and provide annotated comments within it. Sure this generally-static ‘.PDF viewer’ seems pretty basic for such powerful tools, but for a middle-aged, non-techy accountant who will be signing off on a massive budget this was the best way to provide a realistic preview of things. While we could just provide this type of presentation within an actual .PDF, setting it within a browser creates a more realistic display for the client.
I know the Sketch team is placing a lot of emphasis on the designer-to-dev handoff tools and prototyping, but the ability to create a super simple ‘slideshow’ of a desired selection of artboards with a dedicated link for it would be an absolute godsend to agencies. This way stakeholders don’t have to navigate a full canvas of artboards and, hopefully, will be able to provide comments without the need of logging in (wishful thinking!).
Thanks for reading all this and I’m excited to see what 2024 brings to the software!
It’s very easy and fast to create simple presentations in Sketch! There’s an option, Auto link to right artboard, that makes this possible!
You can also add more details to your slideshow, like Auto link to the previous artboard, a global menu or anything else you need, then save that file as a template for reuse. You can also add prototype links to symbols and reuse them to create presentations in a more efficient way.
Once you’ve auto linked your artboards, set the first one as a starting point and save it to your Workspace. Each artboard that you set as a starting point creates a new prototype in the Web app, and each prototype has a unique link that you can share with stakeholders.
If you have any other specific requests that might enhance a little bit the transition process from InVision to Workspaces, let us know and we’ll be happy to share those comments with our team!
Thanks for reaching out! The only three things I can think of that we easily have access to within Invision would be:
The most important function would be providing an easy way for viewers to add annotated comments within individual prototype pages/slides/steps. This is obviously something that logistically could be tricky due to how the prototyping functionality is developed within the software, but even a general comment section option within the prototype as a whole would be fantastic. Our current comment sections within Invision are generally a split between asking the designer a question about a specific element on a page or the clients communicating amongst themselves within a specific comment block (like @ClientA asking @ClientB if they have the sort of data for a product listing). Again, these aren’t usually the most tech-aware individuals so requiring them to exit a prototype to find a separate comment section is too many steps.
Easily controlling when pages are synced to the prototype. Many times we like to provide clients a process flow link so they can review things post-meetings. This way they can get their thoughts together for what was sent in their own time. By having everything connected to the active artboards, I worry updates we implement can be seen by the clients before we’ve had time to schedule a follow-up meeting and discuss them. The workaround is obviously to create a separate page within the file and duplicate all the artboards there, but if you have 100+ artboards you’re now separately maintaining (and ensuring you don’t miss changes on), it simply adds to the designer’s workflow. Having a checkbox on the ‘Prototype Start Point’ artboard that allowed you to turn off auto-sync would be a lifesaver.
Finally, and this is least important, but having a way to send individual artboard preview links would be great. I know this sounds silly, but we’ve had clients who want the full presentation of pages along with individual links for each page within the presentation. I know the workaround would be to set everything as the ‘Prototype Start Point’ and then remove any interactions within them, but then you have to deal with the quirks that brings if they’re part of another, previously-established prototype flow.
Like I said, these are probably the three biggest features we relied upon within Invision when presenting to clients and leaving them to their own devices to provide comments. Invision’s prototyping/dev hand-off tools definitely became dated compared to built-in software functionality, but their use as a simple, intuitive middle-ground for clients to offer input within is invaluable. I’m friends with some previous Sketch staff so I know you guys are always busy with new feature developments, but I want to thank you for taking the time out of your day to hear my input!
Thank you so much for sharing those with us! We truly think these are really valid and great suggestions and we’ll make sure to forward them to the team.
However…
Easily controlling when pages are synced to the prototype.
You can do this by:
Create your Prototype on the Mac app, and save a new version using ⌘S (Command-S) to the web app.
Wait for it to render and make sure everything looks correct.
Now, save a new version of the Document to the web app.
After this one processes and renders, you can use the Versions tab to collect a unique URL for the previous version (where you checked everything is fine) and share this unique Prototype URL with your customer.
This enables you to share a specific version of the Prototype, without having to worry about newer updates to Artboards within the Prototype affecting it!
Individual artboard preview links
This is also possible. Using the web app:
Open your Document
Wait for the Web Canvas to load
Double-click on any Artboard you’d like to share the specific preview of.
Copy the URL when the Artboard view is loaded within the Browser.
Done!
This way, you can share specific Artboards with your clients and collagues, without having to share the full Canvas view with them!
This is great, I didn’t know prototype share urls had versioning.
One issue I’m seing is that the url for the ‘most recent’ prototype is always the same.
ie.
I create a prototype, save and create a version (version A).
I modify the prototype, save and create a new version. (version B).
If i check the share url, they are like this:
version A:
…/s/aa13f105-1e8d-402a-8305-5bb70a7b3b3b/v/M2YJoa/prototype/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01/a/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01 version B: .
./s/aa13f105-1e8d-402a-8305-5bb70a7b3b3b/prototype/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01/a/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01
(I highlighted the version in the url)
Now if i create a new version (version C), the url for version B changes to one with a version number, and version C inherits the url of version B. Like this:
version A:
…/s/aa13f105-1e8d-402a-8305-5bb70a7b3b3b/v/M2YJoa/prototype/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01/a/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01 version B: .
…/s/aa13f105-1e8d-402a-8305-5bb70a7b3b3b/v/QZLGKb/prototype/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01/a/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01 version C: .
./s/aa13f105-1e8d-402a-8305-5bb70a7b3b3b/prototype/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01/a/C03D768B-78C5-4E9C-B1FF-5C647CBFEB01
So it works, but not if the prototype is the latest one.
Maybe I should add this to the issue section of the forum
Thanks for the comments and feedback. We truly appreciate you taking the time to share these bits with us!
Indeed, as you mentioned, that is how it currently works:
The latest version of the Prototype is a basic URL that you can make sure It is the latest version of the Prototype.
If you want to share an older version of the prototype you can browse through the version history and then grab the Prototype URL from there (which should match with what you have on the designs).
You can also experiment with using Starred versions to create specific Prototype URLs as well.
