7 ms·

Show HN: UI Library Creator

79 points by kemyd 3y ago

Hey HN! The "Generative" trend is booming, and UI Library Creator is our original approach to it. In the last three years, we have added 60+ professional UI libraries to Shuffle's catalog (Shuffle = visual editor for web developers). Still, we know we need more than this to satisfy our growing user base! That's why we created the UI Library Creator. In this tool, you can combine elements and styles to create unique UI libraries that work seamlessly with the Shuffle Editor and all its capabilities (drag-and-drop, customizations, live preview, and more). We provide you with UX solutions (components) written in Tailwind CSS and presets so you can quickly combine them to create what you need. You don't need to talk to a "black box" AI with a chat interface. Possible combinations are in gazillions. We aim for original creations, but you have complete control over the final effect. How to use the UI Library Creator: * Visit: https://shuffle.dev/library-creator https://shuffle.dev/library-creator * We recommend starting by selecting Assets and Copywriting for your target audience. * When these two options are locked, use the "Shuffle Styles" button to bootstrap your project with the first style. * If you like something, lock the category and then repeat shuffling. You can also change options manually, but with "Shuffle Styles," you can quickly see many creations. If you enjoy the final result, click "Publish now" and send your UI Library to Shuffle. Once processed, it will be available for use in your Dashboard. Let us know what you think! Video (2min) with product tour: https://www.youtube.com/watch?v=8ZFlWEDr7XM https://www.youtube.com/watch?v=8ZFlWEDr7XM

satishjain72 3y ago
Super Awesome Team and Update . I am particularly looking forward the Wordpress export feature What is the ETA for that?
deleted 3y ago
[deleted]
deleted 3y ago
[deleted]
luciantartea 3y ago
Congratulations for creating both Shuffle and UI Library Creator. I love how smoothly you implemented the variation previews. It's a great tool. The possibilities are endless
- kemyd 3y ago
  Thank you for your kind words! We are now a team of eight, and I thank you on behalf of them all. :)
yu3zhou4 3y ago
Great execution!
- kemyd 3y ago
  Thanks!
Turing_Machine 3y ago
Typo on login screen: "copywrighted" It may seem minor, but that one (or even worse, "copywritten") sets my teeth on edge, and I'm betting there are more people like me. :-)
- kemyd 3y ago
  Thanks for reporting! I can't find it right now, but if it exists, it will be fixed soon :)
- graypegg 3y ago
  He who copywroght the copy shall face the copywrath.
revskill 3y ago
No free components ? No thanks.
- kemyd 3y ago
  We have discussed the freemium approach, but for now, you need an account to use all options. (However, you can still build a UI Library without an account and see if it's the tool for you)
  - mikercampbell 3y ago
    Hey, your presentation more than makes up for that approach. I’ve already sent it to my team to see if it’s something we’d want to try!
    - kemyd 3y ago
      Great! Appreciate that :)
codetrotter 3y ago
Neat! I bought the lifetime access in 2021. Nice to see you guys are still active and adding new things :)
- kemyd 3y ago
  We are probably the small exception in the SaaS business that keeps adding stuff but does not charge old users for it. ;) Thanks for supporting us in 2021.
