15 comments

  • , 5 months ago

    Hello designers! We've been working very hard on reshaping Hadron for the past months. Thanks to everyone that has given us feedback!

    After this update, you can also design without writing code using the UI, but despite that, you're actually generating your own code because Hadron edits code on the fly.

    I'm here to answer all your questions and hear any feedback you might have.

    4 points
    • Tejas Bhalerao, 4 months ago

      Waiting for the early access approval.

      2 points
      • , 4 months ago

        We've many requests and we're sending them gradually so we can talk to users and iterate while keeping things easier for us at the moment.

        2 points
        • Troy RobinsonTroy Robinson, 4 months ago

          Appreciate your steady and patient method for onboarding testers. I'm happy to try Hadron with my app design process when you're ready!

          0 points
    • Rhys MerrittRhys Merritt, 4 months ago

      Hi Nacho - I'm not sure I understand this part

      because Hadron edits code on the fly

      What does this mean when compared to other tools like Webflow and Modulz? How does this make Hadron better, or different?

      0 points
      • Nacho García , 4 months ago

        Hi Rhys!,

        It means that your design isn't stored internally as a big JSON that need to be converted to code when you export it. There is no export phase where that JSON is converted to code. Instead, Hadron edits the actual code everytime you touch something in the UI, like changing a color. (Take a look at the video titled "Hadron edits your own code" at hadron.app)

        This makes possible a total integration of your designs with the development environment.

        What are the advantages of this approach?

        • You could work on production files themselves.

        • You can edit the code manually, so if you have some HTML or CSS knowledge, you can modify the design code, avoiding the limitations of the tool. Our developer mode is only possible this way. And you can use it to learn HTML/CSS too!

        • You could design in Hadron while a developer teammate is coding in their preferred code-editor outside of Hadron and be synced through git.

        • You could import an existing web project into Hadron.

        2 points
  • Account deleted 5 months ago

    That looks super cool.

    4 points
  • Michael CookMichael Cook, 5 months ago

    I got access to the preview and have been using it to create a mockup of a new version of my agency's site. I've wanted to get into front end web for a long time but it's felt too intimidating to tackle. Hadron's approach has helped me break through the barriers. Looking forward to playing with this new stuff.

    3 points
  • Henry MoranHenry Moran, 5 months ago

    Will you be able to import existing designs from Sketch and about to HTML? Also, will there be integration with React?

    I like where you guys are going with this. I was contemplating this concept back in 2012. Yeah, I'm officially internet old.

    https://dribbble.com/shots/583664-Canvas-Wireframe/attachments/45588

    2 points
    • , 5 months ago

      We're probably implementing importing from Sketch as it's something few people have requested and it'd be very useful. As for React, yes there'll be integration with React, it's been developed around the idea that we could add any framework easily. Although, there are few things before that I'm sure people will love.

      wow 2012, that was so ahead of its time!

      0 points
  • Mattan IngramMattan Ingram, 5 months ago

    Looks like we have a new design/code tool showdown between Framer, Hadron, Interplay, and Modulz. Is there anything the Hadron team is focusing on that you feel will differentiate you from those other tools?

    1 point
    • , 5 months ago

      Hadron, unlike those tools, is more like a visual code editor because you can go back and forth between code and design.

      The reason for this is that they all store the design in an internal data structure, that they later translate into images or code when you request it. This means that there is a new exported object created every time.

      In contrast, Hadron edits code on the fly while you are working. Each of your actions on the UI is translated into an operation to update the code. We don't have an internal data structure. This is huge because it allows files to be shared for real.

      We'll expand this more on another post in the future.

      8 points
      • Mattan IngramMattan Ingram, 5 months ago

        Thanks for the explanation! That is an appealing difference for someone like me who is familiar with HTML/CSS/JS but hasn't gone deep into anything but the very front of the front-end.

        0 points
  • Marcel M., 5 months ago

    As Webflow is probably a little different (not working on local files) I'm trying to put this one into the correct box of tools, so...

    ...would you say Hadron is somewhat catering to the same audience like https://pinegrow.com/ ??

    0 points
  • Jason Marder, 4 months ago

    Can you import existing React components into Hadron?

    0 points