System Designer

An IDE for designing applications driven by the model



Design your application with UML

System Designer uses UML, a standard, to define your model. So you probably already know how to create a model in System Designer even if you have never run it.

The definition of the model is stored on a JSON format called MSON. With MSON you can define types, classes, one to one / one to many relationships and multi inheritance between classes.


Code the behavior of your model

Once you have created your model, System Designer generates the skeletons of all your methods. You only have then to add your code to implement them.

System Designer provides you helpers to manage your components. You can easily navigate threw components to create your application.

function fullName() {
  let result = '';
  
  // for each property a method
  // is created to set / get its value
  result = this.firstName() + ' ' + 
           this.lastName();
          
  // a dynamic type check is done 
  // to validate that inputs and ouput
  // are compliant with the model  
  return result;
}

Create components graphically

There is no need to code to instantiate a component. Create a component in System Designer is like creating a document in a NoSQL Database.

In fact, System Designer acts as an ODM (Object-Document Mapper) to manage your components as NoSQL Documents.


Run your application

You can run your application directly from System Designer and then export it to JavaScript, HTML, JSON or a Node.js module (* Windows 10, macOS and HTML5 versions only).

Because you have defined a model for your application, a Dynamic Type Check is done on every action of your application. All warnings are send and shown in System Designer.


Debug your application

System Designer can load the model of any application that runs on the browser or on Node.js (* Windows 10, macOS and HTML5 versions only). You can see the schemas, models, components and methods of the running application and you can edit them.

All modifications to the model done inside System Designer will be send to the running application. There is no need to reload to see your modifications.


Design on the go

System Designer can be used on Windows 10, macOS, iPad, iPhone, Android or any browsers. You can also install it in your project: System Designer requires no backend to work, it is a full web application.

System Designer has a GitHub module to synchronize your work between all these apps. You can begin your design on your Mac and then continue it on your iPad.