Ink to Code, a Microsoft Garage Project
Turning drawings into user interfaces
Ink to Code is a UWP app that enables developers to draw wireframe sketches and export them into Visual Studio, expediting the process of prototyping UWP and Android user interfaces.
Without Ink to Code, developers and designers can brainstorm wire frames in a variety of mediums but then need to recreate their ideas by coding from scratch in Visual Studio. With Ink to Code, the magic of artificial intelligence and automation jump starts this process. This not only offers time-saving benefits but also fosters the collaborative and prototyping process key for designers and developers to quickly visualize their ideas and be nimble and iterate on new directions.
Ink to Code supports basic app visual elements including labels, text fields, text paragraphs, images, and buttons. A comprehensive demo below:
Summer 2017, at the Microsoft Garage Team, I served as the Design Lead that executed the head-to-toe interaction and visual design experience for two Universal Windows Apps that used the Windows ink and pen technology in the space of prototyping and education. I studied the intricacies of gesture designs and took a multimodal approach to understand the context switch from a mouse to a pen. In 12 weeks, I collaborated with software engineers, PM, and data scientist on the development, execution and shipment of these two products. One of these products, Ink to Code has officially shipped on Feb 25th, 2018!! :)
-
Microsoft’s ‘Ink to Code’ builds an app UI from your sketches – Engadget
-
Microsoft Interns Built an App that turns napkin sketches into UI – Fast Company Design
-
Windows 10’s new app: Microsoft’s Ink to Code turns sketches into working code – ZDNet
-
Want a simpler way to build apps? Microsoft’s Ink to Code turns crude sketches into a working UI – TechRepublic
-
Microsoft’s Ink to Code aims to speed up the app development process – SD Times
-
Microsoft Garage Ink to Code turns doodles into prototypes – SlashGear
-
Prototype Windows 10 app eliminates the napkin by turning sketches into code – Kevin Parris/Digital Trends
-
Microsoft’s “Ink to Code” turns drawings into user interfaces – Peter Bright/ARS Technica
-
Microsoft Garage's 'Ink to Code' helps turn your app sketches into quick prototypes – Dan T Lancaster/Windows Central
-
Microsoft’s New App Turns Your Basic Sketches Into Code – Mehedi Hassan/Thurrot.com
-
Turn your drawings into software with Microsoft Garage’s Ink to Code – Laurent Giert/OnMSFT
-
Microsoft Garage’s Latest Project can Convert Your Wire Frame Sketches into Real Code for Visual Studio – Pradeep/MSPoweruser
What is Ink to Code?
In keeping with the NDA, I'm unable to share the project design process online. If you are interested in learning more, shoot me an email and let's chat!
