Complete guide

Detailed user manual for ER Designer: from the board to restructuring, from the logical schema to class management.
Home

Introduction

ER Designer is a web platform designed for teaching and learning database design. It allows you to create complete Entity-Relationship (ER) diagrams, perform database restructuring, and generate the logical schema, all in one environment.

The platform is designed for three types of users: teachers who want to assign exercises and monitor student work, students who need to complete assignments and submit their work, and independent users who simply want to design a database.

This guide covers all the features of the platform, from creating a project to generating the logical schema, including class and assignment management.

ER Designer illustration
Board Roles Export
Tip
If you cannot see a menu entry (Classes, Teacher, Admin), you probably haven't activated the corresponding role yet. Go to "Edit account" and check your profiles.
Introductory video

Get started

Want to start in 2 minutes? Follow these steps to create your first ER diagram.

1
Register or sign in
Go to the Login page and sign in with email/password or with your Google or GitHub account.
2
Create a project
From the "Project" section, click "Create new project". Enter a name and choose the diagram style.
3
Draw the diagram
Use the toolbar buttons to add entities, relationships and generalizations. Connect them with the "Link" tool.
4
Configure properties
Select an element and use the "Properties" panel on the left to edit name, attributes, keys and cardinalities.
5
Export or submit
Export the diagram to PNG, PDF or JSON. If you are working on an assignment, use the "Submit" button to send your work to the teacher.
Recommended method
Tip: work in blocks. First entities, then relationships, then attributes and cardinalities, finally generalizations.
Fit / Zoom
If the diagram goes off screen, use the Fit/Zoom/Center buttons to reframe it.
Video: Quick start in 2 minutes

Roles & activation

ER Designer enables different features depending on the user's role. Some roles can be activated from the "Edit account" page, others require administrator approval.

Role Unlocks How to activate
ROLE_USERProject management and board (create, open, save, export).Base role, automatically active after registration or login.
ROLE_STUDENT"Classes" menu, access to assigned work, submission of assignments.Go to "Edit account" and enable the "Student profile".
ROLE_TEACHER"Teacher" menu, class creation, assignment management, submission monitoring.Go to "Edit account" and submit a teacher profile request. It will be reviewed by an administrator.
ROLE_ADMINAdministration panels (user management, teacher request approval).Manually assigned by a system administrator only.

Details for each role

  • User (ROLE_USER): After registration or OAuth login, you can create and manage your projects in the "Project" section. You can draw ER diagrams, export and import them.
  • Student (ROLE_STUDENT): Enable the student profile from the "Edit account" page. After activation, the "Classes" menu entry will appear, allowing you to join teacher classes, view assigned work and submit your assignments.
  • Teacher (ROLE_TEACHER): Request teacher role activation by filling out the form in "Edit account" (school type, institution, subject taught). Until the request is approved by an admin, the "Teacher" menu entry may not appear.
  • Administrator (ROLE_ADMIN): The admin can approve or reject teacher activation requests, manage users, modify assigned roles, and enable or disable accounts.
Menu entries by role
Project: USER / TEACHER / ADMIN | Classes: STUDENT | Teacher: TEACHER / ADMIN | Admin: ADMIN
Video: how to activate roles

Login & account

To access ER Designer you can register with email and password or use quick login via Google or GitHub (OAuth).

  1. Go to the "Login" page from the main menu.
  2. Choose whether to sign in with credentials (email/password) or with an OAuth provider (Google, GitHub).
  3. If you are a new user, click "Register" to create an account.
  4. After login, open "Edit account" to complete your profile and activate roles (student, teacher).

Change password

You can change your password from the "Edit account" section. Enter your current password and the new one.

Tips
  • Changing the language from the menu updates texts without leaving the current page.
  • If you don't see a menu entry, check your active roles in your account from the "Edit account" page.
Video: registration and login

Project management

Projects are the main container for your work. Each project contains an ER diagram and, optionally, the restructured diagram and the logical schema.

Creating a new project

  1. Open "Project" from the menu and click "Create new project".
  2. Enter a name for the project.
  3. Choose the diagram style: Classic (attributes as text inside entities), Oval (attributes represented as ovals), or Tabular (direct tabular schema).
  4. Click "Create" to open the board.