tommiegannert 3y ago
Perhaps I'm not your target audience, but I have a hard time understanding what it is that you do. Here are some observations from a first-time visitor. UI Library Creator: I think the left-right carrousel shows different page layouts, showcasing the current style? But they're all very similar to each other. And you're already showing the styles as a thumbnail at the bottom? What's the difference? A static grid with four very different pages would probably work better for me. If I press Shuffle styles, does it only shuffle the current tab, or all styles? I think it might do all, which is very confusing. Sometimes it looked like it barely changed anything, and sometimes it felt like everything got replaced. It didn't make me feel comfortable experimenting. shuffle.dev: Then I was curious about Shuffle generally. It says 60+ UI libraries. I thought you were able to produce styles for 60+ web UI frameworks, but it seems these are 60+ pre-made style packages? Since I just came from a UI library creator, that felt a bit odd, I mean surely I could randomly generate more than 60 variants? The Components view has some really intrusive "ad" as the second item. At first I thouht it was a form component. It really shouldn't be the same size as the real content items. Then I started wondering what you mean by "component", and realized that these are pre-made layouts. Sure, the implementation in React is probably as a component, but I find that word confusing. Still not sure if you're selling React components, CSS sheets, plain HTML or all of the above. The overall impression is "information overload" everywhere on your site. I'm on a 1920x1080 laptop screen with i3 as WM, and if I press "Purchase," the popup is so long, I have to scroll (a bit) to get to the bottom of it. Even though there isn't really much information, it's presented in a very cluttered way. > We recommend starting by selecting Assets and Copywriting for your target audience. So then, why are these two tabs last in your tab row? Sorry. Didn't mean to make it so negative, but these were my two cents.
- kemyd 3y ago
  Hey, Thank you for your feedback. 1. The "Shuffle Styles" changes everything except tabs with a padlock icon. You can lock settings you like and then keep shuffling. 2. Shuffle is our main product (check https://shuffle.dev/new https://shuffle.dev/new). Until now, we have only had UI libraries we created ourselves. You can adjust them to your needs in the editor, but the UI Library Creator is a tool to create libraries we don't have. 3. Can you tell me more about this "intrusive ad"? Probably, I didn't understand it correctly. 4. UI Libraries are sets of components grouped into categories, like headers, pricing, etc. For example, you can view components of Saturn Library: https://shuffle.dev/components/all/saturn https://shuffle.dev/components/all/saturn 5. Assets and Copy are last because they are not this tool's "killer feature"- Styles are. :) However, when creating a UI library, it is best to lock them at the beginning so you can focus on styles, not texts and images. Appreciate engagement with a longer comment! Thanks
bkyan 3y ago
Could I use this with my own custom css framework? ... or is this tied to specific frameworks, such as tailwind, bootstrap, bulma, and material-ui?
- kemyd 3y ago
  I'm sorry, but this is not possible. UI Library Creator works with Tailwind CSS, and we will add support for Bootstrap later. We don't have a plan to support custom frameworks. We need to know the framework "structure" to make this tool work. :)
  - bkyan 3y ago
    That makes sense! Thanks for the quick response!
butz 3y ago
Who has time to go over 9100+ components to find what they need and then somehow make them look coherent and work in uniform fashion?
ayyappa99 3y ago
Can I pick a block/component from a different ui library? Consider I picked Zanrly at start, but found out tables sections are not available. Then can I pick that particular block from another ui library which has it? Also in UI Library Creator, Is it possible to select an existing ui library and build from there instead of plain?

79 points by kemyd 3y ago

satishjain72 3y ago

Super Awesome Team and Update . I am particularly looking forward the Wordpress export feature What is the ETA for that?

deleted 3y ago

[deleted]

deleted 3y ago

[deleted]

luciantartea 3y ago

Congratulations for creating both Shuffle and UI Library Creator. I love how smoothly you implemented the variation previews. It's a great tool. The possibilities are endless

kemyd 3y ago
Thank you for your kind words! We are now a team of eight, and I thank you on behalf of them all. :)

yu3zhou4 3y ago

Great execution!

kemyd 3y ago
Thanks!

Turing_Machine 3y ago

Typo on login screen: "copywrighted" It may seem minor, but that one (or even worse, "copywritten") sets my teeth on edge, and I'm betting there are more people like me. :-)

kemyd 3y ago
Thanks for reporting! I can't find it right now, but if it exists, it will be fixed soon :)
graypegg 3y ago
He who copywroght the copy shall face the copywrath.

revskill 3y ago

No free components ? No thanks.

kemyd 3y ago
We have discussed the freemium approach, but for now, you need an account to use all options. (However, you can still build a UI Library without an account and see if it's the tool for you)
- mikercampbell 3y ago
  Hey, your presentation more than makes up for that approach. I’ve already sent it to my team to see if it’s something we’d want to try!
  - kemyd 3y ago
    Great! Appreciate that :)

