BOBBY KING
Case study: B2B software redesign
ACM software hired me to design version 6 of AdvicePro, a popular software package for advice workers in local authorities and housing associations.
The brief
ACM are a small software company with a viable product who had never involved a designer before. They have a core team of developers and business development agents who work directly with companies. The agents act as sales people and coaches. They also feed back improvement ideas and complaints to the company.
The solution had to be easy for case managers to learn with minimal training. At the same time, the software had complex report-building tools and data visualisations. I had to consider both audiences during my redesign.
What I did
Start with sketching
I spend the first few weeks of every project getting to know people and finding if the organisation has any existing research.
I’m a fan of Jake Knapp’s Sprint! for generating ideas from teams. To generate ideas and avoid groupthink I booked one-on-one sessions with every member of the team to sketch out how they thought the software should work. I then ran a session with the whole team to evaluate all the sketches and got a decision maker to choose the elements he like best. I combined these into the first wireframes.
Iterate on a design with usability testing
I live with a design over the course of a project. I generally look at it every morning then tinker with a few things. I invite people over to review it informally.
I occasionally do big ‘reveals’ for the whole team but these can be slightly risky. I have a lot of decisions to make when I’m creating a product: there are times when the wider team don’t like what I’ve done, especially if they have been working on a product for years and they’re used to how it works. To take the team with me, I test a prototype on real users.
Most organisations are now open to the idea of testing their products as they’re developed. For ACM I took my laptop with an Axure prototype to different advice offices. I recorded the screens and audio. I gave the workers several short tasks to complete and used the talk-aloud protocol to capture their reactions to AdvicePro 6. I then edited the recordings and played them back to the whole team to get their reactions.
Create data maps and capture headline data
I learned two approaches from this project: creating data maps and picking headline data.
The software was built around interconnected types of data: clients, cases, tasks, notes. I found the relationships between them all slightly baffling so I created a map and put it on the wall as a poster.
‘Headline data’ is about the information architecture concept of ‘progressive disclosure’. Software has to occupy a limited space on a screen, so a designer has to choose the most important thing to show in the most prominent place. After I identified that cases had types (housing, immigration, money advice and so on) and had states (open, closed, on hold) this led me to come up with a hierarchy of what to show on each screen. From this I designed the new user interface.
Start with lo-fi designs
I start with black and white wireframes with a few shades of grey to contrasting emphasis. The first element of colour I usually add are the call to action buttons.
As time goes on I will experiment with different layouts and add animated transitions for a more usable, delightful experience.
The last thing I made was the query-building tool. I designed a front-end which would handle light data visualisations like line charts and bar charts.
The outcome
Although this was their first experience of user-centred design, the developers and sales agents at ACM responded enthusiastically to the new design. They implemented a new version which was well-received in their industry.