NE-ONE Network Emulator

Description


I delivered a new product that merges the functionality of two legacy projects. I redesigned the entire application, bringing it into the modern era, as well as rebuilding it using React. More info: https://itrinegy.com/ne-one-professional-range/

Tech stack: Javascript, React, Redux, Tailwind, HTML5, CSS3
Responsibility: UI/UX Design, Front-end, API integration
Project type: Commercial Application

Itrinegy
  • Before

  • After

  • Before

  • After

Statistics: This page has a table component with live data coming from the API (every 3 seconds), which is then formatted and displayed on the table. You can also launch the Graphing component by clicking on the chosen field. This page also contains filtering functionality to help reduce the number of columns on display.

Graph Generator: Select hardware ports and fields you'd like to monitor, which then launches a live graph to view results in real time.

Graph Generator: View data on a live graph (auto-fetches from API every 3 seconds) with many coloured lines representing the data, as well as an option to modify the selected fields (add or remove), hide the sidebar (to go full screen) etc

Mesh Designer, also known as the custom Network Designer

Admin pages: All settings are integrated via the REST API with an intuitive user interface.

Scenario Builder: An intuitive “Drag & Drop” approach allows users to rapidly create a chronological network experience by simply combining multiple network types and conditions running over a graphically represented timeline.

Copyright © 2022 Tanveer