Neeve
Creating a visual object-oriented UI system for building management
Role
Lead Designer
Code Frameworks
Prototyping
Agency
Ruca
Industry
Operations Technology
Commercial Real-Estate
Client Databases
The challenge of this project was to create a simple node-based UI so that OT professionals can see the visuals of services, functions, and databases connected within buildings they manage.
The ask
Visualize the connections between various systems with permission and view controls.
Details
- The connections are already being made, but are done via a series of modals and dropdowns
- The easier challenge is to visualize the systems connection points
- The more difficult challenge is to give the node UI controls that are intuitive, so connections can be set and updated through this system, and the modal method can be left behind
Page and Frame
The app’s pages still had a lot of information on them due to the current system, so to start with, the flows and elements had to be usable within this frame at small sizes.
As this method takes over the main use of the app, the frame will be able to stand on its own as less surrounding UI is needed.
Focusing on very small details to make it intuitive
Defining the hit areas, interactions for drag and drop, and ability to connect or not connect to different elements was necessary to communicate to development, as they built these details over the existing framework.
Delivery
The file was delivered with focus on each individual part, to avoid confusion for development, so they could focus on building the entire system globally.
A lot of detailed explanations and walkthrough videos were delivered to explain the features further.
