Overview

This AWS Diagram UI Kit offers a powerful toolset designed to simplify the creation of cloud architecture diagrams. Featuring a comprehensive collection of AWS icons and components, this kit enables developers, designers, and cloud professionals to quickly and accurately visualize and communicate complex cloud infrastructures.

UI Kit Link: https://www.figma.com/community/file/1270646590275827451

Problem

When I was exploring cloud technology (AWS) for a project, I needed to create cloud architecture designs. While there are many tools available for architecture design, some are complex, expensive, and require significant time to learn, with limited customization options.

Solution

As a product designer, I decided to create a UI Kit that simplifies cloud architecture design, making it accessible for everyone to use and share.

• Timeline: 1 Week

UI KIT Design

The process of creating this UI kit was intentionally kept simple to avoid unnecessary complexity. First, I gathered all AWS service icons in SVG format and organized them into groups based on the services, ensuring proper naming conventions. I created a page labeled "Playground" with clear instructions to guide new users on how to effectively use the kit.

Additionally, I recommended two plugins for the design: Simpleflow for connecting components and Deck to convert the designs into PowerPoint format, allowing users to seamlessly integrate them into presentations for easy sharing.

Outcome

After publishing the UI Kit on Figma, the results were as expected.

• It quickly became one of the most popular AWS diagram UI kits and gained visibility on Google. Over 2,000 people have duplicated it in the Figma community.
• The simplicity of the kit received positive feedback from AWS communities, cloud engineers, software developers, architects, and DevOps professionals.