Finally after much hard work the last couple of months we are very proud to announce the release of the brand new Sketch2React 2020 😺 🙌 That also marks the release of our own marketplace, something that we have only dreamt about in the past. Owning the whole chain of software 👉 customer gives us room to grow, try things, experiment and most importantly, have one channel for delivery of all our apps, templates and other goodies.

New in Sketch2React 2020 🎁

This is the way…

In this tutorial you will learn:

  • What Style Dictionary is
  • How to structure things in Sketch or Figma for it to work its magic of translation via Stratos Tokens and out to iOS, Android and SCSS
  • How to install Style Dictionary into your Stratos Tokens project folder
  • How to run and update your design tokens

If you’re just sitting there with a big❓read this article first 👇

Tutorial requirements

Remember when version tracking was perplexing to us designers? Then came Abstract, Plant, and other great apps & services that solved that issue in a way that mere normal humans without engineering degrees would actually understand how it worked. Hang on to this reasoning.

Understanding how design tokens work, how you can create them and how they will transform and impact your teams workflow is the next big thing as we in Team Sketch2React see it.

Today we’re very proud to launch the brand new, totally reworked Stratos Tokens 2021 to the world. After more than one year in development…

I hadn’t actually planned to make a part two of my tutorial on how to go from Sketch, via Sketch2React to Xcode.

Then I got this really neat tip from our friendly Slack community short after publishing it:

Thanks Fransesco. I'm totally obsessed with doing things smarter, I think that's why I never stop thinking about new ways, new shortcuts to do more with the tools I have at my reach.

What if you could go from Sketch to iOS & Android without writing a single line of code? Actually, you can. 🥳 Just check out the video below first, seeing is believing my friends. 😺👇

From the very start of Sketch2React one question keeps popping up from time to time:

” Can I build apps for Android and iOS with Sketch2React? ”

The answer from us have always been nope or depends on how deep you want to dig friend, anything is possible, of course

Until the other day when I discovered something called Apache Cordova.

Say that you suddenly need to make a loading animation for the app you’re making. Instead of spending hours and hours perfecting it I would do this instead:

  • Browse around a while for inspiration on
  • Find something that works, then download the JSON file
  • Side note 👉 🗒️ Make sure you download the Keyshape Lottie plugin, or you will not be able to import or export animations using the Lottie file format
  • Jump into Keyshape, choose Open and if you’re lucky, the animation looks like the one on the website
  • Use Paste Shape to replace the graphics with your…

Hey guys! In my experience it very often comes downs to really understanding the core concepts about any new software before you even consider start using it. In a world of distractions I can’t really say we’re the easiest one to grasp. 🤣

In the case of Sketch2React understanding how the grid works is essential knowledge. As soon as you create a {container} you are inside the default Bootstrap grid that we have built-in.

ProTip 🤖 💪 You can use any grid system of your liking using our {div} component. …

Hey guys! Before taking some well-deserved vacation we thought it would be nice to do one more update before the end of this very strange and particular year. So, here’s what’s new in Sketch2React 2020.1.5:

  • Dark mode for all those late night Sketch2React sessions☀️🌛
  • Simulators to quickly try out the different breakpoints in your design🤖 💪

If you found your way here, you probably agree with me on this topic. Or not. That’s totally fine, we can agree to disagree.

I often write this kind of article after receiving feedback or questions about what you can do with our framework and code app. So let’s begin!

What is Sketch2React?

Sketch2React is a markup-based design to code framework that lets you design and build real code prototypes and simple websites, straight from inside Sketch app. The exported autogenerated code are web projects for HTML and React. So if you’re a designer that mostly design for the web you’re in luck.

Juan Maguid

Co-founder of Team Sketch2React. Designer that wants to make your maker lives easier😺👍

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store