Smoothwall

At Smoothwall I worked on making a software application intuitive and accessible.

I analysed the customer data for usability issues and then did some user testing with those users to see how they used the software. I then made sketched prototypes and tested these on the same customers. These were then coded and tested further until all the issues were solved.

Smoothwall is a threat management system for schools, colleges and large organisations. The firewall product features anti-malware protection, HTTPS inspection, anonymous proxy detection & blocking, and intrusion detection & prevention, to provide you with a complete all-in-one protection package.

It was as complicated to use, look at and understand and when I joined I was tasked with making it more user friendly so that the application could be sold to a wider, less technical audience.

Pages in the application looked like the one below. The developers and customers that had gone on training to use it, wanted to overhaul it so that it was easier to understand.

The original outgoing sources page

In the image above, the two panels of inputs are the attributes for the table rows in the table below them. To edit one of the table rows, the customer would ‘mark’ the row using the checkbox, and the attributes would populate the fields above.

There was a mass of customer feedback and a host of complaints about the way the product worked so I had an active user base to do some user testing with.

I visited customers and took notes and made sketches. I then made paper prototypes with the sketches and revisited the customers to get their feedback.

Example of a paper prototype test page. I would overlay other sketches if a test participant said that they would perform a particular action. This allowed me to take notes directly on the designs.

Once the the customers and the stakeholders were happy with the layout and functionality, I made the design changes that are shown below.

I changed the design so that there was a table of outgoing sources. There were no editable fields in view. To edit a table rows attributes, the customer would hover over the table row to reveal the edit button.

When the edit button was pressed, an overlay with the attributes appeared for editing as seen below:

Saving the changes would close the overlay and the table row would be updated.

These designs were then given to a front-end developer and built into the application. There were many pages of equally complex actions and I worked there for three years making changes to most of the system.

More information

For more information on details about my work at Smoothwall, please contact me.

Back to previous page

Back to portfolio