What are the best prototyping tools?

Best overall which uses different file types have more than just prototype software, able to collaborate with others. Also which allows designers to design as well as have full preparation for developers to do their work?
Your recommendation
🤓 Have a recommendation? Join to share.
24 recommended
  1. 39

    Prototyping and collaboration for design teams

    Stefan Theofilos
    Stefan Theofilos8Product Designer, Entrepreneur · Written
    Invision is a fantastic prototyping tool that I'd recommend to anyone.
    Veronica Belmont
    Veronica BelmontDestroyer of Worlds (and PM at Disco) · Written
    One of my favorite tools, and a huge plus is getting emails from Clark (obviously)!
    • Dennis Weinhardt
      Dennis WeinhardtDigital Designer (UI/UX/Web)

      I love everything about InVision.

      Since I started using it 3-4 years ago they improved so many things and added really useful features. They collaborate with so many top designers of the industry that they always know what we want. I really appreciate the effort, time and love they put into their products and it's always fun to use them.

      The tools I use on a weekly basis are:

      InVision (Webapp); Freehand; Craft; Designbetter.co

    • Elena Avramenko
      Elena AvramenkoCo-Founder at PopAppFactory

      All my designers loves the service, but I am struggling to use it, I find its UI/UX uncomfortable and not obvious. The most terrible is a mobile version of the web-site, extremely slow.

  2. 33

    Turbo prototyping tool for websites 🚀

    Yara Nevmerzhitskaya
    Yara Nevmerzhitskaya3Lead seo specialist, marketer · Written
    Like this tool. Easy for using. Allows sharing your ideas with team members or clients to collect feedback right on the prototype! All the edits will be displayed online. Really a lot of ready-made blocks and prototype templates. Draftium is free (with amazing PRO package). The best prototyping tool I've used for web.
    It really helps me to save a lot of time and mental resources at the beginning of the development process. Less pointless discussions I have with a customer, more time for real meaningful work. That's a dream!
    • Stas Shyshkin
      Stas ShyshkinDigital Marketing Manager

      I have been testing alpha version of Draftium before the launch and must admit it has greatly simplified my work. So when I need to create a landing page, I make a quick wireframe (with copy) in Draftium and pass it on to UX designers. They already see what I want to get as a result and so we spend less time on numerous iterations.

    • Nicholas

      I have yet to use it, but from the video alone, it looks like something to further speed our process.

      Update: Loving this product. The makers are checking all the right boxes and what I love about it beyond the relatively generous free tier as well as the package this fits into, is the overall intent behind it. To cite a comment I made: "Absolutley love the motivation behind this: the combination of simplicity, speed and frictionless workflow paired with tasteful results," it just makes for an awesome combination not to be missed.

  3. Fredo Tan
    Fredo TanGrowth at Studio XID (ProtoPie) · Edited
    Fredo Tan made this product
    In our opinion, a prototype without hi-fi interactions is rather useless. For anyone. Hence, we built ProtoPie, the hi-fi prototyping tool that enables designers to create superior prototypes containing the most sophisticated interactions you could imagine as easy as pie without having to get your hands dirty with code. The gradual learning curve of ProtoPie is due to its intuitive UI which is based on the concept model and philosophy behind the product. This concept model entails that an interaction consists of an object, a trigger and a response, simplifying the whole process of prototyping. Other strong suits: - Fully utilize sensors in your smart devices for your prototypes easily. - Share and deploy your prototypes anywhere and anytime using the ProtoPie Player app or simply any web browser. - Seamless integration with Sketch and Adobe XD CC allowing you to go back and forth between design and prototyping hassle-free. More features (e.g. collaboration) and other cool stuff are on the way at this moment ;) If you have any questions, fire away :)
    Comments (2)Share
    Byungwoo Yoon
    Byungwoo Yoonart director, graphic designer · Written
    I use Protopie and this application is excellent. Easy to use and make a interaction. I can share the project's prototype to our client, and they easily image the interaction. Really helpful
  4. 16

    A new design tool. Completely redesigned.

    Oh and take a look at Framer - design and development combined.
    Comments (2)Share
    David Adamu
    David Adamu3Maker. Product Designer @Andela · Written
    As a Product designer, Framer does it for me.
    Cody S
    Cody SFounder, MX · Written
    Requires a minimal amount of coding, but it's powerful.
  5. 10
    Craft Prototype, from InVision

    Design, prototype, and collaborate seamlessly

    Amazing Sketch (and now Photoshop?) Plugin which brings your designs into InVision
    Comments (2)Share
    • Julie Delanoy
      Julie DelanoyDesign at Product Hunt

      I mostly use Craft for syncing with Invision and the library to always have the last update for the colors and text styles of our style guide. It's really useful, and I can't complain except when it makes Sketch suddenly crash. At first, I thought this was a Sketch problem, but after looking into it, I learned that Craft could be sometimes instable. Still, it's worth the risk 😉

    • André Bose do Amaral
      André Bose do AmaralFounder/CCO/CEO, Mecenato.co

      Am a recent convert to Sketch + Craft, and the connection to InVision raises productivity dramatically. Large files with lots of artboards/hotspots still face issues synching up, though, which is a bit annoying.

  6. 9

    Animate your ideas, design better apps

    Great for animating your designs - early or later in the process
    Comments (1)Share
    It's best tool for prototyping I guess
    I use Invision and Principle, but it will depend on the platform and how complex your prototype will be. Principle allows you to do custom animation without code. Here is a good list of prototype tools depending on learning curve, platforms and complexity. https://www.cooper.com/prototypi...
    • Julie Delanoy
      Julie DelanoyDesign at Product Hunt

      I use Principle mostly for quick demos when I try to communicate interaction ideas with my teammates. Principle is very good for this if you're not trying to create something too fancy but really want to share your ideas. Word to the makers: Keep the good work!

  7. 8
    Figma 2.0

    Design and prototype in one always up to date tool

    Karthik Mahadevan
    Karthik MahadevanFounder and Designer at Envision · Written
    I used to mostly rely on Sketch, Marvel and Keynote for prototyping, but very recently I tried Figma and found it to be a breeze. I especially loved how easy it was for me to handover to the programmer. It's all online so sharing and collaborating was pretty easy as well.
    Figma is dynamite, especially now it has prototyping baked in. I wish Figma would integrate with some of the animation tools (Principal et al), as sometimes the prototyping functionality just isn't enough.
    • They also have a integration with Zeplin and you can export all your layers into Zeplin.

      Works very well. You can export every layer or group/object as JPG/PNG/SVG.

      You can copy every text layer by just selecting it and Ctrl+C (copy as text), you can see the fonts and colors for text layers as well.

      You can also share your projects with your team by email invite and public link.

    • Arena R
      Arena RDesigner

      I've been using Figma as my main tool lately and I'm loving it. I still need Sketch for a few things here are there (like getting things done offline, but that's rare). I just really love prototyping now that I can see changes immediately (no waiting for exports or a server to sync). I also love it when I can collaborate with a writer as I design screens. We used Figma to design the App Store screenshots for Tonight! New York (also on Product Hunt) and it was so fun and productive.

  8. 8
    Marvel 2.0

    Super simple design, prototyping and collaboration

    Dhruv Agrawal
    Dhruv AgrawalCo-founder, Shipsy · Written
    It's pretty good too, close to Invision
    Rajat Patel
    Rajat PatelFront End Developer · Written
    Super simple Prototyping tool. I use it and have no issues with it so far. Must try for all the designers.
  9. 9

    Rapid Prototyping for Mobile Apps

    Davide Petrillo
    Davide PetrilloLead Product Manager at Goodpatch · Written
    Rapid tool to create interactive prototypes starting from your hand sketches, visuals from Sketch (there's a direct integration) and others, or wireframes created with the Prott editor. Ready to then be shared with the team or user tested on web or on the Prott mobile apps. Disclaimer: I'm the Prott PM:)
    Comments (1)Share
  10. Fast and easy animations based on Sketch designs. Frequent updates.
  11. 5

    Fast, fully-interactive, high-fidelity mobile prototypes

    Brandon Elwood
    Brandon ElwoodOwner, AppJester · Written
    Feels like the real thing. Before we build an app, we build it from the ground up using proto.io.
  12. 5

    Next generation design tool for digital products

    Yutaka Ishii made this product
    STUDIO has whole new way of designing and prototyping with using real code.
  13. 5
    Fluid UI

    The World's #1 Wireframing & Prototyping Tool

    Jevin Sew
    Jevin SewRails / iOS developer · Written
    You could try this one!
    Comments (1)Share
  14. 5

    Turn Sketch designs into native mobile apps in minutes

    Kyle W. Ludwig
    Kyle W. LudwigCo-founder, Looma 🍐 · Written
    Wait! There's more. Use Sketch to make the prototypes, then put them into Craft by Invision to make clickable prototypes you can share on the web to get localized comments from collaborators on your design. You can also use Inspect by Invision to hand off the fonts, color palettes, and assets from designers to the developers. I've tried Adobe XD for over a year but for over $20/mo, the features haven't caught up to the value this Sketch stack gets me for a single $100 payment plus freemium Invision subscription - and Adobe still has a long way to go.
    Comments (4)Share
  15. 4
    Atomic.io 2.0

    Ultra fast, scalable and fully collaborative prototyping

    Kunal Bhatia
    Kunal Bhatia51Co-founder & Design Lead @SlidesUp · Written
    I'm in love with Atomic and the team. They are very forward-thinking and build some great features that will help you communicate your intent with your team. Especially since you are new to UX Design, Atomic has both the tools and a newsletter (Product Design Weekly) to help you get better. You can read my Medium articles about prototyping tools to see Atomic in action compared to a few others.
    • Kunal Bhatia
      Kunal BhatiaCo-founder & Design Lead @SlidesUp

      Atomic is my go-to solution for ideating, creating something to test with customers, and communicating with developers. You can get an idea of how I use prototyping tools in general here. It includes an overview of many tools in this space.

  16. 4

    UX Design tools

    Maurice Koks
    Maurice KoksCEO and Founder of http://ARCADECRM.com · Written
    I use this almost every day, This is absolutely a must have tool for and not only Mock Up's but real Prototyping and much, much more
  17. Sabes™
    Sabes™IOS Developer, Attorney · Written
    I used Justinmind in the past (just use Xcode and Sketch now) but I thought it was a solid mock-up builder 👍
  18. 2
    Origami Studio by Facebook

    Explore, iterate, and test your ideas

    Jenil Gogari
    Jenil GogariDesigner. Explorer. Geek. · Written
    I started using Origami recently and it's pretty neat!
  19. I love paper & pen to digital prototype flows! Fast and dirty - ideal for early stages!
  20. I believe one of the best prototyping tools we have available to us are stories. Craft allows you to collaboratively develop, prioritise and order user stories, and acts as a boundary object between Devs and designers.