Managing existing projects

From the "Manage projects" page you can open, rename or delete your projects. Each project shows the last modification date.

Importing a project

You can import a project from a previously exported JSON file. The file will be loaded and the diagram will appear on the board.

Video: project management

The ER board

The board is the main workspace where you draw the Entity-Relationship diagram. It is an interactive canvas where you can add, connect and edit all schema elements.

The toolbar at the top contains all necessary commands: adding elements, connecting them, exporting, importing, undo/redo and much more.

Board tools

The toolbar at the top offers the following commands:

  • Entity: adds a new entity rectangle to the board. Click the button then click on the board to place it.
  • Relationship: adds a new relationship diamond. Works like the Entity button.
  • ISA (Generalization): adds a triangle to represent a generalization. Only available in the original diagram (not in the restructured one).
  • Link: activates linking mode. Click on a source element then on the target element to create a connection.
  • Select: default mode. Click on an element to select it and edit its properties, or drag it to move it.
  • Undo (Ctrl+Z): undoes the last action.
  • Redo (Ctrl+Y): redoes the last undone action.
  • Clear: removes all elements from the board (with confirmation).
Video: toolbar overview

Entities & attributes

Entities are represented as rectangles on the board. Each entity has a name and can have one or more attributes.

To add an entity, click the "Entity" button in the toolbar then click on the board at the desired position.

The entity name can be edited from the Properties panel or directly by double-clicking on the entity. The name is limited to 30 characters and, if too long, the font is automatically reduced.

Attributes

Attributes are added from the Properties panel by clicking the "+ Attribute" button. Each attribute has a name and can be configured as:

  • Primary key (PK): the attribute is underlined in the schema.
  • Composite: the attribute contains sub-attributes and is represented with an oval (in classic mode) or with nested sub-entries.
  • Multivalued: the attribute can have multiple values and is shown with a double border.

Use the "Relayout" button to automatically reposition attributes around the entity.

Video: entities and attributes

Relationships & cardinalities

Relationships are represented as diamonds on the board. They connect two or more entities and define how database elements are associated with each other.

To add a relationship, click the "Relationship" button then click on the board. To connect the relationship to entities, use the "Link" tool.

The relationship name is limited to 20 characters. If the text is too long, it is automatically adapted.

Cardinalities

Cardinality defines how many elements of one entity can be associated with how many elements of the other entity. It is set from the Properties panel by selecting the link between an entity and a relationship.

  • Minimum cardinality: indicates the minimum number of associations (typically 0 or 1).
  • Maximum cardinality: indicates the maximum number of associations (typically 1 or N).
Esempi
Common examples: (0,1) optional participation with at most one, (1,1) mandatory participation with exactly one, (0,N) optional participation with many, (1,N) mandatory participation with many.

Relationships can also have their own attributes, added in the same way as entity attributes.

Video: relationships and cardinalities

Generalizations (ISA)

A generalization (ISA) represents an "is a" relationship between a parent entity and one or more child entities. It is represented as a triangle on the board.

To add a generalization, click the "ISA" button then place it on the board. Connect the parent entity (on top) and child entities (below) with the "Link" tool.

Types of generalization

  • Total: every instance of the parent entity must belong to at least one child entity.
  • Partial: an instance of the parent entity may not belong to any child entity.
  • Exclusive (disjoint): each instance can belong to at most one child entity.
  • Overlapping: an instance can belong to multiple child entities at the same time.
Generalization is only available in the original diagram. During restructuring, generalizations are automatically resolved.
Video: ISA generalizations

Properties panel

The Properties panel appears on the left when you select an element on the board. It shows only the fields relevant to the selected element type.

  • For entities: name, add attribute button, attribute list with options (key, composite, multivalued), relayout button, delete button.
  • For relationships: name, relationship attributes, delete button.
  • For links: minimum and maximum cardinality for each side of the link.
  • For generalizations: type (total/partial, exclusive/overlapping).
Tips
Tip: you can also edit entity and relationship names directly on the board by double-clicking.

