Newsletters > Issue #12: ⚛️ Painting with Code and Sketch for Developers

⚛️ Painting with Code and Sketch for Developers

Design, Prototyping and Inspiration

Welcome to Issue #12: Painting with Code and Sketch for Developers!

The 3 sections this issue:

  1. 3 on Airbnb’s React 💎
  2. 3 prototyping updates
  3. 3 top reads from the publication

🔗 We’ll finish off with a list of more great links from the week gone by.

⚛️ 3 on Airbnb’s React

This week Airbnb released React-sketchapp 🙌 here’s what you need to know:

1. Painting with Code: Introducing our new open source library React

Jon Gold introduces Airbnb’s amazing React-sketchapp – an open-source library that allows you to write React components that render to Sketch documents! 💎

Read Now

2. I tried Airbnb’s React-sketchapp

Sten Hougaard tried out Airbnb’s React, and lets us know about his experience with it.

Read Now

3. The design approach of Airbnb’s Jon Gold

Jon Gold made Airbnb’s React-sketchapp, so Carmel DeAmicis finds out the 5 books that he likes.

Read Now

🛠 3 Prototyping Updates

Here’s 3 new bits in prototyping this week:

1. Designing the all-new Framer

Framer show us the reasons and process behind the redesign of their interface, with the aim being to promote a more symbiotic flow between code and canvas.

Read Now

2. Avoiding blockers: Sketch for developers

MojoTech cover the basics of “Sketch for developers”, with an aim to improve collaboration between dev and design.

Read Now

3. Gravit Designer Tips & Tricks

Gravit Designer looks like a decent tool – their head of design, Pablo Petzen, runs us through some tips and tricks in Gravit.

Read Now

💥 3 Top Reads

3 more great reads from the Prototypr publication:

1. Gmail: An Unsolicited Redesign

Alden Tan takes us through his awesome (unsolicited) 3 week design project, which he is still open to iterating further on.

Read Now

2. Why Every Project Should be a Design Systems Project

Morgan Gore tells us of the importance of design systems when designing for growth, ambiguity and uncertainty.

Read Now

3. The Surefire Way to NOT Hire Good Designers

Christian Vasile explains why interviewing in the design industry must change, highlighting the root of bad approaches.

Read Now

🔥 More Links this Week

More great articles that are well worth your time 👌:

CSS in JavaScript: The future of component-based styling

Designer & developer | Writes about all things to do with building products | 25Image by @jonathanzwhiteBy adopting inline styles, we can get all of the programmatic affordances of JavaScript. This gives us the benefits of something like a CSS pre-processor (variables, mixins, and functions). It also solves a lot of the problems that CSS has, such as global namespacing and styling conflicts.For a deep dive into the problems that CSS in JavaScript solves, …

Read Now

Redesign Checkout Process of Lazada Mobile App

Lazada is the biggest E-commerce platform in Southeast Asia, has operation in 6 countries: Indonesia, Thailand, Singapore, Malaysia, Philippines and Vietnam. Its checkout process is complicated and also because of fast pace development, the design is not consistent and still has a lot of usability issue. Working at Lazada, I spend most of time day in and out design new features. However I really like to have my own time did some exercise to see if I can have a look back at the design and …

Read Now

Data Intrusiveness vs. Getting Consent

Last night, on an otherwise normal Thursday evening, I met up with a friend to attend a launch party for an app, and then afterward we wandered off to a nearby bar for a drink. The bar was a place my friend knew of; it had been an old favorite of his, and because we walked over there together, there was no need for me to pull out my phone and search for the address or anything like that. In fact, if you’d asked me first thing this morning, I probably couldn’t have even told …

Read Now

Mobile UIs are Turning Upside Down There is an emerging trend in mobile UI design: important interfa…

It is very obvious when you look at how Apple Maps changed in iOS 10:Apple Maps before/after iOS 10There’s a simple explanation for this: our phones are getting bigger, but our hands don’t.Scott Hurf’s Thumb Zone heat map of sorts shows how easy it is for our thumbs to tap areas on a phone’s screen.On the first iPhone you could somehow reach the back button in top left corner of your screen with your thumb, but on the plus size iPhones it’s …

Read Now

Stop talking, start listening

Conversational design at Google. Formerly iA. My website talks to you.Apr 25Image credit: Vanessa Brantley NewtonGood designers are good listeners. They start by understanding, not solving.I recently found myself in a meeting with a designer who just started working on a design problem I had spent the last three months working on. I wanted to share some of the insights I gained, but I didn’t get the chance.I’ve spent months working on this I thought, and this guy comes …

Read Now

The Struggles of Innovators in Old-School Businesses

Work is work and will always be. Some people love it, some just roll with it. Like a service, the impressions we have about our jobs is based on how well the company culture, relationships, and work environment contribute to achieving our goals. As design professionals, we know that not every company praises the value provided by design-oriented approaches. Production-oriented companies are focused on efficiency over quality. This approach can limit opportunities for change, frustrating …
Read Now

Techniques to Display Text over Background Images

Designer, App Developer & Self-taught Artist.’s become popular to overlay text labels on background images. But the image could be anything. How does your user interface design accommodate that? Can text overlay remain readable always?The last thing you’d want is your users straining to read such text. This is all the more important on mobile. Smaller screens and smaller text make it slightly harder to read.But don’t worry. There are …

Read Now

Button, button, who’s got the button
Read Now

The Many Tools for Shape Morphing

shape morphing, SVG To no one's surprise, I'm sure, there are lots of different ways to do the same thing on the web. Shape morphing, being a thing on the web, is no different. There are some native technologies, some libraries that leverage those, and some libraries that do things all on their own. Let's look at some of the options (with demos) and …

Read Now

New file format in Sketch 43 and what we learned about it

Simple and powerful version control Sketch plugin for designers.In late February, Ale wrote that Sketch 43 will support the new file format. Our team took this news in two ways.On one hand we saw great benefits that the new file format can give to Plant. On the other hand, this has raised a big question for us: “Is it worth sending forces to implement the support of a new file format or leave it as it is?”.We understood that Plant is in a state of private beta testing, that …

Read Now

Run Smoother Projects With Sketch And Version Control

This is a write-up of a talk I gave at UX Camp Berlin last year. I run the Experience Design practice at tools are fundamentally changing. One could argue that technology is eating the design world to paraphrase Marc Andreessen who famously said “Software is eating the world”.A designer who saw my talk at UX Camp Berlin 2016 sketched this little talk summary.Design tools are becoming “tech savvy”. With savviness I want to circumscribe …

Read Now

👋 Thanks for reading

For more regular updates, follow us on Twitter and Facebook. Share with your friends, by hitting forwards. And respond to this email if you want to get in touch.




Coming to you with <3 from Gibraltar.