Create a Basic Architecture Diagram

Learning Objectives: using dynamic features to experience the value of Dragon1

In this module we will walk you through step by step how to create a basic Architecture Diagram.

In this tutorial we will not create a static diagram, but a dynamic diagram. That means the visualization (diagram) will show the data of a model. And if that data changes, the model and the visualization changes.

This tutorial is about using the Architecture Repository and Visual Designer web applications and not about learning Enterprise Architecture. So the focus will lay on performing/doing actions in these web applications.

application architecture requirements diagram example

This is an example of a dragon1 architecture diagram. It shows a part of the strategy (stakeholders, requirements) and a part of the architecture (applications, software, and their relationships).

First, we define the result to be produced: a dynamic Architecture Diagram.

As defined a Dragon1 architecture diagram is only an architecture diagram if it contains strategy entities (an owner/client, stakeholders, needs, requirements), architecture entities ( functions, structure, concepts, principles, elements and components) and transformation entities (programs, projects, milestones, deliverables). The diagram above is almost such an architecture diagram (except for the transformation part).

Features To Be Used

In order to create this dynamic architecture diagram you as user need to make use of certain features on Dragon1. Every feature is accessible via menu buttons and drop down menu items.

The Tutorial

Now follows this step-by-step guide to create an exact copy of the diagram above:

  1. Create Cabinet 'TestCabinet'
  2. Create Dossier 'TestDossier'
  3. Create Folders 'Data', 'Models', 'Views' and 'Visualizations'
  4. Create Sub Folders 'Strategy', 'Architecture', 'Transformation' in Data, 'Relationships' in Models and 'Visual Items' in Visualizations.
  5. Insert Entities Owner/Client, Stakeholder1, etc.. in the Data Sub Folders. Use the ^ as name separator in the name field to enter several entities at once.
  6. Insert a new Model 'MyArchitectureModel' in folder Models
  7. Drag the entities from the Explorer onto the Model Canvas
  8. Check if the shapes are linked to the entities correctly
  9. Draw relationships between stakeholders and requirements, between objects and applications, between applications and software, between software and hardware entities.
  10. If you switch the player to Normal mode and check the trace box, you will see tracking and tracing for the model with a mouse over on the shapes.
  11. If you change the name or title of a data item, you will see in the normal mode that the name or title of the shape changes.
  12. Now insert a Visualization
  13. Insert a Visual Item on the visualization canvas and configure it by configuring the data attributes:
    • Rule Event: onload
    • Rule Condition:Entityclass=Model;Entityid=[id of the model];
    • Rule Action: generatemodel
    You can find the Id of the model using a mouse over on the model-node in the treeview. Next you need to uplink the visual item to the visualization. Fill in autoshow2 in the popup field on the 'Extra' tab of the New Edit Dialog
  14. Select the visualization in the folder and switch to Normal mode. Now you see the visual item on the canvas being interpreted and the visualization shows / generates the model.
  15. You can position the generated entities and change their colors via the Inspector.
  16. You can also change position and color of shapes via action script at visualization and visual item level. In the New Edit Dialog of the Visualization or visual item on the behavior tab in the action script field, fill in the following and the entity will turn green:
    • scColorEntity([entityid], [entityname], [bordercolor], [fillcolor]); Either use the id or the name (the name does not need to be unique)
    You can position an entity by using scPositionEntity like this:
    • scPositionEntity([entityid], [entityname], x, y);
    You can look up the id of the entity in the Explorer.
  17. To publish the diagram in the content viewer you need to change the publication status of the diagram (visualization) to published publicly, meaning that everyone who is logged into your account and goes to the content viewer can access the visualization.
  18. To share your diagram worldwide in channel: Select the diagram in the explorer and click on share. Fill in a title and text and choose a channel, to publish the diagram in. Click OK. You now have shared your diagram in a channel.
  19. Be sure to create different versions of your diagram.
  20. If you want to create a diagram in collaboration, change the publication status to published private.

Part II

With this one model you can create many different views. For instance, a view with all stakeholders, or with all requirements and with all applications. And if you click on a stakeholder, requirements or application, you could decide to go to a detailed view showing only the related entities to that selected entities. For instance a detailed view of a stakeholder to show its requirements and the applications that are impacted.

Follow the next steps to create generated and clickable views only (even without visualization):

  • Create a view with the name Stakeholders Overview
  • Setup the view for showing only the stakeholders from the model Setup a rule in the New Edit dialog for the view:
    • Rule Event:onload;onclick
    • Rule Condition:Entityclass=Stakeholder
    • Rule Action:showshape(name);showview(relatedto)
  • If you select this view and click on a shape, you will be forwarded to a generated view of related items for that view
  • What you now could do is create a Visualization and call it Stakeholder Onion Diagram and link the view to that diagram and position the stakeholder in rings on the diagram
  • We will now create another view showing not impact applications
  • Create a view with the name Application Dependencies View
  • Setup the view for showing only the stakeholder. Setup a rule in the New Edit dialog for the view:
    • Rule Event:onload;
    • Rule Condition:Entityclass=Application;NotRelatedToEntityClass(Requirements)
    • Rule Action:showshape(name);changeshapecolor(red,yellow,purple);
    • Now you have a view showing for which applications no requirements are defined.

Here ends our tutorial for creating a Basic Architecture Diagram. We hope you have enjoyed it!