2D Network Diagram

2D Network Diagram

(Source: rinodesign.co.uk)

Isometric Network Diagram

Isometric Network Diagram

(Source: rinodesign.co.uk)

Icons designed for the IT Network Diagram Project

Icons I designed to represent VLANS & Subnets (the ones with dashed lines around them which is used to represent that they are ‘virtual’)

Various ideas I had developed to represent THE INTERNET

Various ideas I had developed to represent THE INTERNET

Two idea variations I had for the 2D network diagram - each of the rings are a layer in the OSI Model.

Some initial ideas on how to display the IT Network Diagram in an isometric view.

Different layers/coloured sections are attempts to incorporation the OSI Model into the diagram.

Draft/Idea to use coloured rings to incorporate the OSI Model into the diagram.

Draft/Idea to use coloured rings to incorporate the OSI Model into the diagram.

One of the drafts for the network diagram design.  Red lines were one of the first attempts of coming up with a new way to display VPN tunnelling.

One of the drafts for the network diagram design.  Red lines were one of the first attempts of coming up with a new way to display VPN tunnelling.

A few of the initial sketches I did for the IT Network Diagrams Project

Using both colour and layers, I tried to incorporate the OSI model into the visual system I was designing.

My talk at the Quantified Self Meetup group on The Data Visualisation Catalogue

Another website layout variation done during Feathercoin’s website upgrade.

Another website layout variation done during Feathercoin’s website upgrade.

Another website layout variation done during Feathercoin’s website upgrade.

Another website layout variation done during Feathercoin’s website upgrade.

Dark theme (mobile layout)  mockup done while working on the Feathercoin website upgrade.

Dark theme (mobile layout)  mockup done while working on the Feathercoin website upgrade.

Dark theme (tablet version) responsive mockup done while working on the Feathercoin website upgrade.

Dark theme (tablet version) responsive mockup done while working on the Feathercoin website upgrade.