[HN Gopher] Show HN: UI Library Creator
___________________________________________________________________
Show HN: UI Library Creator
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 *
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
Author : kemyd
Score : 61 points
Date : 2023-11-22 13:51 UTC (1 days ago)
(HTM) web link (shuffle.dev)
(TXT) w3m dump (shuffle.dev)
| luciantartea wrote:
| 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 wrote:
| Thank you for your kind words! We are now a team of eight, and
| I thank you on behalf of them all. :)
| yu3zhou4 wrote:
| Great execution!
| kemyd wrote:
| Thanks!
| Turing_Machine wrote:
| 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 wrote:
| Thanks for reporting! I can't find it right now, but if it
| exists, it will be fixed soon :)
| graypegg wrote:
| He who copywroght the copy shall face the copywrath.
| revskill wrote:
| No free components ? No thanks.
| kemyd wrote:
| 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 wrote:
| 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 wrote:
| Great! Appreciate that :)
| codetrotter wrote:
| Neat! I bought the lifetime access in 2021. Nice to see you guys
| are still active and adding new things :)
| kemyd wrote:
| 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 wrote:
| 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 wrote:
| 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).
| 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
|
| 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
| tommiegannert wrote:
| > 3. Can you tell me more about this "intrusive ad"?
| Probably, I didn't understand it correctly.
|
| Yepp.
|
| https://shuffle.dev/components/all/all/about-us
|
| The second item is some static "house ad" for Alternatives.
| On this page, it stands out well, and I can tell it's not
| actually part of the search results. The annoying animation
| of course means it's distracting in an otherwise quiet page,
| but whatever.
|
| The problem is I started clicking around on
| https://shuffle.dev/components/all/all/dashboard-forms, where
| all the real search results are also dark themed, and there
| it's just confusing and irrelevant. Had it been just a
| banner, it would have been more visually obvious that you're
| just trying to distract me, and that it's not part of the
| search result.
|
| > 4. UI Libraries are sets of components grouped into
| categories, like headers, pricing, etc.
|
| If I look at
| https://shuffle.dev/components/all/saturn/pricing, you're
| telling me this is a component. To me, the word component
| signifies an atom, something simple with a single purpose.
| This makes me think the "component" you talk about is _one_
| of the columns, but I think you mean it 's the entire layout,
| including header. I.e. some assembly of components (perhaps
| super-component), in my taxonomy. That doesn't fit the bill
| of "atomic" and my brain just spins around trying to make
| sense of it all.
|
| OTOH, looking at
| https://shuffle.dev/components/all/saturn/footer, it seems
| that you're showing more than just a footer? I.e. what you
| are showing me is _not_ the component, but the component in
| an example context. It 's taken me five views of your search
| results to reverse engineer what it is I'm looking at, and
| understanding what your product is.
|
| Perhaps make the irrelevant parts shaded? Or add a toggleable
| frame around the actual component?
| kemyd wrote:
| It's an "ad" for our tool that helps build websites in many
| styles at once (60+ libraries we have in Shuffle). I'll ask
| our designer to make it less irritating. ;)
|
| We have used the term "components" for a long time. Some
| call them "sections" or "blocks". Still, I think
| "component" is a valid name, and many websites with
| components/sections/blocks use it.
| bkyan wrote:
| 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 wrote:
| 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 wrote:
| That makes sense! Thanks for the quick response!
___________________________________________________________________
(page generated 2023-11-23 23:01 UTC)