Be nice. Or else.
Indianapolis, IN Product Designer Joined 12 months ago
That's my thinking too, Chris. It's a really amazing tool they've created. I pretty sure Facebook and Twitter have developed internal tools for Sketch↔︎Code synchronization. With Sketch 43, I imagine we'll be seeing a bunch of new tools come out.
Really inspiring work, Jon! Design-code parity has been a long time coming, and it's awesome that Airbnb's team of Design Technologists has decided to tackle it.
One big question: At this point, who owns [initial] design? Seems to me there are two potential workflows:
There are, of course, lots of talented developers who have a penchant for design. I think they could do great work just designing in code.
But a lot of developers don't. I get that creeping fear that we're going to come full circle where developers are driving design like they were in the late 90s and early 2000s.
Don't let this detract from what you've created! It's truly brilliant. Just curious how you see the design process now.
Craft Library has never been reliable for us, so we've avoided using it. Just a personal preference!
I have personally used this system on multiple real mobile client projects, and have created dozens of new atomic elements for myself on each project, so this system definitely isn't all-inclusive. It can, however, give you a huge jump start.
I don't expect users to use all of the components in the file, and that's okay! But if they're going to be constructing (the key word) a lot of these components in a similar way anyway, why not get a head start? Text boxes, however they look, are always text + rectangle. I do that the same way every time, so this just gives me a head start and I can customize it as needed.
One more chef metaphor before I shut up: UXPT is a designer's mise en place https://en.m.wikipedia.org/wiki/Mise_en_place :)
Great discussion, Maarten!
Hey Maarten, appreciate your comment. But UXPT is exactly what you described. It's intentionally a vanilla system for the sole purpose of being customized by the designer. Of course there are nicer looking ones out there. We agree with you! But nothing is built the way UXPT is constructed.
That's why we call it Bootstrap for designers. Devs aren't supposed to use Bootstrap out of the box. It's meant to serve as a base to "optimize [the development] workflow with one or more tools for creating [front end UI]".
UX Power Tools is built like a Sass library with "variables" like text styles and layer styles, and the components are compositions of these variables. Starting a project with this system optimizes your workflow by 5-10x.
Chefs don't chop onions and trim beef in front of the camera on cooking shows. That's not worth their time. But that doesn't constrain their cooking to just one dish. They can make thousands of dishes by utilizing the same basic ingredients as a base and preparing them differently. UXPT plays by the same rules.
Thanks for your comments, and I don't mean to sound so defensive. You just seemed to describe exactly what we've created, and more importantly, why we created it :) This is an atomic design system in the most raw sense, and we've left creating molecules up to the designer. Once you eclipse the atomic level, then the system starts to feel very constrained. And we don't want to be in the business of telling designers how their designs should look. We care more about how they've prepped their file to build more efficient and sustainable designs.
Trying to keep an eye out! :)
Auto Layout :)
That's a horizontal stack, pinned to the left and right. Pins will anchor the stack (or group) to the parent, which in this case, is the artboard itself. The bottom is pinned just because it was being used as a bottom nav. That keeps it anchored to the bottom when you resize the artboard vertically.
Let me know if you have any more questions as to how the system is built!
This is outstanding. I'm really looking forward to this growing. I'm ALWAYS trying to recall examples "in the wild" to help clients understand a design pattern, and this will make my life so much easier.
Thanks so much, Trevor! That's nice of you to share, and I'm thrilled to hear that you're finding it useful.
Hey Olivier! Thanks so much for the kind words :)
To be honest, I don't really know why people don't share numbers. I've always found it strange (because who really cares?). I think for some businesses there's actually a strategic reason why they don't, but in this case, I'm more just following social norms.
To be a little more transparent, our weekly revenue since launch has been in the thousands of dollars.