Made with

Garrett IA Diagrams with ConceptDraw DIAGRAM

Garrett IA diagrams are used at development of Internet-resources, in particulars at projecting of interactions of web-resource elements. The diagram of information architecture of the web resource which is constructed correctly with necessary details presents to developers the resource in comprehensible and visual way. Diagram contains the information about the structure and organization of the contents of the resource pages. The main task of such diagram is to give an idea on how the user surfs on the resource pages, performing a concrete task and not to describe the navigation structure as a whole. At the diagram creation it shouldn’t be overloaded with details and with description of each interface element, used at task execution. It is enough to denote resource objects which are used, for example, which pages the user downloads. It is not necessary to denote which buttons he presses to download the next page because the diagram may turn out too overloaded with details, too intricate and difficult for study and analysis.

The main concepts of Garrett IA diagram:

  • Path. The resource is presented in the form of paths by which the user moves during the execution of any task
  • Action. Moving along the resource pages, the user performs some actions- opens pages, downloads or sends data, etc.
  • Result. The system reacts to user’s actions, generating definite results – it downloads pages for users, generates forms, receives and sends data.

The main elements used at creation of Garrett IA diagram

Web-resource element Graphic presentation

Pay attention that the page on the diagram should correspond to the page displayed on the resource at browsing even if it consists of several HTML files or frames. On the contrary, files are only files which just displayed on the resource as links (downloaded documents, audio or video files, programs and so on) or simply used at the resource work, for instance background music and data base.

For indication of the group of pages of similar meaning (E.g. a catalogue of the production types) or the group of files (set of documents for downloading) use elements pagestack and filestack. You can use any convenient for you way of indication of concrete diagram elements- text signs and alphanumeric indications. Connections between elements on the diagram are represented as simple lines. As a rule, the diagram is constructed in the form of a tree as the usual web-resource has the treelike structure (start or main page on which links to other pages are located) however this way of representation is not obligatory. If on the diagram there are represented variants of usage of a resource by a user at the execution of different tasks and in the presence of definite access rights, then you can use different kinds of arrows to show the direction of user’s movement on the resource and elements inaccessible for this user.

For representation of simultaneous output of several results it is used the arrow with semicircular insertion.

If the structure of the resource is sufficiently complicated or connected elements on the diagram are located far from each other then you can use breaks in connectors so that not to draw the connector through the whole diagram. Breaks and continuations are denoted with square brackets with the denotation of the element to which the connector leads and, correspondingly, from which the connector leads.

In case of a resource usage by users with different levels of access (registered users, unregistered users, administrators, moderators, etc.) with the help of conventional connectors or arrows on the diagrams there are indicated variants of users work at the execution of definite conditions. Conventional connectors and arrows are represented in dotted lines. It is also possible the usage of the branchy structure with elements of selection of further action at the fulfillment or non fulfillment of the condition.

Element Graphic presentation
Element of selection of one of the two variants. (correct or incorrect input of login/password)
Element of selection of one of many variants (any menu)
Element of selection of one or more variants (filling out of forms or questionnaires)

Thus with the help of Garrett information architecture diagram you can completely and in details describe the structure of web-resource of any complication with necessary detailed elaboration and get the picture of possible work with the resource for users of different access levels.

Garrett IA Diagrams with ConceptDraw DIAGRAM  *


How to Draw EPC Diagram Quickly →

An event-driven process chain diagram is a flowchart used in business process analysis. It evolved from Architecture of Integrated Information Systems (ARIS) and utilised in the business process improvement and analysis. It is also used to facilitate enterprise resource planning. An EPC diagram is a complex flowchart that shows different business processes through various workflows. The workflows are seen as functions and events that are connected by different teams or people, as well as tasks that allow business processes to be executed. ConceptDraw DIAGRAM is a software for making EPC diagrams that allows managers visually present business process models for making decisions for business.How to Draw EPC Diagram Quickly *
Picture: How to Draw EPC Diagram Quickly
Related Solution:

Information Technology Architecture →

ConceptDraw DIAGRAM extended with Enterprise Architecture Diagrams Solution from the Management Area is a powerful software which provides a set of helpful tools for designing Information Technology Architecture.Information Technology Architecture *
Picture: Information Technology Architecture
Related Solution:

