7 ms·

Shuffle — An online editor for busy developers

165 points by kemyd 6y ago

kemyd 6y ago
Hey HN! I want to share with you something we've been working on the last few months — the new Shuffle (https://shuffle.dev https://shuffle.dev). It's an online visual editor for Tailwind CSS, Bootstrap, Bulma, and Material-UI. The brand is new, but we created Shuffle by combining our four editors into one. That's why, if you have an account in Tailwind Builder, Bootstrap Shuffle, Bulma Builder, or Material-UI Builder, you don't need to create a new one (please use the same login details). Shuffle includes all the content from old editors & the new beautiful dark mode. I encourage you to try the demo. Registration is not required! Any feedback is welcome! PS. A few days ago, the CEO of Webflow published here a beautiful story to thank the community, and we have a similar tale & reason to thank you. Exactly two years ago, our first visual editor was featured on Hacker News's homepage[1], and thanks to that spike in traffic, good reviews & comments, I was sure to continue working on it! TRUE STORY! Then, it was just me, a one-person "company." Now, we're a team of four :) So thank you all! [1] https://news.ycombinator.com/item?id=18821854 https://news.ycombinator.com/item?id=18821854
- 430scuderia 6y ago
  I love it. This is an excellent product.
- sebmellen 6y ago
  Just want to chime in to say how good the Shuffle.dev team is! I had a billing issue where I was locked out of my account due to an issue with PayPal's webhooks. Dawid (the Founder) responded very courteously to my strongly-worded email, and worked with me to fix the issue. A really great guy, and a great product! I mostly use the Tailwind builder, the top comment on the ProductHunt page is mine and has a bit more detail on the story: https://www.producthunt.com/posts/tailwind-builder-2-0 https://www.producthunt.com/posts/tailwind-builder-2-0.
  - kemyd 6y ago
    Thanks Sebastian!
kodah 6y ago
Love the idea, as well as that there's a lifetime purchase option. That said, I'm working on a project that requires Vue/Vuetify and I'd love to be able to use this on that as well.
- kemyd 6y ago
  Thanks :) We will add support for Vue and Vuetify in a few weeks
  - kodah 6y ago
    I went ahead and bought it, because it seems neat. A couple things: At first I was just playing around with the stock templates. I then discovered the HTML editor and that's when I was really blown away. The fact that I can drag and drop stuff, immediately customize it, and then visualize it was a powerful mix. For some reference, I'm a backend and infrastructure dev who has some decent React skills. I don't know if you can stuff this in an electron app, but I would love to be able to just load this on my desktop when I need it. I thought this was cool before, but I'll be showing it to my team tomorrow.
jaywalk 6y ago
A lifetime option that only costs as much as a 6 month subscription honestly does nothing more than make me worry about how long your product will stick around.
- kemyd 6y ago
  Hey, we exist for two years right now and doing very well :) Our revenue is growing 13% month to month (bootstrapped). We are based in Poland, so different rates apply here (I'm guessing you're writing from the US)
  - jaywalk 6y ago
    Glad you guys are doing well! I am in the US, so take that for what you will. Just figured I would give feedback on something that immediately jumped out at me.
    - kemyd 6y ago
      Thanks! :) I commented about the US because of the difference in salaries. It is much cheaper to run a SaaS start-up in Poland, which is why we are doing well. Probably for the team in the US, it would be too small revenue to build a four-person team in-house (without, e.g., VC funding).
  - edoceo 6y ago
    I frequently see lifetime offerings at 3-5 times annual. Don't be shy about adjusting prices up if you've got a good demand curve going.
    - kemyd 6y ago
      We're going to experiment with pricing, that's for sure :)
  - ravivyas 6y ago
    I suggest you drop lifetime pricing for a pure SaaS model. Both push different incentives and product paths. Recurring usage will give you more growth avenues than 1 time. Not to mention this is a product that actually needs constant updates, as well charge for it.
onassar 6y ago
I like the creativity on the play button; haha. Very cute to have the cursor be a play button that swaps whenever hoving over an element that is playable ;)
- kemyd 6y ago
  We like it too! :D
