I used to work at Kiwi.com when Orbit was started. It grew into such an impressive framework! It’s been advertised as “components for your travel site” for a long while but it’s totally appropriate for any kind of site.
I, too, used to work at Kiwi.com when Orbit was started. If there was one thing which was consistent, it was definitely Orbit. It's nice to see they're keep pushing it forward.
I've been doing a lot of research into design systems and one thing that's lacking in most of these documentation sites is examples build with the component library. It's hard for me to get a feel for it without being able to click through a real application.
Also, paid managed services on the backend are super common. I want a paid frontend component library. There are very few of these and I think there's room for an all star frontend team to sell professionally maintained, always improving components. Even on day 1 of my company I'd be willing to pay $100s a month for this
I've been a subscriber to TailwindUI since it launched. Unfortunately it's not well suited for complex B2B SaaS products that have high information density UIs
> one thing that's lacking in most of these documentation sites is examples build with the component library
Check out their main site kiwi.com for examples.
This is part of a trend with enterprise design teams of open-sourcing their design systems. In some cases, there are direct benefits to clients and partners. Otherwise, it's a status project / time-filler.
The title ("Orbit – open-source design system documentation") is a bit confusing to me (I'm a technical writer so anything with "documentation" catches my eye). It seems like the provided link is just the documentation for a collection of open source web components? Or is the documentation itself open source? I'm not trying to be pedantic here, just asking in case I'm missing something. In other words it seems like the word "documentation" isn't necessary in the title in this case.
Yep, sorry, it's probably a bit confusing. The whole design system is open-source, from its components to also the documentation. You can find it on the GitHub repository: https://github.com/kiwicom/orbit/tree/master/docs
But basically it's a system how to design and develop applications (mostly mobile or frontend). It contains most of the time some visual foundation, standardized components, guidelines etc.
I think the point that parent was making is that it isn't at all clear what orbit is about. A "design system" is such an extremely vague term. Houses? Cupboards?
“Design system” is pretty well defined in every field. And defined differently, which is the problem. I assure you engineering design is not the same thing. “UX design system” would have been better at least.
It's clear it's a [D]esign system for [D]esigners when you go to the site and see things like Colors, Typography, Spacing, Tone, etc.
It's fine if things are targeted! I don't expect all my technical documentation to fully namespace all their ambiguous terms in case a non-engineer shows up. This site is for [D]esigners and that's cool.
The problem is it's not clear about what the design system is for. After some digging I figured out it's for React. It shouldn't take that much time and effort just to figure out what it's even for. Why not just say 'open-source design system for React'? Why is it all so vague? Plus on the top of the page it says 'Open source design system for your next travel project.' What does that mean? I assumed it had something to do with traveling.
The problem I have with all these self-promotion frameworks (i.e. CSS frameworks open sourced by commercial entities) is that they are inherently at the mercy of said companies.
Take Zurb Foundation for example, as far as I can tell its basically become abandonware. Foundation 7 has been promised forever and yet we're still stuck with Foundation 6 which has all sorts of bugs and gotcha's that will catch people out because the framework is out-of-date in comparison with the technology that people are using to access websites.
The only exception to this is Twitter Bootstrap which has been consistently kept up to date. Whilst I don't agree with some of the design decisions in the latest Bootstrap 4, it remains a solid, well maintained framework.
I think Material UI is going pretty strong, too? They've just released a beta of version 5.
I think overall the comes-from-corporate-entity frameworks are probably still a better bet than the one-persons-pet-project ones - there are loads of those, too.
Material UI isn't coming from a corporation in the same way as the others though. Material UI is an open source implementation of Google's Material Design system, but it's not in use by Google AFAIK.
I was also confused about this. It appears this library includes components specifically geared for travel-oriented applications. Still seems like most of the components are pretty generic, but here are some examples that stood out to me:
> By default, our libraries use Circular Pro, which isn’t an open font.
That's a big red flag for an open-source design system.
Design-wise, the Figma files look nice but are poorly built. Most of the text and colors don't use styles, and the few color styles they use are in a private library.
There's some documentation (good) but the components make a lot of mistakes. You're better off starting from scratch.
43 comments
[ 3.1 ms ] story [ 85.6 ms ] threadAlso, paid managed services on the backend are super common. I want a paid frontend component library. There are very few of these and I think there's room for an all star frontend team to sell professionally maintained, always improving components. Even on day 1 of my company I'd be willing to pay $100s a month for this
For more general use I guess it’s hard to compete with the likes of Material UI.
Check out their main site kiwi.com for examples.
This is part of a trend with enterprise design teams of open-sourcing their design systems. In some cases, there are direct benefits to clients and partners. Otherwise, it's a status project / time-filler.
But basically it's a system how to design and develop applications (mostly mobile or frontend). It contains most of the time some visual foundation, standardized components, guidelines etc.
It's fine if things are targeted! I don't expect all my technical documentation to fully namespace all their ambiguous terms in case a non-engineer shows up. This site is for [D]esigners and that's cool.
(open-source) ((design system) documentation)
(open-source design) (system documentation)
(open-source (design system)) (documentation)
These nouns connect arbitrarily like molecules in a liquid, forming one completely opaque (and barely palatable) whole.
Take Zurb Foundation for example, as far as I can tell its basically become abandonware. Foundation 7 has been promised forever and yet we're still stuck with Foundation 6 which has all sorts of bugs and gotcha's that will catch people out because the framework is out-of-date in comparison with the technology that people are using to access websites.
The only exception to this is Twitter Bootstrap which has been consistently kept up to date. Whilst I don't agree with some of the design decisions in the latest Bootstrap 4, it remains a solid, well maintained framework.
I think overall the comes-from-corporate-entity frameworks are probably still a better bet than the one-persons-pet-project ones - there are loads of those, too.
- Seat: https://beta.orbit.kiwi/components/visuals/seat/
- Stopover arrow: https://beta.orbit.kiwi/components/visuals/stopoverarrow/
That's a big red flag for an open-source design system.
Design-wise, the Figma files look nice but are poorly built. Most of the text and colors don't use styles, and the few color styles they use are in a private library.
There's some documentation (good) but the components make a lot of mistakes. You're better off starting from scratch.
The base tier is free.