Document your AWS architecture with Cloudcraft and draw.io

Cloudcraft makes designing and estimating the cost of your AWS cloud architecture easy. You can securely connect cloud environments to components in your Cloudcraft architecture diagram to see statistics, resource information and more, all in real-time. It can even pull information and create a diagram automatically from your existing AWS account (you need to create a read-only user for Cloudcraft).

This makes monitoring your architecture, as well as planning for and costing changes, much easier than manually checking and pricing each component, and updating a more static diagram. Plus, the isometric view is certainly pretty for presentations when you need to secure architecture funding.

Why use draw.io for AWS diagrams?

If your system is already documented in Cloudcraft or another AWS tool, why would you want it in draw.io and Confluence or GitHub?

• Revisions to your AWS architecture may need to be documented for auditing purposes, especially to meet ISO information security standards.
• Project documentation should always include a ‘snapshot’ of your architecture, rather than a link to the live, current version of your visualized system.
• A draw.io diagram of your architecture in a central collaboration platform like Confluence is better for stakeholders to comment on and discuss transparently.
• Many people find 2D diagrams easier to read and understand than 3D diagrams, so you may find the draw.io versions better for onboarding or training purposes.

Import AWS architectures into draw.io via Cloudcraft

We had many requests at the last Atlassian Summit to support the import of AWS architecture diagrams into draw.io. You can now get those diagrams into draw.io easily via Cloudcraft.

In Cloudcraft, click Export > Export as 2D to draw.io and your exported diagram will load in the web version of draw.io in another tab.

You can then export this diagram as an XML file and save it in GitHub or copy the diagram to the draw.io macro on a page in Confluence.

Tip: Make sure you have allowed pop-ups in your browser!

AWS shape libraries in draw.io

The extensive AWS shape libraries in draw.io include both 3D and 2D versions of components, so you can choose which style you prefer. Enable these libraries by click on More Shapes at the bottom of the left panel, scroll down to the Networking section and enable the AWS and the AWS 3D shape libraries to see all of them.

Working with AWS diagrams in draw.io

Replace shapes: Cloudcraft exports to draw.io using a combination of 3D and 2D shapes, but you can easily replace them in your diagram. Click and drag the shape you want to use from the library over the shape in the diagram you want to replace. When you see the dark grey ‘replace’ icon, release your mouse button. See this tutorial exercise for more information about replacing shapes.

Group shapes: You can group shapes in draw.io so that you don’t need to move them all individually. When you move a group, the spacing and connections between them will remain consistent. Click and drag a selection box around all the shapes and text you want to group, right click and select Group, or use the keyboard shortcut Cmd+G (or Ctrl+G).

Rotate text: Select the text (or shape) you want to rotate, click and drag the black rotate icon to rotate the shape into any position. Alternatively, click the Vertical tool in the Text tab of the Format panel, or enter a new Angle in the Arrange tab of the Format panel. Read more about working with text and connectors, and rotating text and connector labels.

More information about AWS and visualizing architectures

There are many reference diagrams and use cases which will help you develop and visualize your architecture in Amazon’s Architecture Center as well as an extensive training section for people getting started with Amazon’s web services. There are also useful quick start ‘blueprints’, including implementing Confluence Data Center on AWS.