butz 6y ago
Neat. Visual tools might be even more useful for less technical people, e.g. project manager discussing landing page requirements with client during meeting. Being busy developer I do not have time to wait each time for elements sidebar to slide out - maybe use smaller elements in palette, but keep it always open? Constant fade outs to dark and back to light are a bit distracting when working in the dark.
- kemyd 6y ago
  Thank you for your feedback! We have thought about it on higher resolutions. Not sure yet if and when we will implement but noted. PS. You can use a shortcut to open the last component category (press C on your keyboard)
hankchinaski 6y ago
looks neat
mraza007 6y ago
Hey, I love the product and I was looking for something similar last night when I was working for a project.
nexuist 6y ago
This is great and I will definitely use it in the future. Have you considered adding support for MetroUI? metroui.org.ua/ Furthermore, in the future, what do you think about a meta-framework system that enables users to import an arbitrary framework and create their own components from it? That way you don't have to keep adding dozens of frameworks yourself.
saltypal 6y ago
Nicely polished landing page and a very cool idea. A few clicks into the demo, though, I came across this example copy in one of the pre-built components. > This is such a great product that I feel aroused every time I use it. I didn't know the boys would be able to build, but god damn it, they did it. Kickass! Maybe consider lorem ipsum or similar text if you don't have a designer who can write placeholder copy. This is, frankly, just gross.
- kemyd 6y ago
  Hey, Bootstrap components have copy inspired by the Silicon Valley series. It's just a joke (what Russ Hanneman could say). If you didn't watch it, please have a look at the best scene (IMHO) with this guy: https://www.youtube.com/watch?v=s9Bg4UU76so https://www.youtube.com/watch?v=s9Bg4UU76so
  - saltypal 6y ago
    Makes sense—haven't seen the show but appreciate the context. That said, for placeholder text as much as for jokes, "if you have to explain it…"
    - kemyd 6y ago
      In all new UI libraries, we use lorem ipsum:)
marz0 6y ago
Interesting! The tagline made me think of something like cloud9, repl.it, or glitch.com but it's clearly something different. Seems like it could be a useful prototyping tool.
gavinray 6y ago
This is really cool, I've passively followed tailwind.build since it's launch here. Really happy to see that you're doing well with this and expanding. Maybe one piece of feedback: $24 is a lot of buyin for me. I would happily give you $5 for 7 day trial for instance, but personally $24 is too much for something I'm fully sure of. Probably on the poorer end of HN browsers, so not sure my opinion matters haha, but just my $0.02
jonsully 6y ago
Sweet. I've been looking for something like this for a while — will definitely give it a try. Wish there was like a $10-for-7-day-trial sort of thing so I could _fully_ try it out before paying $24 / $149, but it seems worth it for me at the moment so I'll go ahead and start with $24 :)
deleted 6y ago
[deleted]
ryan-allen 6y ago
This is really nice! My suggestion would be to curate a bunch of custom components built upon the libraries that you offer, so rather than having to build up a complex form there are starting points, this could be user generated. That would cut down on both having to build something up from scratch but also learning from existing implementations. Very very cool though, I could see this being a massive timesaver!
anw 6y ago
Wow, I'm blown away by the slickness of the UI and UX. It's very impressive and intuitive. I'm not the target demographic (yet), but may look into this later when I look at starting up a 1 man company. Great job putting this beautiful site together. Is there any article or post about how this platform was created (including design aspects)?
LorenzA 6y ago
feels nice to play around with it. you can create really fast some mock up ideas. found some bugs or maybe just something i found strange take it if you want it:>, (was just testing the demo) * adding some components and clicking shuffle removes them for instance the form thing adding it -> clicking 2 times shuffle -> gone * you check that the html is valid but the editor shows it only after you close and reopen it. used 'teams' removed the last section-tag in the html editor, clicked save -> looked the same -> closed -> opened -> removed tag was back (as it should)
- kemyd 6y ago
  Thanks for reporting! We're checking both cases, and the fix will be deployed soon
domano 6y ago
hey is there a possibility to preview the editor with tailwind UI? I am on the fence if i should ask for a license in my company for both but would like to see the templates for TailwindUI (at least in the same way i can see locked previews for the other themes)
tjchear 6y ago
Love the editor! Wish it were usable on mobile, too, but I don't know if that's useful or needed by most people. What else do people use your editor to build, aside from landing pages (and forms)?

