Tools for Internet Product Managers

Monday, August 27, 2012

Hi all,
This post will be pretty much straight forward and will present the tools I use in my everyday work and can help anyone managing internet products.
I don't have any incentive for you to use them except for my pure advice to you.
Ohh and these tools... they are FREE

UI/UX are very important in every product, here are some tools that will help you in your work through design.

The most important tool to pass the idea in your mind to the engineering teams.
There are plenty of good and free tools out there, some are available online and some are downloadable clients.
Here are 2 good ones: mockflow, mockingbird

Pixel Ruler (download page):
This simple but efficient ruler allows you to measure up to a single pixel, and see if components are aligned.

Left mouse click will switch between horizontal and vertical, right click will close it.

Greenshot (download page):
A free open source tool for capturing screen images.
The tool allows you easily obfuscate sections of the image you don't want to expose.
You can add captions and draw basic chart forms (arrows, box, etc.).
It simply catches the standard printscreen command from your keyboard.

GIMP (download page):
Your designer most likely works with Photoshop, but in cases where you want or need to get your hands dirty with visual design, GIMP is your solution.
Gimp is an image manipulation program, think of it as a free version of Photoshop with many features, some basic compared to Photoshop and some pretty close.
I wouldn't say it's a fair substitute to Photoshop but some might disagree, either way it's a great open source tool.
In addition it's not too intuitive for those unfamiliar with design programs, hence consider some learning hours when trying it out.


Fiddler (download page):
No internet professional's working station should be found without this web debugger.
Fiddler monitors all the calls and replies to/from the client and shows you everything you can ask for in regards to each call like response code, headers, cookies and much more.

JsonViewer (download page):
Don't try to read a long JSON string. use this simple tool where you enter the text and immediately can navigate through the items in a hierarchical form.

XML Formatter - Notepad++ plugin (download page):
Easy tool to work with XML, just install the plugin and you can get it to beautify the tags which will make your work easier.

CookieManager (download page):
Simply, view, edit, delete existing cookies.
Cookie manager is an add on for Fire Fox (tools -> Cookie Manager).
Very useful when you need to manipulate a cookie for tests with your own data or test data.

FireBug (download):
Another development handy tool, which you as a product manager might not use to it's full power.
FireBug is a FireFox extension which allows to you to get or set (inspect) any parameter on the current HTML page.
You can use it to understand how other pages are doing what they do, see the effect of style and layout change immediately, make sure the page is built with the right settings, monitor performance and much more.

ChromeBug (download page):
Let's make it simple, it's FireBug for Chrome.

Inspect element:
You might not need FireBug or ChromeBug for your work at all.
Why? well, first Chrome includes this feature and so do the latest FF versions, so it's you choice which one works better for you.

In FireFox and Chrome you need to right click the element and select Inspect Element, in Internet Explorer (IE 8 and above), you will have to turn on the developers tools (F12) and select the arrow icon and point the element on the site.
This option will enable you to inspect, see real-time affect on style and layout changes.

I hope you find this post useful, please comment if you believe other alternatives are better or in case I am missing a tool in the above toolbox,