Looks very clean! Kudos for creating it.
Switching tabs and navigating on the documentation page freezes the site for a couple of ms though. I'm on Manjaro Linux using LibreWolf v135.
Fennec browser on Android here and same, switching between Documentation and Properties tabs in the docs takes half a second. I'm not sure if it's actually a freeze though, maybe a misplaced decimal point in an animation?
Thanks! Slow nav is a thing indeed and will look into it. Currently I’m having some server logic when navigating to scan which mdx files are available and also had a very basic auth causing me to use a server. With going OSS I can actually just switch to a static website export now
Small aside: I’m still looking for a framework/UI library fully designed and developed micro-interactions. Even the best ones tend to have jumps that feel like glitches.
do you have some examples of what you would want to get improved/added? We’re building an additional set of components now that could provide more of the micro interactions
The slider component's label just appears and disappears and looks a bit out of place in dark mode (this was the first thing I noticed on mobile). The switch isn't draggable and doesn't react to presses.
These were a lot less obvious than with some other libraries (including ones claiming to be meticulously designed ...) and I have to extend some props for almost everything that animates in also animating out (almost everybody messes this up and it irritates me a lot, just leave it unanimated if you're not going to finish it ...).
In total I think this is a pretty high quality library. Definitely not bad!
When you have two dots in slider component and quickly move one of those over and past the other one, that second dot also unexpectedly changes position in unpredictable ways.
Looks amazing. I'm currently using Mantine alot and still super happy with it so far, but will keep this in mind. I just wish somebody would finally build something of similar quality for ReactNative. The existing solutions I'm aware of all fall short in comparison.
Beautiful components and that’s a very bold move. Congratulations on your success so far and hope this helps you (and everyone in the ecosystem) achieve even more!
I'm very curious here. I don't see any pricing or call to pay or even donation option on the website. So are they both open source and no longer interested in getting paid?
Hey, I used to sell this library for the past 5 years and happy with the money I made so decided to just make it more accessible for those who can’t afford it (the pricing was also more team focused). We’ll probably ship some additional components under as a plus license but core react and Figma libraries will stay free and open source
> I’m also interested in taking Reshaped further by introducing more complex, opinionated premium components on top of the core library. Not “50 landing page layouts,” but advanced components that require sophisticated CSS and React logic.
I'll be definitely be lining up to get one that has more variety.
Currently I'm trying out the recently released AI Elements [2] for its UI components tailored for AI-related stuff and pretty convenient for prototyping.
I think Catalyst looks more like the core Reshaped library atm but we’re jamming on building the first component pack for more complex form fields and layouts. A few other ideas is indeed chat interfaces as well as layout/navigation patterns
Good point. I’m trying to solve as much as I can with just css but a11y and minor implementation details require js, especially while a lot of newer apis require better browser support for now. Over time I expect those to move to native browser apis and become simpler
For whatever reason, each time I click on a menu item it feels delayed. Not like a "This appears to be loading info" delay, but a "It seems frozen and then something just appears" delay.
Yes, every link takes a feew seconds to load with no visual feedback it doing anything. Maybe work on that or put a loading bar at the top or show something.
> I don't want my products looking anything like other websites.
if your product is a personal page or art/game, sure, understandable. Otherwise for apps it is beneficial to have consistent UI. It was the case for decades on desktops, it is true to a certain degree on mobile phones, and it makes users' lives easier.
I remember fighting this one well over a decade ago when management was telling us engineers that our web, Android and iOS should all look, feel and behave the same; it took some time to convince them that what you need is not consistency across platforms but consistency _within_ platforms.
Nobody on iOS cares what/how your app looks/works on Android, they care that the UX meets the expectations they have of that OS because they're switching between apps on that platform all day every day, people actually moving Android<-->iOS are few and far between, I mean literal decade(s) time-frames that people aren't switching.
I have Windows, Linux with various desktops, iPhone, Android, and of course web browsers, and I think the apps look and behave pretty much the same across all devises. Maybe because almost all apps are web apps in a native shell. UI components it seems was a matter of performance rather then usability and developer experience!? Or it's just scripting madness gone framework insane.
Yes and they behave differently which is what I expect - they are different tools and they should behave consistently on a platform.
They should be tuned for the platform.
I can't use gestures on a PC or Mac but I can on a iPad or Android.
Similarly I can control a PC or mac from a proper keybord and mouse but the usual use for iPad/Android is via a single finger.
Well, your customers do. Having to relearn an entire new set of UI patterns for each site/application is exhausting for regular people. Don't make your users think.
I miss the Windows 98 days where almost all apps used the same generic UI and the visuals drifted into the background like noise and I just saw buttons and checkboxes.
That’s the worst part of webapps is that they have their own look’n’feel. I don’t want your branding and colours. I want the functionality and get out of my way. I want my own colours and fonts.
While I agree to some extent about branding and colours, things were hardly a panacea with a lot of buttons and checkboxes as the infamous "Bulk Rename Utility" showed how things could get out of control (probably nice for the author and those that used it from the start but waay too cluttered for anyone without exp).
First and foremost an UI shouldn't confuse or even worse mislead the user, now button as hammer for everything chaoses of old or branding idiocy of today both are guilty of those crimes.
The art of UI's has progressed, sadly some fresh designers are dogmatic as they are mostly exposed to "beautiful" B2C products rather that internal products and often miss the effectiveness factor of tools.
> things were hardly a panacea with a lot of buttons and checkboxes as the infamous "Bulk Rename Utility" showed how things could get out of control
Layout and usability are independent of widget design. I'll take the widgets shown in the "Bulk Rename Facility" over the any of the flat UI "material" nonsense where it's not clear what is clickable and you cannot by process of elimination explore the UI.
That said, usability definitely has been improved over the years. So no, not everything was better then, but the widgets were.
I've never heard of, or seen the tool, and I'm not particularly steeped in legacy software.
So I immediately got why this could be an example of "out of control UI/UX"... but immediately my eye was drawn to the bolded headings at the top of each section, and then the numbers next to them.
And so pretty much immediately after that it was clear how this worked: select the files I want to rename, checkboxes to select the transformations I want, and press the big Rename button when I'm ready.
Their redesign feels worse. Hiding the details of each transformation feels well intentioned, but it'd get very annoying having to open and close sections: never getting a full picture of the pipeline I'm putting together.
It also hides features I wouldn't expect to exist, like the Js renaming and translation.
I think if we hadn't let UI become implicit marketing and kept it highly HCI-driven we could have had the best of both worlds. But I guess the software industry decided we need new product releases to look different enough to warrant collecting more money, so we're deep down the current path.
Or MacOS from the same period which was even better, or desktop software in general. Even now desktops are a lot more consistent.
People often complain about lack of consistency between Linux desktop apps (e.g. Gtk vs Qt), but the differences are usually compared to the differences between web apps.
I was talking just about the look of it, and not the interactivity. UX's familiarity bar is much higher than than the UI one.
Edit: And even for UX -- I am confident in saying we did not reach max usability yet. Some people (me included) are willing to take the risk of (some) unfamiliarity for potential innovation
This looks like a really solid library and a lot of code for free. Many thanks to Dmitry / the team.
Thank you
Looks very clean! Kudos for creating it. Switching tabs and navigating on the documentation page freezes the site for a couple of ms though. I'm on Manjaro Linux using LibreWolf v135.
Fennec browser on Android here and same, switching between Documentation and Properties tabs in the docs takes half a second. I'm not sure if it's actually a freeze though, maybe a misplaced decimal point in an animation?
Their Next JS server takes around half a second to render static content.
https://i.imgur.com/qFH0ZlK.png
Thanks! Slow nav is a thing indeed and will look into it. Currently I’m having some server logic when navigating to scan which mdx files are available and also had a very basic auth causing me to use a server. With going OSS I can actually just switch to a static website export now
Small aside: I’m still looking for a framework/UI library fully designed and developed micro-interactions. Even the best ones tend to have jumps that feel like glitches.
do you have some examples of what you would want to get improved/added? We’re building an additional set of components now that could provide more of the micro interactions
The slider component's label just appears and disappears and looks a bit out of place in dark mode (this was the first thing I noticed on mobile). The switch isn't draggable and doesn't react to presses.
These were a lot less obvious than with some other libraries (including ones claiming to be meticulously designed ...) and I have to extend some props for almost everything that animates in also animating out (almost everybody messes this up and it irritates me a lot, just leave it unanimated if you're not going to finish it ...).
In total I think this is a pretty high quality library. Definitely not bad!
When you have two dots in slider component and quickly move one of those over and past the other one, that second dot also unexpectedly changes position in unpredictable ways.
This one is fixed in the latest canary, haven't updated the docs yet though
It looks so neat and amazing!
I wish there was a simple way to 'marry' this lib with WordPress... or maybe there is one?
Looks amazing. I'm currently using Mantine alot and still super happy with it so far, but will keep this in mind. I just wish somebody would finally build something of similar quality for ReactNative. The existing solutions I'm aware of all fall short in comparison.
last time I looked mantine had some a11y issues, did anyone had to go through an a11y compliance check with it?
In the README the getting started takes you to the changelog, rather than getting started.
Thanks, created a PR: https://github.com/reshaped-ui/reshaped/pull/426
Beautiful components and that’s a very bold move. Congratulations on your success so far and hope this helps you (and everyone in the ecosystem) achieve even more!
I'm very curious here. I don't see any pricing or call to pay or even donation option on the website. So are they both open source and no longer interested in getting paid?
Hey, I used to sell this library for the past 5 years and happy with the money I made so decided to just make it more accessible for those who can’t afford it (the pricing was also more team focused). We’ll probably ship some additional components under as a plus license but core react and Figma libraries will stay free and open source
At the bottom of the article:
> I’m also interested in taking Reshaped further by introducing more complex, opinionated premium components on top of the core library. Not “50 landing page layouts,” but advanced components that require sophisticated CSS and React logic.
Something like Tailwind Catalyst UI kit [1]?
I'll be definitely be lining up to get one that has more variety.
Currently I'm trying out the recently released AI Elements [2] for its UI components tailored for AI-related stuff and pretty convenient for prototyping.
[1]: https://catalyst.tailwindui.com/docs
[2]: https://ai-sdk.dev/elements/overview
I think Catalyst looks more like the core Reshaped library atm but we’re jamming on building the first component pack for more complex form fields and layouts. A few other ideas is indeed chat interfaces as well as layout/navigation patterns
Really neat! It seems backspace in autocomplete is broken: it does NOOP (OSX Safari & Chrome)
Sorry, going to redeploy the docs today, it’s already fixed in the latest patch
Too much JavaScript, I think using CSS to implement the same UI is better and simpler.
Good point. I’m trying to solve as much as I can with just css but a11y and minor implementation details require js, especially while a lot of newer apis require better browser support for now. Over time I expect those to move to native browser apis and become simpler
For whatever reason, each time I click on a menu item it feels delayed. Not like a "This appears to be loading info" delay, but a "It seems frozen and then something just appears" delay.
Yes, every link takes a feew seconds to load with no visual feedback it doing anything. Maybe work on that or put a loading bar at the top or show something.
Sorry, point taken, going to spend some more time on the website now that the oss prep is over
Interestingly, I am looking for the exact opposite -- I don't want my products looking anything like other websites.
The democratization of skill-learning is splendid, but boy is it hard to find a non cookie-cutter designer these days.
If you know anyone ..
Ofek (at) nestful dot app
> I don't want my products looking anything like other websites.
if your product is a personal page or art/game, sure, understandable. Otherwise for apps it is beneficial to have consistent UI. It was the case for decades on desktops, it is true to a certain degree on mobile phones, and it makes users' lives easier.
I remember fighting this one well over a decade ago when management was telling us engineers that our web, Android and iOS should all look, feel and behave the same; it took some time to convince them that what you need is not consistency across platforms but consistency _within_ platforms.
Nobody on iOS cares what/how your app looks/works on Android, they care that the UX meets the expectations they have of that OS because they're switching between apps on that platform all day every day, people actually moving Android<-->iOS are few and far between, I mean literal decade(s) time-frames that people aren't switching.
You don't have multiple devices? I have an Android phone, an iPad, a PC, a Mac, etc.
I have Windows, Linux with various desktops, iPhone, Android, and of course web browsers, and I think the apps look and behave pretty much the same across all devises. Maybe because almost all apps are web apps in a native shell. UI components it seems was a matter of performance rather then usability and developer experience!? Or it's just scripting madness gone framework insane.
Yes and they behave differently which is what I expect - they are different tools and they should behave consistently on a platform.
They should be tuned for the platform.
I can't use gestures on a PC or Mac but I can on a iPad or Android. Similarly I can control a PC or mac from a proper keybord and mouse but the usual use for iPad/Android is via a single finger.
You don't start from sewing your shirt to dress like a clown, you buy a weirdest cuff links you can find, and that suffices.
Well, I might start from researching multi Kinect coordination to scan myself, but I'm not a sane person. You probably are.
Well, your customers do. Having to relearn an entire new set of UI patterns for each site/application is exhausting for regular people. Don't make your users think.
I miss the Windows 98 days where almost all apps used the same generic UI and the visuals drifted into the background like noise and I just saw buttons and checkboxes.
That’s the worst part of webapps is that they have their own look’n’feel. I don’t want your branding and colours. I want the functionality and get out of my way. I want my own colours and fonts.
While I agree to some extent about branding and colours, things were hardly a panacea with a lot of buttons and checkboxes as the infamous "Bulk Rename Utility" showed how things could get out of control (probably nice for the author and those that used it from the start but waay too cluttered for anyone without exp).
First and foremost an UI shouldn't confuse or even worse mislead the user, now button as hammer for everything chaoses of old or branding idiocy of today both are guilty of those crimes.
The art of UI's has progressed, sadly some fresh designers are dogmatic as they are mostly exposed to "beautiful" B2C products rather that internal products and often miss the effectiveness factor of tools.
https://medium.com/@aneel.kaushikk/bulk-rename-utility-redes...
> things were hardly a panacea with a lot of buttons and checkboxes as the infamous "Bulk Rename Utility" showed how things could get out of control
Layout and usability are independent of widget design. I'll take the widgets shown in the "Bulk Rename Facility" over the any of the flat UI "material" nonsense where it's not clear what is clickable and you cannot by process of elimination explore the UI.
That said, usability definitely has been improved over the years. So no, not everything was better then, but the widgets were.
I've never heard of, or seen the tool, and I'm not particularly steeped in legacy software.
So I immediately got why this could be an example of "out of control UI/UX"... but immediately my eye was drawn to the bolded headings at the top of each section, and then the numbers next to them.
And so pretty much immediately after that it was clear how this worked: select the files I want to rename, checkboxes to select the transformations I want, and press the big Rename button when I'm ready.
Their redesign feels worse. Hiding the details of each transformation feels well intentioned, but it'd get very annoying having to open and close sections: never getting a full picture of the pipeline I'm putting together.
It also hides features I wouldn't expect to exist, like the Js renaming and translation.
I think if we hadn't let UI become implicit marketing and kept it highly HCI-driven we could have had the best of both worlds. But I guess the software industry decided we need new product releases to look different enough to warrant collecting more money, so we're deep down the current path.
Or MacOS from the same period which was even better, or desktop software in general. Even now desktops are a lot more consistent.
People often complain about lack of consistency between Linux desktop apps (e.g. Gtk vs Qt), but the differences are usually compared to the differences between web apps.
I was talking just about the look of it, and not the interactivity. UX's familiarity bar is much higher than than the UI one.
Edit: And even for UX -- I am confident in saying we did not reach max usability yet. Some people (me included) are willing to take the risk of (some) unfamiliarity for potential innovation