165 points by kemyd 6y ago

Hey HN! I want to share with you something we've been working on the last few months — the new Shuffle (https://shuffle.dev https://shuffle.dev). It's an online visual editor for Tailwind CSS, Bootstrap, Bulma, and Material-UI. The brand is new, but we created Shuffle by combining our four editors into one. That's why, if you have an account in Tailwind Builder, Bootstrap Shuffle, Bulma Builder, or Material-UI Builder, you don't need to create a new one (please use the same login details). Shuffle includes all the content from old editors & the new beautiful dark mode. I encourage you to try the demo. Registration is not required! Any feedback is welcome! PS. A few days ago, the CEO of Webflow published here a beautiful story to thank the community, and we have a similar tale & reason to thank you. Exactly two years ago, our first visual editor was featured on Hacker News's homepage[1], and thanks to that spike in traffic, good reviews & comments, I was sure to continue working on it! TRUE STORY! Then, it was just me, a one-person "company." Now, we're a team of four :) So thank you all! [1] https://news.ycombinator.com/item?id=18821854 https://news.ycombinator.com/item?id=18821854

430scuderia 6y ago
I love it. This is an excellent product.
sebmellen 6y ago
Just want to chime in to say how good the Shuffle.dev team is! I had a billing issue where I was locked out of my account due to an issue with PayPal's webhooks. Dawid (the Founder) responded very courteously to my strongly-worded email, and worked with me to fix the issue. A really great guy, and a great product! I mostly use the Tailwind builder, the top comment on the ProductHunt page is mine and has a bit more detail on the story: https://www.producthunt.com/posts/tailwind-builder-2-0 https://www.producthunt.com/posts/tailwind-builder-2-0.
- kemyd 6y ago
  Thanks Sebastian!

kodah 6y ago

Love the idea, as well as that there's a lifetime purchase option. That said, I'm working on a project that requires Vue/Vuetify and I'd love to be able to use this on that as well.

kemyd 6y ago
Thanks :) We will add support for Vue and Vuetify in a few weeks
- kodah 6y ago
  I went ahead and bought it, because it seems neat. A couple things: At first I was just playing around with the stock templates. I then discovered the HTML editor and that's when I was really blown away. The fact that I can drag and drop stuff, immediately customize it, and then visualize it was a powerful mix. For some reference, I'm a backend and infrastructure dev who has some decent React skills. I don't know if you can stuff this in an electron app, but I would love to be able to just load this on my desktop when I need it. I thought this was cool before, but I'll be showing it to my team tomorrow.

jaywalk 6y ago

A lifetime option that only costs as much as a 6 month subscription honestly does nothing more than make me worry about how long your product will stick around.

kemyd 6y ago
Hey, we exist for two years right now and doing very well :) Our revenue is growing 13% month to month (bootstrapped). We are based in Poland, so different rates apply here (I'm guessing you're writing from the US)
- jaywalk 6y ago
  Glad you guys are doing well! I am in the US, so take that for what you will. Just figured I would give feedback on something that immediately jumped out at me.
  - kemyd 6y ago
    Thanks! :) I commented about the US because of the difference in salaries. It is much cheaper to run a SaaS start-up in Poland, which is why we are doing well. Probably for the team in the US, it would be too small revenue to build a four-person team in-house (without, e.g., VC funding).
- edoceo 6y ago
  I frequently see lifetime offerings at 3-5 times annual. Don't be shy about adjusting prices up if you've got a good demand curve going.
  - kemyd 6y ago
    We're going to experiment with pricing, that's for sure :)
- ravivyas 6y ago
  I suggest you drop lifetime pricing for a pure SaaS model. Both push different incentives and product paths. Recurring usage will give you more growth avenues than 1 time. Not to mention this is a product that actually needs constant updates, as well charge for it.

onassar 6y ago

I like the creativity on the play button; haha. Very cute to have the cursor be a play button that swaps whenever hoving over an element that is playable ;)

kemyd 6y ago
We like it too! :D

butz 6y ago