Export & import

ER Designer offers several options for exporting and importing your work.

Export JSON
Exports the complete schema in JSON format. This file contains all diagram data and can be re-imported later. Useful for backups or sharing the project.
Export PNG
Generates a PNG image of the diagram. Ideal for including the schema in documents or presentations.
Export PDF
Generates a PDF document of the diagram. Perfect for submitting assignments or printing.

Import JSON

Imports a previously exported JSON file. The diagram contained in the file will replace the current one on the board.

Video: exporting and importing

Keyboard shortcuts

Ctrl+ZCtrl+Z - Undo the last action
Ctrl+YCtrl+Y - Redo the last undone action
CancDelete / Backspace - Delete the selected element
Tip: shortcuts work when focus is on the board (not on a text field).

Diagram styles

ER Designer offers three different styles for representing the ER diagram. The style is chosen when creating the project but can be changed at any time from the toolbar via the "Style" button.

Classic style
Attributes are shown as text inside the entity rectangle. This is the most compact and traditional style, suitable when there are many elements on the schema.
Oval style
Every attribute (including simple ones) is represented as an oval connected to the entity or relationship. This is the style most faithful to the classic academic ER model notation.
Tabular style (Direct Logical Schema)
Entities are represented as tables with columns. There are no relationship diamonds: connections between tables are direct with cardinality notation. This style is useful when you want to work directly with a representation close to the logical schema.

To change style while working, click the "Style" button (gear icon) in the toolbar. The schema will be automatically adapted.

Video: diagram styles

Database restructuring

Restructuring is the process that transforms the conceptual ER schema into an optimized schema, ready for translation into a logical schema. ER Designer offers automatic guidance for this process.

Starting restructuring

From the original diagram, click the "Restructure" button in the toolbar. The system will analyze your schema and apply the necessary transformations.

What restructuring does

  • Generalization elimination: ISA hierarchies are resolved, transforming parent and child entities into structures without generalization.
  • Multivalued attribute elimination: replaced with separate entities connected by relationships.
  • Composite attribute elimination: flattened into simple attributes.
  • Redundancy analysis and path optimization.

Navigating between views

After restructuring, three tabs appear in the top bar: "Diagram" (original schema), "Restructured" (restructured schema) and "Logical Schema" (generated from the restructured). You can switch between views at any time.

Note: the restructured diagram is a separate copy. Changes to the original diagram are not automatically propagated to the restructured one and vice versa.
Video: step-by-step restructuring

Logical schema

The logical schema is the translation of the restructured ER schema into the relational model. ER Designer can generate the logical schema both in textual and graphic form.

Textual logical schema

The textual logical schema shows tables with their fields in a readable text format. It is automatically generated from the restructured diagram.

To generate the textual logical schema, go to the "Restructured" or "Logical Schema" view and click the "Logical Schema" button in the toolbar.

Schema format

Each table is shown with:

  • Primary keys are indicated with an underlined asterisk (*).
  • Foreign keys are indicated with an asterisk (*) and a reference to the source table.
  • Other attributes are listed normally.

A legend at the bottom explains the symbols used: underlined * = primary key, * = foreign key.

Video: generating the textual logical schema

Graphic logical schema (tabular)

The graphic logical schema represents tables as rectangles with listed columns, connected by lines indicating relationships between tables.

The graphic logical schema is automatically generated when you switch to the "Logical Schema" view after restructuring the diagram.

Cardinality notation

Connections between tables use "crow's foot" notation:

  • A vertical bar (|) indicates participation with maximum cardinality 1.
  • Three fan-out lines ("crow's foot") indicate participation with maximum cardinality N.
  • A small circle (O) indicates minimum cardinality 0 (optional participation).
  • A bar (|) on the opposite side indicates minimum cardinality 1 (mandatory participation).
Video: the graphic logical schema

Classes (Student)

The "Classes" section is available after enabling the student profile. It allows you to join classes created by teachers, view assignments and submit your work.

Joining a class

  1. Open "Classes" from the menu and click "Join a class".
  2. Enter the class code provided by the teacher.
  3. After joining, the class will appear in the "My classes" list.