codetrotter 3y ago

Neat! I bought the lifetime access in 2021. Nice to see you guys are still active and adding new things :)

kemyd 3y ago
We are probably the small exception in the SaaS business that keeps adding stuff but does not charge old users for it. ;) Thanks for supporting us in 2021.

tommiegannert 3y ago

Perhaps I'm not your target audience, but I have a hard time understanding what it is that you do. Here are some observations from a first-time visitor. UI Library Creator: I think the left-right carrousel shows different page layouts, showcasing the current style? But they're all very similar to each other. And you're already showing the styles as a thumbnail at the bottom? What's the difference? A static grid with four very different pages would probably work better for me. If I press Shuffle styles, does it only shuffle the current tab, or all styles? I think it might do all, which is very confusing. Sometimes it looked like it barely changed anything, and sometimes it felt like everything got replaced. It didn't make me feel comfortable experimenting. shuffle.dev: Then I was curious about Shuffle generally. It says 60+ UI libraries. I thought you were able to produce styles for 60+ web UI frameworks, but it seems these are 60+ pre-made style packages? Since I just came from a UI library creator, that felt a bit odd, I mean surely I could randomly generate more than 60 variants? The Components view has some really intrusive "ad" as the second item. At first I thouht it was a form component. It really shouldn't be the same size as the real content items. Then I started wondering what you mean by "component", and realized that these are pre-made layouts. Sure, the implementation in React is probably as a component, but I find that word confusing. Still not sure if you're selling React components, CSS sheets, plain HTML or all of the above. The overall impression is "information overload" everywhere on your site. I'm on a 1920x1080 laptop screen with i3 as WM, and if I press "Purchase," the popup is so long, I have to scroll (a bit) to get to the bottom of it. Even though there isn't really much information, it's presented in a very cluttered way. > We recommend starting by selecting Assets and Copywriting for your target audience. So then, why are these two tabs last in your tab row? Sorry. Didn't mean to make it so negative, but these were my two cents.

kemyd 3y ago
Hey, Thank you for your feedback. 1. The "Shuffle Styles" changes everything except tabs with a padlock icon. You can lock settings you like and then keep shuffling. 2. Shuffle is our main product (check https://shuffle.dev/new https://shuffle.dev/new). Until now, we have only had UI libraries we created ourselves. You can adjust them to your needs in the editor, but the UI Library Creator is a tool to create libraries we don't have. 3. Can you tell me more about this "intrusive ad"? Probably, I didn't understand it correctly. 4. UI Libraries are sets of components grouped into categories, like headers, pricing, etc. For example, you can view components of Saturn Library: https://shuffle.dev/components/all/saturn https://shuffle.dev/components/all/saturn 5. Assets and Copy are last because they are not this tool's "killer feature"- Styles are. :) However, when creating a UI library, it is best to lock them at the beginning so you can focus on styles, not texts and images. Appreciate engagement with a longer comment! Thanks

bkyan 3y ago

Could I use this with my own custom css framework? ... or is this tied to specific frameworks, such as tailwind, bootstrap, bulma, and material-ui?

kemyd 3y ago
I'm sorry, but this is not possible. UI Library Creator works with Tailwind CSS, and we will add support for Bootstrap later. We don't have a plan to support custom frameworks. We need to know the framework "structure" to make this tool work. :)
- bkyan 3y ago
  That makes sense! Thanks for the quick response!

butz 3y ago

Who has time to go over 9100+ components to find what they need and then somehow make them look coherent and work in uniform fashion?

ayyappa99 3y ago

Can I pick a block/component from a different ui library? Consider I picked Zanrly at start, but found out tables sections are not available. Then can I pick that particular block from another ui library which has it? Also in UI Library Creator, Is it possible to select an existing ui library and build from there instead of plain?