...loading...
Flowy
Flowgraph Tool
Sketch
Express
Typescript
React
Javascript
MUI
Flowy is a free project. The idea is to link app development with the documentation of each step. These steps are represented in a flowchart, enabling collaboration across departments. Designers, product owners, developers, text managers, and all other roles involved in a project can easily work together. The project designer can synchronize the flowchart using the Sketch plugin and elaborate on each screen.
Design
The main design principle was a simple, easy-to-implement, and clear frontend. Therefore, there's a project overview page with a search function. From here, you can create a new project or load and further develop an existing one. It's also possible to use a mermaid graph to kick-start a Flowy project.
Implementation
The frontend is a React Create app, using react bootstrap and styled components for fast and trouble-free implementation.
Flowy Frontend
Built as a React Create app and constructed with Material UI. Connected to the Express backend.
...loading...
Flowy Backend
A simple backend. It defines the structure of the projects and saves the corresponding uploads as images alongside the project JSON.
Sketch Plugin
Written in JavaScript using the Sketch CLI, this plugin can both download and subsequently update the project. By entering the address of a running Flowy backend server, any project can be opened. The flowchart and corresponding Sketch screens are then created and linked. Once the screens are finalized, the project on the server can be updated again using the Sketch plugin. All users of the Flowy frontend can then see the updates live and continue working on them.