A Simple Web-Based Wiring Harness Tool

When building electronic assemblies there is quite often the need to construct custom cables to hook things up. It’s all very well if you’re prototyping by hand, or just building one or two of a thing, but if you’re cranking them out using outside help, then you’re going to want to ensure that cable is described very accurately. [Christian Nimako-Boateng Jr.] presents for us the first version of wirely, a wiring harness tool. This is a web-based tool that allows one to describe the cable ends and connectivity between them, producing a handy graphic and exports to excel in a format that should be easy to follow.

Based around the wireviz Python library running on a flask-based backend, image data are sent to the web assembly front-end and rendered with OpenGL. Configuration files can be imported and exported as JSON, making it easily linkable to other tools if required. Helpfully, the tool also seems to support some kind of revision control, although we didn’t try that yet. The process is straightforward enough, one simply defines a few groups (these relate to individual PCBs or other floating items in the assembly) which each contain one or more connectors. First, the connectors are described with part numbers, and wire gauge data, before defining the list of connections (wires) showing which signal and physical pins are connected together. Nothing more complex than that yet. We think there is still some more functionality that the tool could manage, such as shielding and guarding details, twisted pair definitions and a few others, but for a first pass, wirely looks pretty handy.

If you want a more heavyweight option using IEC 60617 symbols for describing wiring harnesses, then look no farther than QElectroTech, and yes, we have covered wireviz before, just for those that want to cut out the middleman and describe their cables in Python directly.

33 thoughts on “A Simple Web-Based Wiring Harness Tool

  1. I really like this, has the potential for being really handy for quick cable wiring diagrams. Christian, if you read this and don’t mind the suggestion then one thing that would speed the workflow up dramatically is drop down selections.

    e.g. once you’ve created a group and connector when you go to create a connection the fields become drop downs populated by what has already entered.

    This should also help reduce user errors caused by bad typing

  2. I think this could be useful even for building larger machines, but there are a few things that would need to be added:
    *Make it possible to link a signal between a male and female connector of the same designation, making sure nothing gets forgotten or mixed up
    *Make it possible to search and highlight a specific wire number or signal name.
    *Create “print views” with all connectors terminating at one end of a wire harness, or one part of the machine, making it possible to adjust the placement of connectors logically on the page
    *Make it possible to print a PDF with a proper index and links between pages, and working text search

  3. This is a really cool tool! It is a bit clunky when dealing with a large number of connections because you can’t copy connections so I found it was just easier to export the .json file, edit the .json file directly in NP++, import it back into wirely and compile that way. It would be really cool if you could switch from the GUI to a .json editor. I imagine that this is how it works in the back-end anyway.

      1. I’m not sure if the back end that generates your graphics can handle color stripes by allowing for 2 color imputs, but being able to also factor in striped cables for builds would be huge.

        1. Hey Cody, the latest version of Wirely allows for adding stripes through the fontend by editing a wire connection and unchecking “Disable Stripe”

Leave a Reply

Please be kind and respectful to help make the comments section excellent. (Comment Policy)

This site uses Akismet to reduce spam. Learn how your comment data is processed.