StepShot Image Editor / Annotator for Confluence

• 

  Editor functionality: text, arrow, rectangle, etc!

• 

  All the annotations are saved on a separate layer - you can always edit annotations later.

• 

  Blur information that you don't want to share with others.

• 

  This is the same image file in both columns.

Inspiration

Previously, we (team behind StepShot) developed a plug-in, StepShot Step-by-Step Guides Creator, to automate the creation process for IT documentation; however, it was a little complicated to use for quick and simple tasks, such as taking a screenshot and adding some instructions on top of it. That’s why we decided to simplify the work process of thousands of IT professionals by creating StepShot Image Editor, which has all the necessary functions to annotate the images.

What it does

StepShot Image Editor allows its users to annotate images and add different content on top of them. Its main advantage is that it saves an annotation in a separate layer from the original file. There’s no need to create dozens of copies, which helps users to free up memory space. With the Image Editor’s help, you can draw lines, arrows, and rectangles; blur certain parts of an image; highlight text; and fill in shapes with color.

How we built it

We developed the Image Editor as a Confluence macro. It stores the original files and the annotation files as page attachments, which allows us to save data only within a customer’s Confluence instance. Such an approach ensures its privacy and integrity. Moreover, we built it for the Confluence Cloud and Server.

Challenges we ran into

So far, so good. The hardest part was selecting nice icons :)

Accomplishments that we're proud of

It is a unique solution that allows users to edit visuals within Confluence, both on the Confluence Server and Cloud.

What we learned

It’s always great to plan everything beforehand, but it’s not how things are usually done. The last minute hustle is what brings the idea to life.

What's next for StepShot Image Editor / Annotator for Confluence

We plan to enhance the Image Editor’s functionality by adding an option to capture screenshots in the Editor straight from Confluence itself.

Built With

• java
• javascript
• react