Webfaction

Webfaction is a managed hosting provider aimed at developers with a great offering, great pricing, awesome support and one of the most awkward and difficult to use interfaces I have ever seen. I worked with them while running Hyperion in order to make the product more accessible to less technical users and capture more of this market segment, but also simplify the interface for existing users who were equally frustrated with how difficult to use it was.

My responsibilities included managing the project, conducting user research, interface and experience design and development oversight.

After talking to the company's founders, running a series of user interviews and looking at the analytics and support tickets, we found that a significant number of users find the interface confusing and have to contact support to understand how to achieve basic goals.

Problems Identified

Goals are hard to achieve Unclear hierarchy Confusing terminology Lacking key statistics Not friendly to beginners Dated design Not responsive

Starting to explore solutions

Once I had a good idea of what the biggest problems were for users, what sections they used most frequently and what they usually wanted to achieve with the interface, I started exploring ideas for how to improve it.

For example, for less technical users, their goals would be to set up their first website, check their usage and billing and create new email addresses. More technical users would need to create databases and database users, configure SLL certificates, manage FTP users permissions, and contact support about how to do more advanced things like connecting via SSH. None of which were easy to do with the current interface. I started with paper sketches because of their low fidelity - I could explore ideas quickly without having to consider the visuals at all.




After having tried a few ideas on paper, I moved on to wireframes and continued to explore different ways to construct the interface at a higher fidelity.

image desc image desc image desc image desc image desc image desc image desc image desc image desc image desc image desc image desc



I also created an IA map of the current interface, which helped create a logical nav and stay organised as I was restructuring sections and creating the new interface.

image desc image desc

The design

I tested the usability of the proposed restructure and agreed on a path forward with the stakeholders. I then started to work on the first version of the design.

image desc image desc image desc image desc image desc image desc



After several iterations, my colleague (front-end developer) and I created a prototype to do more user testing. We opted for this solution because the interface is quite complex and tools like InVision would not have given us the fidelity we needed, and we decided it would be best to get as close to the real thing as possible for this stage.

The interface was well received and once I ironed out the last remaining details with the design, my colleague and I started developing it.

The responsive version

One of the goals of this project was to also make the interface available on mobile




Aftermath

Webfaction came under new management shortly after we finished this new interface and decided to stop investing in the back-end changes that would have been needed for our interface to go live, so, unfortunately, the new UI was never fully released.

We did however run tests with an interface powered by a mock-server and the users we tested with responded very well to it. I asked users to try and complete their most important tasks without any assistance or instructions and evaluated the degree to which they succeeded. They reported it was:

Easier to achieve their goals Friendlier to beginners Clearer to navigate Providing a good experience on mobile devices