8
39 Comments

Landing page for bug reporting feedback widget! πŸ™

Hey Indiehackers! πŸ‘‹

We've built a bug reporting widget called Bugbash.org. It's an easily embeddable widget that helps you proactively request user feedback on issues. When shipping new features, there might be critical bugs that don't appear on makers' devices. 😿 We want to make it easy for users to share feedback and provide bug reports.

Here's a gif: https://imgur.com/a/38QA1nq
Here's the landing page: https://www.bugbash.org/

I'm split between focusing on just promoting a no-code widget to collect bug reports vs. a widget to collect user feedback. I'd love some feedback on:

  • landing page and design
  • does it explain the product?
  • would you sign up? Why/why not?
  • what's more important to you: collecting user feedback with a widget, or bug reports?

Thanks for reading!

on February 27, 2023
  1. 3

    I like your product idea! I decided to give you some technical feedback using my product, ValidBot.com, which is a website validator to help developers make sure their websites follow best practices. A few things stood out to me:

    1. Your website is missing the recommended favicon images, which is important for branding.
    2. It is also missing a robots.txt file. At the minimum, you should make this file with a simple allow rule so search engines know what to do.
    3. It looks like you are loading 8 fonts directly from Google fonts. Its better for performance if you can narrow it down to fewer and its better for privacy (and performance) if you serve the fonts directly from your server instead of loading from Google.
    4. You are missing a DMARC record which helps make sure emails you send are ending up in your customer's inbox instead of spam folder.

    Here is the full report: https://www.validbot.com/report/1392920d59efe862a23163ffa4e162b70

    Happy to walk you through it if you want any more pointers. And please feel free to re-run the audit when you have fixed a few things to see more recommendations. If you do happen to use ValidBot, please send me some feedback as I am still trying to perfect it.

    Thanks and Good Luck!

  2. 2

    I would sign up if you make the same thing but for an app (: Is that on the roadmap?

    1. 1

      Been hearing more requests for adding this for mobile! Let me know if you're interested and we'd be happy to get you free access as a beta user πŸ™‚

    2. 1

      Yes! Curious for the app use case, would you use the button/ widget to collect user feedback, or bug reports?

  3. 2

    Hi, do you support React Native?

    1. 1

      It's on our roadmap! What app are you hoping to add a feedback button to? Feel free to sign up for early access, we will prioritize it and have it available sooner if more beta users request this :)

      1. 2

        okay! we actually need it kind of now - in the next 1-2 months :)
        We are gonna have firstly closed beta and then open beta for our React Native app. Would be good to have a tool to automate feedback/bug reporting

        1. 1

          Oh that's super exciting! Would love to learn more about the app and help automate this. Will reach out - we should be able to support that within your timeframe!

  4. 2

    I'd suggest to use your own product, for example, I was looking for a way to try your widget on your landing page but there does not seem to be a way to do so.

    Other than that, I get what the product is all about, still, I have used similar tools in the past.

    Good luck!

  5. 2

    that's one nice landing page. What did you use to build it?

    1. 1

      Thank you! I built it using Webflow

  6. 2

    Looks nice.

    What is that 'Your site' text at multiple places?

    1. 2

      I'm trying to indicate that the blank page is the user's website, and that you can embed a widget on it.

      Will think of something else if that's unclear!

      1. 1

        Ok, it's like a chat button you want to show.

        What you can do is, just follow the existing designs of such chat button services and it gives an idea that is tested.

        Nice work!

        1. 1

          That's an awesome idea! Will look into their designs. Though if any site wants to add feedback collection when they already have a chat button, we'll have to think of a good way to balance the two visually! πŸ€”

          1. 1

            Yeah, right.

            What I think is, normally such buttons are mostly meant for contacting support not for reporting bugs.

            Maybe you could also think of having it just like a normal button in the middle of a page or from a navbar etc. Maybe we can connect on Twitter to share more about it.

  7. 2
    • Looks great.
    • Yes i am able to understand what it does.
    • Not yet not enough value proposition for me.
    • bug reports
  8. 2

    Clean, but too much animations

  9. 2

    first congrats! I would definitely sign up. But the same thing could be achieved using the feedback button I think many have on their sites.

    1. 1

      Thank you! Where are you seeing the feedback buttons? I see lots of websites offer chat for sales and support, but haven't seen many for feedback!

  10. 2

    I love gradient used in the background! :)
    I quick thought - I'm not sure if that "bug" is intentional πŸ˜‰ but I have a scrollbar in the button located in the hero section... I'm using Brave/Chrome on OSX

    1. 1

      Thanks so much for pointing it out :) Just updated the button, let me know if you're still seeing this!

      1. 2

        one more thing :) on mobile menu should use higher z-index, because it's behind your logo and hamburger/menu icon

        1. 1

          Updated! Only learning now what z-index is πŸ˜† thank you again for all your help πŸ™πŸ™

          1. 1

            sorry, didn't know that πŸ˜ƒ
            if you have any question how or maybe sth frontend related, don't hesitate πŸ˜‰ maybe I can help

      2. 2

        on desktop looks perfect β™₯️
        unfortunately on mobile this issue still persists, it's not big issue because the website works like a charm :)
        you can extend input and button in the hero section on the mobile to be take full width just like in the footer πŸ˜ƒ

  11. 2

    Signed up πŸ™

    1. 1

      Thank you @HarryChoi πŸ™

  12. 2

    Like the concept a lot!
    Thoughts:

    • Landing page looks great, very clean design
    • Pretty clear messaging, though more info / demo content might be nice. (You could have the widget on the landing page!)
    • Might be nice to include the GIF on landing page
    • I would (did!) sign up - think it'd be useful to use on test versions of my product / site!
    • Collecting user feedback is more important to me, personally!
    1. 1

      Thanks for your feedback! Will definitely try to incorporate a high quality gif on the landing page if load speed allows.

      Thanks for sharing that collecting user feedback is more important. Will gather some more data here and potentially pivot to focus on just user feedback :)

  13. 1

    Yeah, the website explained the product quickly. Loves the colourful header, make it "happier" to submit bugs.

    In the example website screenshot that you want to demo the bug widget, instead of placeholder images, try use a real website image.

    The "Take a screenshot" button is not aligned vertically. Is that intentional?

  14. 1

    bugbash.org doesn't redirect to www.bugbash.org (403). Cool idea though. Would it be a widget to integrate only a specific pages on a app, for new new features?
    Does it listen for unhandled exceptions?
    In terms of design, it's not quite there yet but there's a decent enough foundations.
    Things I would change:

    • There isn't enough contrast between on the hero section between the title and subtitle and the background. You should make the background image darker.

    • For the email address input field, instead of a grey border, use a black transparent one. The grey is jarring against the purple background. I would recommend replacing with a border: none and a shadow (box-shadow: 0 0 0 2px hsl(0, 0%, 100%, 30%) for instance) instead. You'll get a nice greyish purple which will fit in better.

    • Same contrast issue for the menu items on the top right.

    • The widget has a fair few issues. You need to sort out your alignment. All the padding values are inconsistent. The border-radius of the textarea is way to big for how little padding you're using inside of it. The "Take a screenshot" text isn't aligned horizontally. You should get rid of the shadows or make them far softer, they look dated. The character "X" is not an acceptable "Close" icon. Go to fonts.google.com/icons and get yourself a real icon.

    • Your fake website in the background needs work too. Alignment issues (Your Site and the img on the left), and it looks wrong. Either make it more abstract / more skeleton or wireframe like or make it more real.

    • You have inconsistent font weights / line heights for text. Pick one and stick with it. (the paragraph below "Data rich bug reports..." and the list below "Integrations to track...")

    • There's a gear icon next to slack which is barely visible.

    • "Let's Chat" - the text is not aligned to the centre.

    • "Ready to get started? Choose a plan fits to your needs." Make the title bigger.

    • Cards: contrast issues. Black text hard to read, white button's outline is difficult to see with the gradient type background. The two cards have different shadows.

    • Final hero: put it in the centre. And put more padding below.

    The mobile version feels better put together overall, except for a few things.

    • Too much padding at the top between the menu and the h1.

    • Get early access needs to be centred.

    • The widget is too small in the first screenshot.

    • Final note, more debatable. Seeing how you've got quite a narrow wrapper around the whole page's content, you could add it to the menu at the top as well so it doesn't take up the whole screen's width.

    At first glance, it doesn't look too bad, but if I focus, there's loads of small spacing issues which really hurt the seriousness of the design. I don't know how you've used webflow, but it should make this kind of stuff pretty easy for you.

  15. 1
    • Your .org TLD suggests that you’re a nonprofit. Although your base plan is free, presumably the Growth plan will be paid and therefore you’re a for-profit business. I’d suggest picking almost any other TLD. Unfortunately, bugbash.___ is already taken for .com, .dev, and .app, but you could have .online or .biz, or you could change the name of your domain. (bugbash.io is available but extremely expensive, ~$700).
    • For the free plan, is the β€œup to 500 submission” on a per-month basis? If so, I’d be explicit about that.
    • The questions I always have about these widget integrations, and I never see the answer in the landing pages, is (a)Β how do I integrate it?, what information do I need to supply?, and is it easier for me to integrate it than to do it myself? In particular, when the widget takes some feedback, how can I associate it with a particular user or session, or even can I? (The demo shows what the user sees, but not what the developer sees.)
    • In the GIF of the demo, is the β€œHaving issues?” bubble always visible? Or is it prompted by an exception.
    1. 2

      Thanks so much for sharing detailed feedback!

      -You're correct, the free plan is up to 500 submissions/ month (which should be enough for most sites). I haven't thought of the .org issue but will take it into account if we end up getting a new domain!

      -For integration, we're currently working directly with our beta users, but it will involve copying some script to add the widget in. Once we open up the product to all users- will make sure it's really clear how to add.

      -If a user is logged in, that information should be collected! However if it's in the landing page, most likely they won't be associated unless you require an email field

      • "Having issues" is the current version! You can replace it with "feedback" or something else. And you can customize it to only show after certain actions! :)
  16. 1

    Nice landing page, feels clean and the messaging is clear.

    I would suggest swapping out the "your site" graphics with something that looks closer to a real website/app so people can see it in a real context, and an animated video/gif could take it even further.

    Also having the widget set up as a demo on the landing page would be super cool!

  17. 1

    Hey! Actually, I'm building a product regarding landing page creation. Yours looks sick tho! Would you be interested in taking part of the beta?
    This is our discord: https://discord.gg/8zasgq3sp5

    1. 1

      Haven't used discord much but just joined your channel!

      1. 1

        Oh nice! Could you give me your email please?

  18. 1

    This comment was deleted 4 years ago