Neat. Visual tools might be even more useful for less technical people, e.g. project manager discussing landing page requirements with client during meeting. Being busy developer I do not have time to wait each time for elements sidebar to slide out - maybe use smaller elements in palette, but keep it always open? Constant fade outs to dark and back to light are a bit distracting when working in the dark.

kemyd 6y ago
Thank you for your feedback! We have thought about it on higher resolutions. Not sure yet if and when we will implement but noted. PS. You can use a shortcut to open the last component category (press C on your keyboard)

hankchinaski 6y ago

looks neat

mraza007 6y ago

Hey, I love the product and I was looking for something similar last night when I was working for a project.

nexuist 6y ago

This is great and I will definitely use it in the future. Have you considered adding support for MetroUI? metroui.org.ua/ Furthermore, in the future, what do you think about a meta-framework system that enables users to import an arbitrary framework and create their own components from it? That way you don't have to keep adding dozens of frameworks yourself.

saltypal 6y ago

Nicely polished landing page and a very cool idea. A few clicks into the demo, though, I came across this example copy in one of the pre-built components. > This is such a great product that I feel aroused every time I use it. I didn't know the boys would be able to build, but god damn it, they did it. Kickass! Maybe consider lorem ipsum or similar text if you don't have a designer who can write placeholder copy. This is, frankly, just gross.

kemyd 6y ago
Hey, Bootstrap components have copy inspired by the Silicon Valley series. It's just a joke (what Russ Hanneman could say). If you didn't watch it, please have a look at the best scene (IMHO) with this guy: https://www.youtube.com/watch?v=s9Bg4UU76so https://www.youtube.com/watch?v=s9Bg4UU76so
- saltypal 6y ago
  Makes sense—haven't seen the show but appreciate the context. That said, for placeholder text as much as for jokes, "if you have to explain it…"
  - kemyd 6y ago
    In all new UI libraries, we use lorem ipsum:)

marz0 6y ago

Interesting! The tagline made me think of something like cloud9, repl.it, or glitch.com but it's clearly something different. Seems like it could be a useful prototyping tool.

gavinray 6y ago

This is really cool, I've passively followed tailwind.build since it's launch here. Really happy to see that you're doing well with this and expanding. Maybe one piece of feedback: $24 is a lot of buyin for me. I would happily give you $5 for 7 day trial for instance, but personally $24 is too much for something I'm fully sure of. Probably on the poorer end of HN browsers, so not sure my opinion matters haha, but just my $0.02

jonsully 6y ago

Sweet. I've been looking for something like this for a while — will definitely give it a try. Wish there was like a $10-for-7-day-trial sort of thing so I could _fully_ try it out before paying $24 / $149, but it seems worth it for me at the moment so I'll go ahead and start with $24 :)

deleted 6y ago

[deleted]

ryan-allen 6y ago

This is really nice! My suggestion would be to curate a bunch of custom components built upon the libraries that you offer, so rather than having to build up a complex form there are starting points, this could be user generated. That would cut down on both having to build something up from scratch but also learning from existing implementations. Very very cool though, I could see this being a massive timesaver!

anw 6y ago

Wow, I'm blown away by the slickness of the UI and UX. It's very impressive and intuitive. I'm not the target demographic (yet), but may look into this later when I look at starting up a 1 man company. Great job putting this beautiful site together. Is there any article or post about how this platform was created (including design aspects)?

LorenzA 6y ago

feels nice to play around with it. you can create really fast some mock up ideas. found some bugs or maybe just something i found strange take it if you want it:>, (was just testing the demo) * adding some components and clicking shuffle removes them for instance the form thing adding it -> clicking 2 times shuffle -> gone * you check that the html is valid but the editor shows it only after you close and reopen it. used 'teams' removed the last section-tag in the html editor, clicked save -> looked the same -> closed -> opened -> removed tag was back (as it should)

kemyd 6y ago
Thanks for reporting! We're checking both cases, and the fix will be deployed soon

domano 6y ago

hey is there a possibility to preview the editor with tailwind UI? I am on the fence if i should ask for a license in my company for both but would like to see the templates for TailwindUI (at least in the same way i can see locked previews for the other themes)

tjchear 6y ago

Love the editor! Wish it were usable on mobile, too, but I don't know if that's useful or needed by most people. What else do people use your editor to build, aside from landing pages (and forms)?