Viewing posts by Gregor Dorfbauer.

To be honest it all started as a joke when this tweet became one of the most popular in the IT world. I am sure you know it:


The problem

The truth is everybody needs to do multitasking today. The real cost of it  is hidden, but you’ll definitely lose at least 40% of your productivity if you are constantly switching between apps. Let’s try and do some other stuff in between. 🙂

40%: This is too much!


Heroku is among the best cloud application platforms on the web and lets app developers spend their time on their application code, not managing servers, deployment, ongoing operations, or scaling. It allows for agile deployment for Ruby, Node.js, Clojure, Java, Python, and Scala – up and running in minutes. Of course, a full git support is included. No hassling around with servers, instances, or VMs again.

Plus, Heroku is not only a cloud platform but maintains and curates an avid ecosystem of Add-Ons. Usersnap was recently added to this Add-on ecosystem: Usersnap add-on for Heroku. Rather than using Usersnap as a separate service to make your life as a developer a whole lot easier you can now simply add it as Heroku Add-on. You will get screenshots during your development process to fix bugs faster and have more time working on new features!

Adding the Usersnap add-on for Heroku

It’s easy to attach Usersnap to a Heroku application via the command line interface:

$ heroku addons:add usersnap

Trello is a fast, easy way to organize anything, from your day-to-day work, to a favorite side project. Trello is everywhere – on Android, iPhone, iPad, Windows 8 Tablet, and your web browser, making collaboration easier.

Usersnap integrates well with Trello, assisting you in collecting and discussing feedback between developers, customers and quality assurance engineers.

Working on a web project?

Getting annotated screenshots attached to bug reports will raise a smile on every developer’s face. Usersnap allows your testers to provide a visual description of what might be a bug in form of annotated screenshots. Additionally you will get important information such as the used browser, the used operating system and the URL where the bug has occurred. Your testers can choose between a drawing pen, a highlighting tool and sticky notes to illustrate and annotate the bug report. To enable Usersnap on your web project, a snippet of code has to be added, which is as simple as installing Google Analytics (TM). After that, a feedback-button appears and one can collect bug reports directly in Trello.

Usersnap can be integrated easily to any type of web page. The Usersnap help page offers an overview of how to integrate Usersnap in your site using a simple JavaScript snippet. We offer various CMS plugins for WordPress, Drupal or Joomla – but it doesn’t end there!
If you want to customize your Usersnap integration – for example: show it only to logged-in users, or add additional backend information to the report – you need to include Usersnap manually in your template. Are you a PHP, Python or RoR dev? Then you’re in luck, as we describe how to integrate Usersnap using those languages in this post! Speed up your development workflow!

Include Usersnap with PHP

Save your Usersnap snippet in a file called, which includes your API-Key. You can even fetch this API key from an config file or environment variable.

TYPO3 is an enterprise-class, open source content management system, used to build and manage websites of all types. One of the great things about TYPO3 is that one can add new types of content elements fairly easily. Say, for instance, a feedback button for your visitors and customers. We are working on a plugin, but in the meantime, here are the needed steps to include Usersnap – the visual bug tracker for web development – into your Typo3 site:

  1. Log into your backend
  2. Left Menu: Click on “Template”
  3. Select your start page (earth icon)
  4. Select “Info/Modify” in the Dropdown menu of the template
  5. Click on the edit button next to setup (pencil icon) – it’s the last entry in the table
  6. A editor opens, insert this code (with your Usersnap snippet) at the end:

At Usersnap, we have over 20 (summed up) years of experience in well organized web development. We figured that track record allows us to call out the good, bad and the ugly in the industry. Now, working in web development can be rewarding, challenging and overall awesome, but the programming world has its dark side too (and no, there are no cookies).

At Usersnap, we have over 20 (summed up) years of experience in well organized web development. We figured that track record allows us to call out the good, bad and the ugly in the industry. Now, we don’t like to focus on the negative, but just this once we’ll sum up the bad, as the logical follow-up on our post on best practices in web development.

1. Mails with 20 bullet points

Mails with 20 bullet points, listing bugs, feature request and what not, are as much a commodity as a problem. Often they lead to accusations and “why didn’t you fix $XY, as I pointed out five weeks ago?”-s. In case your head of development is not able to drill these monologues down to workable tickets, chances are you forget things. Instead of muttering all kinds of things your mother didn’t teach you, try and educate your clients or managers how to use a bug tracker or project management tool.* That way you both save time sending countless lengthy emails, and they’ll have a better view of what you’re currently working on.

2. CC’ing the whole team

CC’ing all means: you have no idea who can solve this task. Which is bad in itself. If you start doing this, potentially no one will answer or feel responsible. Plus: reading all those mails will kill a lot of precious time for those who are not into it. Find out who is responsible and address that person only.

At Usersnap, we have over 20 (summed up) years of experience in well organized web development. We figured that track record allows us to call out the good, the bad and the ugly in the industry. Let’s start with the positive stuff.

1. Use a bug tracker

The inbox of a Head of Development tends to fill up over the day with feature requests, bug reports and snippets of user feedback. Sometimes you’ll even receive emails with a whole bullet point list (if you’re lucky) of requirements, pain points and random ideas. While it’s great that people take the time to give – at times very extended – feedback, it’s not really useful as is.

Using a bug tracker / project management solution like Basecamp or Trac you can reorder tickets and nothing gets lost, as tasks are only closed when they are done. Set a milestone, add keywords (so your co-workers can find your ticket easily), add a priority level and make sure to cc the person in charge of ‘fixing it’. Even if that’s yours truly. In the description, try to provide a user story. And make sure your summary is descriptive, you can use humor for your commit messages if you really have to (i.e.: when it’s done), but you’ll want your ticket to be clear.

2. Take responsibility

Be precise and targeted. You should know who can do what and who is available for an additional task. When in real doubt about who’s responsible, you can do a CC. But make sure to remove all others from the CC, as soon as you found the right person to assign the ticket to.