1

I would like to create a nice html tutorial containing images on how to use some features of software I develop. What I need is to draw over a screenshot, some free-shaped ovals (handdrawn styled) and few explanations.

What software could help me doing that?

Improve this question
  • 5
    That very much depends on what OS the software should run on, Dennis. Could you please edit your question to include that? And while being on it: a list of requirements (must-have, nice-to-have) would be helpful as well. For a guide, you might wish to take a look at What is required for a question to contain "enough information"? Thanks! – Izzy♦ Sep 12 '14 at 11:20
  • 1
    It also depends on how you are writing the tutorial. Annotating images could be nicely done in MS Word using shapes and textboxes plus the grouping option, or using TikZ with overlay if you're writing it in LaTeX, and the list goes on. Please provide more information – Tymric Sep 12 '14 at 11:38
  • 1
    @Timmy I am writing tutorials for web,so it's an HTML document. But I would like this tutorial to be illustrated and for that purpose I am going to take a few screenshots and would like to emphasise some features using handdrawn-style ovals and some text. – Denis Kulagin Sep 12 '14 at 12:23
  • You will definitely benefit from StepShot.net, the tool we are developing. It's like Problem Steps Recorder, but usable. Click start sequence capturing, and it will capture an annotated list of screenshots with the cursor that you will be able to finalize and export as Word, PDF, HTML, or bulk of images. – Sasha Reminnyi May 17 '16 at 17:13
1

`snag-it' software is great for capturing images and adding notes, you could then add these images to your documentation.

Improve this answer
  • I recommend snagit as well. I specifically like version 8. It seems they started to go downhill after version 8. Luckily, they let you use old versions on their when you buy a recent license. They also discount for non profits. – Sun Sep 13 '14 at 3:24
  • 2
    Dan, could you please edit your answer and include some more details? A link would be helpful, for example, and also some hints how it meets the requirements (e.g. "free-shaped ovals" and "draw over a screenshot" in general). – Izzy♦ Sep 13 '14 at 14:49
1

Greenshot is a screenshot tool that also doubles as a great screenshot editor. You can take your screenshots with it, or open existing screenshots.

The Greenshot editor has many features, including:

  • Lines

  • Circles/Ellipse

  • Arrows

  • Text

  • Freehand

  • Cropping

  • Obfuscation

  • and more!

enter image description here enter image description here

Click for bigger image.

Improve this answer
1

Any image editing software will do:

  • MS paint, i hate this program but it is perfectly suitable for the task you need. You can draw rectangles and ellipses then type text in those shapes. Best thing about this program is that it is already installed on your computer unless you have a stripped down version of Windows.

  • Photoshop, I love this tool but it is major overkill for your task and it comes at a price. It is a very professional photo editing program.

  • The Gimp, much like photoshop so it's overkill again but this tool is open source and therefor completely free.

  • Paint.NET is like classic MS paint but with a lot of extra options and more user friendly.

With these tools you have all the freedom you have, from basic annotation to creating your own stylized text baloons. Add anything you want to your images.

Improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.