Connect
To Top

Prototype within Sketch with Silver

In an article I wrote earlier this year called ‘Best New Digital Design Tools You’ve Never Heard Of‘ I took a look some new apps that are bringing about some interesting changes in the digital design application space. One of the more interesting developments in this space happened at Adobe MAX last year when Adobe showed off their new application called Project Comet that allowed you to be able to do design and prototyping work all in the same application. I have been lucky enough to work with Project Comet for a few months now and being able to design and prototype in the same application is a real game changer. This was a real workflow innovation but Project Comet currently isn’t available to the public yet so other companies have been scrambling to bring similar functionality to other apps.

The newest entrant to this space has been a plug-in for Sketch called Silver that brings some really interesting functionality into the app by letting you create lightweight mobile prototypes from inside of Sketch.

Silver works as a plug-in for Sketch which continues to be something that I think was a brilliant decision. Some of the most interesting core functionality of Silver is:

Link Layers to Artboards

Linking layers to artboards let you design Flows by converting Layers into tappable/swipeable Links that trigger transitions to other Artboards. Those transitions are then done as native transitions so you can navigate between Artboards using native Push, Pop, Modal and Dismiss transitions. Also modals can display Artboards which can be dismissed interactively.

Headers and Footers

You can convert Layers into fixed headers and footers with just a keyboard shortcut which makes it incredibly easy to see how a design will look and work without having to have one full height artboard and another device height artboard. This functionality also has support for transparent layers to create floating action buttons which may sound like a small thing but goes a long way when you are trying to create more visually complex interfaces.

Editable Input Fields

You can setup Text Layers to automagically transform into live input fields during preview so prototypes feel much more real. you can also configure different keyboard types and define behavior for the return key.

Embed Web Views

When you are designing an app showing a mobile web site is never the ideal experience but there are some times you just can’t get around it for a lot of reasons. Silver lets you add these web views to your prototype by making a simple Shape Layer show content from a website. Resize and position the Layer in Sketch to configure the appearance of the web content in the preview app.

Core OS Functionality

The one piece of functionality that really blew my mind was that you can make prototypes feel real by letting users access the Camera, browse Photos, compose emails and SMS, make a phone call, or launch an external website. This makes your app feel REAL when yo are using it since the integration into the hardware is so seamless.

Live Mirroring

Like all prototyping apps you can test the experience on an iOS device and all native components generated by Silver are updated in real time on the Silver Preview App for iOS. You can pair the iOS and Mac Apps over WiFi or via USB to get around this frustrating corporate WiFi networks.

This is the part when I would desperately love to tell you that you can go download this plug-in right now and start using it but the problem is that it is private beta with no word on a release date. I also found Silver about two months ago and have I tried my best to also get my hands on it so I would be able to give first-hand experiences since I hate writing pieces like this without have been able to actually use the software. But in the end I thought this looked so promising that I wanted to share it to try to get more people aware of their work and get them some more support for its launch. You can find out a little more about Silver here and keep on eye my blog or my Twitter feed as I will definitely announce when it goes live and will share my review as my teams and I start to put it through its paces.


READ MORE

Best New Digital Design Tools You’ve Never Heard Of

You must be logged in to post a comment Login

More in Design & user experience

Creative Director, Designer, Brand Builder, Speaker, Podcaster, Crazy One. As a designer, I have 20+ years experience creating the strategy, concepts, and designs for award-winning integrated global advertising campaigns, building multiple global Fortune 500 brands and creating innovative digital experiences. As a leader, I have 15+ years transforming agency and client-side teams using a mix of creativity, business strategy, process and political skill to create innovative, world-class work and cultures that change industries and companies. My clients have included American Airlines, W Hotels, Disney, Citi, ExxonMobil, Acura, Old Navy, Nationwide Insurance, Verizon, Subaru and many others. My work has received over 150 international awards, my app designs have been named as one of the World’s 100 Greatest Apps, Apple has featured my work in 9 keynotes, 4 TV commercials and more.

Follow Me On Instagram

 Nice collaboration between @joeiurato and @rubin415 at @wellingcourtmuralproject #wellingtoncourtmurals #wellingtoncourtmuralproject #streetartnyc #streetartofficial #streetartist #streetart  Kraken mural from @beaustanton at @thebushwickcollective #streetartnyc #streetartofficial #streetartist #streetart #thebushwickcollective #bushwickstreetart #bushwickcollective  You can't miss the color and patterns of @davidjunelouf #bushwickcollective #bushwickstreetart #streetartnyc #streetartofficial #streetartist #streetart  I need to start collecting @findac because I LOVE his work every time I see it. #bushwickstreetart #streetartist #streetartofficial #streetartnyc #streetart #findac #bushwickstreetart #bushwickcollective  One more flashback to the @dface_official egg original hiding spot in the Lower East Side #dface #bigegghunt #bigegghuntny #streetart #streetartist #streetartofficial #streetartnyc
 Love this piece from Kaffeine at @thebushwickcollective #streetartnyc #streetartofficial #streetartist #streetart #thebushwickcollective #bushwickstreetart #bushwickcollective  Colorful piece from @joeiurato #streetartnyc #streetartofficial #streetartist #streetart #bushwickstreetart #bushwickcollective #thebushwickcollective #joeiurato  Also loved the work I found from @li_hill #streetart #streetartist #streetartofficial #streetartnyc #bushwickstreetart #bushwickcollective  Spent the morning @thebushwickcollective seeing what was new and good. The massive @dface_official was an easy place to start. #dface #streerart #streetartist #streetartnyc #bushwickstreetart #bushwickcollective  Flashback to the @dface_official #bigegghunt egg on display at Rockefeller Center in NYC. #dface #bigegghuntny #streetart #streetartist #streetartofficial #streetartnyc #easter #easteregg
 One more part of the Kraken mural from @beaustanton at @thebushwickcollective #streetartnyc #streetartofficial #streetartist #streetart #thebushwickcollective #bushwickstreetart #bushwickcollective  Also went to Queens today to check out the @wellingcourtmuralproject which is small but has some great work from artists like @eelcovirus #streetart #streetartist #streetartofficial #streetartnyc #wellingtoncourtmuralproject #wellingtoncourtmurals  One of my two favorite new artists I saw today was @owendippie with his 'Radiant Madonna' with the Virgin Mary holding holding a Keith Haring child suggesting Hering is god. #bushwickcollective #streetartnyc #streetartofficial #streetartist #streetart #owendippie #owendippieart  Thanks to @invaderwashere for the postcard set from his show at @museeenherbe - I think this was literally the only thing I didn't have from the show. #invader #invaderwalls #spaceinvader #spaceinvaderparis #streerart #streetartist #streetartofficial  Happy Easter with our @dface_official egg from the NYC #bigegghunt - it's always great to see all the posts and love this piece gets today. #dface #streetart #streetartist #streetartofficial #streetartnyc #easter #easteregg #bigegghuntnyc #bigegghuntny

Follow me on Twitter

Copyright © 2015 Stephen Gates