iOS 11 iPhone GUI

Origami, Sketch, and Photoshop templates of GUI elements found in the public release of iOS 11.

Updated December 12, 2017 · Disclaimer

Design better, faster

Today, there are many user interface kits available for designers to speed up their work. However, few if any incorporate motion. This year, we’ve created Origami components that mirror the behavior of the most important UI elements in iOS 11 as well as recreating elements found in the public release of iOS 11 in Sketch and Photoshop.

Whether using these files to mock up apps, concept ideas, or create custom interface elements that work harmoniously with those native to iOS, we hope they help you work faster and elevate your designs.

New to designing apps? You may want to get acquainted with some of the support documentation that Apple has put together in their Human Interface Guidelines and their Apple UI Design Resources.

Made for Motion

The most important addition to this year’s release is our adding and extending our Origami components to make it easy for designers to quickly prototype native-feeling iOS 11 interactions. These include navigation bar, notifications, action sheets, alerts, keyboards, and more.

What’s inside?

Whether you work in Origami, Sketch, or Photoshop, we created a file to use with each tool. We’ve focused on balancing ease-of-use with accuracy — while some aspects aren’t 100%, they are built to easily assemble screens and flows.

The components attempt to cover as many of the common UI elements within the OS as possible, including renderings of the phones themselves. Below that are operating system level screens that are common outside of individual app experiences. And at the bottom of the page are flows through common apps for reference and use. In Sketch, we’ve worked in 1x and in Photoshop at 2x and where possible we’ve tried to make components scale across device widths.

In addition to the commonly used UI elements, Facebook iOS 11 contains a ton of elements found throughout the latest iOS release.

If something is off with these files, we want to fix it. Shoot us a message at [email protected].

A special thanks to Andrew Aquino, Scott Horsfall, Jaleh Afshar, Hyacinthe Briand, Trevor Phillippi, Ryan Fariña, Lois Yang, Jason Cashdollar, Jeanette Mercado, Yih Liang, Mason Lee, Joseph Albanese, Timothy Achumba, Charlie Deets, Jeremy Friedland, Kathleen Warner, Ari Sawyers, Chase Bratton, Chelsea Wells, Peter Zich, Kian Lavi, Bobby Dolan, Robert Cooper, Robert Wood, and Jeff Smith.

Andrew AquinoAndrew AquinoScott HorsfallScott HorsfallJaleh AfsharJaleh AfsharHyacinthe BriandHyacinthe BriandTrevor PhillippiTrevor PhillippiRyan FariñaRyan FariñaLois YangLois YangJason CashdollarJason CashdollarJeanette MercadoJeanette MercadoYih LiangYih LiangMason LeeMason LeeJoseph AlbaneseJoseph AlbaneseTimothy AchumbaTimothy AchumbaCharlie DeetsCharlie DeetsJeremy FriedlandJeremy FriedlandKathleen WarnerKathleen WarnerAri SawyersAri SawyersChase BrattonChase BrattonChelsea WellsChelsea WellsPeter ZichPeter ZichKian LaviKian LaviBobby DolanBobby DolanRobert CooperRobert CooperRobert WoodRobert WoodJeff SmithJeff Smith