Viewing assignments

Open a class to see the assignments set by the teacher. For each assignment you can read the description, download any attachments and create the linked project.

Creating the assignment project

Click on the assignment then on "Create project" to open a pre-configured board for that assignment. The project will be automatically linked to the assignment and you can submit it when done.

Video: joining a class and completing an assignment

Assignments (Teacher)

The "Teacher" section is available after teacher profile approval. It allows you to create classes, assign work to students and monitor submissions.

Creating a class

  1. Open "Teacher" from the menu.
  2. Click "Create class" and enter the name.
  3. Share the class code with your students so they can join.

Assigning work

  1. From "Teacher", click "New assignment".
  2. Select the class to assign the work to.
  3. Enter title, description and, if needed, attachments (briefs, support material).
  4. Save the assignment: it will be immediately visible to the class students.

Monitoring submissions

From the "Student work" section you can see the submission status of each student: who has submitted, who is still working. You can open student projects to view them and you can reopen a submitted project to allow further edits.

Exercise library

ER Designer includes a ready-to-use exercise library that you can assign directly to your classes, saving time in material preparation.

Video: managing classes and assignments as a teacher

Submission (Student)

When you have completed an assignment, you can submit your project to the teacher.

How to submit

  1. Open the project linked to the assignment.
  2. Verify that the diagram is complete and correct.
  3. Click the "Submit" button in the toolbar (send icon).
  4. Confirm the submission in the modal window that will appear.

Important rules

  • After submission, the project becomes read-only. You will no longer be able to edit the diagram.
  • You can still export the project to PDF or PNG even after submission.
  • Only the teacher can reopen a submitted project to allow you to make changes.
  • An indicator "Project submitted: not editable" will appear in the toolbar after submission.
Video: how to submit an assignment

Administration

Administration features are available exclusively to users with the ADMIN role.

Approving teacher requests

When a user requests the teacher profile, the request appears in the "Teacher requests" panel. The admin can approve or reject each request, checking the provided data (school type, institution, subject).

User management

The admin can search users, view profile details, modify assigned roles and enable or disable accounts. They can also view each user's projects.


Frequently asked questions (FAQ)

I can't see "Classes" or "Teacher" in the menu

Check your active roles in "Edit account". For the "Student" role, enable the profile from your account page. For the "Teacher" role, submit a request and wait for administrator approval.

I submitted a project and now I can't edit it

This is expected behavior: submission makes the project read-only to ensure the integrity of the work. You can still export the diagram to PDF or PNG. Only the teacher can reopen the project to allow further edits.

The diagram is not visible (seems to have disappeared)

The diagram may have gone outside the visible area. Use the Fit, Zoom or Center buttons on the board to reframe the schema.

Can I change the diagram style after creating the project?

Yes, you can change the style at any time by clicking the "Style" button in the toolbar. The diagram will be automatically adapted.

How does restructuring work?

Restructuring transforms the conceptual ER schema into an optimized schema, eliminating generalizations, composite and multivalued attributes. Click "Restructure" in the original diagram toolbar to start the process.

Do I need to install anything?

No, ER Designer is a web application. It works directly in the browser without any installation.

Can students join with a code?

Yes, the teacher shares the class code and the student enters it in the "Join a class" section to enroll.

Can the teacher reuse exercises?

Yes, the teacher can assign the same exercise to different classes and can use the built-in exercise library.

Can I use ER Designer outside of a school context?

Absolutely. The basic account (ROLE_USER) allows you to create and manage projects independently, without being enrolled in any class.

How does the logical schema work?

The logical schema is automatically generated from the restructured diagram. You can view it in textual form (table list with fields, PKs and FKs) or in graphic form (tables connected with crow's foot notation).


Quick reference

Summary of main pages, URLs and required roles.

Page URL Required role
Project management/appROLE_USER
ER Board/app/project/{id}ROLE_USER
My classes/classesROLE_STUDENT
Teacher area/teacherROLE_TEACHER
User management/admin/usersROLE_ADMIN
Edit account/accountROLE_USER
Guide (this page)/help