From an iOS 10 GUI to H2O

Tushar Merwanji
Design + Sketch
Published in
3 min readNov 7, 2016

--

Icon by Sketch App

“Side projects are great because you don’t need to know anything. You get to be a beginner because no one is watching you and there are no expectations”
Tobias van Schneider

As an Experience Designer at SapientNitro, we’re always trying out new tools and techniques to improve our workflow.

In August 2016 I began work on a native mobile project which uses Sketch as its primary software application for outputting not only visual designs but also wireframes.

Sketch

iOS 10 was a few weeks away from being released by Apple. The team I work with had begun to look at the public pre-release through several devices we have in-house.

I wanted to create something I could use in the future but also create something that could be potentially shared with the design community as a whole. In my own time, I began the process of analysing the OS, screenshotting and documenting them individually screen-by-screen.

This helped to create a solid base structure to allow me to deliver a GUI which encompasses the Human Interface Guidelines but also many of the new and revamped apps released by Apple.

Adaptive UI

With version 39 of Sketch, they introduced the ability to assign responsive rules to layers inside a symbol or group. So if you need a table cell element, segmented control or bottom bar for iPad, this GUI supports resizing for the core elements.

Craft by InVision LABS

A week after releasing v1 of the GUI library, I began to put together a Craft Library. The inclusion of this library now allows you to re-use key elements without the need to load up the large GUI file. It’s as easy as drag and drop.

Screens from the 100+ GUI library

Your donations

Although the GUI was a free download, the community have made generous donations. The traction received was phenomenal and I had to add this work onto Gumroad to support the constant flow of visitors.

What started as a project to help others needs to be shared further and from your support and generosity I am very happy to pledge these donations and those in future to UNICEF. I came across this advert by UNICEF UK and felt compelled to share it.

The money donated has been used to purchase a hand water pump and help provide clean, safe drinking water for a community. It will make a real difference to many lives and children in desperate circumstances will get hope for a brighter future.

Coverage and Mentions

The support shown by many has been incredibly humbling and I am immensely gracious that you’ve shared this project with hundreds if not thousands within our community. Here’s some highlights:

The awesome Meng To shared my work socially and on https://designcode.io/learn
#2 on Product Hunt 🎉

Since iOS 10 was released, I’ve been poking around for a good set of Sketch Templates that I can use when drawing up app designs and putting together mockups.

However, it looks like my search is over with this free resource from Tushar Merwanji which covers almost all of iOS 10’s built in functionality. A good job from Tushar and a nice option if Sketch is your design tool of choice.

SwiftDevelopments- Issue 59 - October 18th 2016

Thank you Sketch, InVision, Sketch App Sources and Sketch Hunt for the appreciation and support shown towards this project.

--

--

Tushar Merwanji
Design + Sketch

Product Design Lead at @Accenture Song - Multimedia Technology and Design Graduate from Brunel Uni.