Pyramid Diagram →

ConceptDraw Pyramid Diagram software allows drawing column charts using predesigned objects or drawing tools.Pyramid Diagram *
Picture: Pyramid Diagram
Related Solutions:

Multi Layer Venn Diagram. Venn Diagram Example →

To visualize the relationships between subsets of the universal set you can use Venn diagrams. To construct one, you should divide the plane into a number of cells using n figures. Each figure in the chart represents a single set of, and n is the number of represented sets. Splitting is done in a way that there is one and only one cell for any set of these figures, the points of which belong to all the figures from the set and do not belong to others. The plane on which the figures are represented, is the universal set U. Thus, the point which does not belong to any of the figures, belongs only to U.Multi Layer Venn Diagram. <br>Venn Diagram Example *
Picture: Multi Layer Venn Diagram. Venn Diagram Example
Related Solution:

Types of Flowcharts →

A flowchart is a simple but very functional tool when it comes to understanding a workflow or to removing unnecessary stages from a process. When drawing flowcharts, keep in mind that there are four common types of flowcharts, like document flowcharts and data flowcharts that show control over a data or document flow over a system. To show controls on a physical level, use system flowcharts. In addition, to show controls in a program, you can draw a program flowchart. This flowchart diagram represents the piece of an article editing process, that involves the author and editor. It was created using the Basic Flowchart notation that consists from the basic flowchart symbols. The start and the end of the process are indicated with "Terminator" symbols. The "Process" symbols show the action steps consisting from making edits and searching for a compromise, when the author does not agree with the suggestions of the editor. The "Process" symbol is the general symbol in process flowcharts. The "Decision" symbol indicates a branching in the process flow. There are two branches indicated by a Decision shape in the current flowchart (Yes/No, Disagree/Agree). This basic flowchart can be used as a repeating unit in the workflow diagram describing the working process of some editorial office.Types of Flowcharts *
Picture: Types of Flowcharts
Related Solution:

How to draw Metro Map style infographics? (New York) →

How to draw Metro Map style infographics of New York subway. New York Subway has a long history starting on October 27, 1904. Since the opening many agencies have provided schemes of the subway system. At present time are 34 lines in use. This page present New York City subway map construct with Metro Map Solution in Conceptdraw DIAGRAM software. This is a one-click tool to add stations to the map. It lets you control the direction in which you create new stations, change lengths, and add text labels and icons. It contains Lines, Stations, and Landmarks objectsHow to draw Metro Map style infographics?   <i>(New York)</i> *
Picture: How to draw Metro Map style infographics? (New York)
Related Solution:

Examples of Flowcharts, Org Charts and More →

There are numerous articles about the advantages of flowcharting, creating business graphics and developing different charts. Nevertheless, these articles are almost useless without the main component - the examples of flowcharts, org charts and without a fine example, it is difficult to get all the conveniences of creating diagrams. You can find tons of templates and vivid examples on Solution Park. This illustration shows a variety of business diagrams that can be created using ConceptDraw DIAGRAM. It comprises a different fields of business activities: management, marketing, networking, software and database development along with design of infographics and business illustrations. ConceptDraw DIAGRAM provides a huge set of sample drawings including business process modeling diagrams,, network diagrams, UML diagrams, orgcharts, DFD, flowcharts, ERD, geographical maps and more.Examples of Flowcharts, Org Charts and More *
Picture: Examples of Flowcharts, Org Charts and More
Related Solution:

Data Flow Diagram (DFD) →

In software engineering, it is important to understand how the system would cooperate with external sources, like data sources. To give this information a visual representation, data flow diagrams (DFD) were used for years. The entire system is usually divided into smaller ones, and all of them process data flows in appropriate ways. The visualizing business processes which engages the data transfer, is commonly preformed using DFDs (data flow diagrams). DFD is used to show the data flow processing and transformation. This DFD represents the electronic system of a customer purchase. It was created using Gane/Sarson notation. Data flow diagrams helps you to sort through and clarify transferring process making it available for analysis, and representation. ConceptDraw DFD solution introduces the vector library, containing the full set of icons from DFD notations.Data Flow Diagram (DFD) *
Picture: Data Flow Diagram (DFD)
Related Solution: