Magazine delivery application

Logistics and distribution

The Project

The client required an update to their previous system that they used for making, changing and returning orders for their stock distribution business. Their previous system was reported as being very difficult and unintuitive to use.

We were tasked with creating an online application that would be more user focused in its design, and make it easier for their customers to complete their required daily tasks.

Due to the scale of this project, various steps in the process were designated to various different members of the team, with some steps having multiple members working on them.

I worked on this project under NDA, so it has been left deliberately vague.

My Role

  • Responsive Wireframing
  • Visual Design
  • Front End Build

The Process

Research and analysis

On this project the team included a dedicated User Researcher. She performed the up front user research on the project. She performed methods such as user surveys, ethnographic research and focus groups.

We worked together to analyse the results and understand how they would affect the project. We created personas to help guide us through the design process and guide our design decisions.

Responsive Wireframes

I worked with the UX researcher to create responsive HTML wireframes of the pen and paper sketches that they created based on their field research with users of the current system. The design needed to be responsive, as the research discovered that users were using the current system on devices varying from old android tablets, to touch interface POS tills, and 27” iMacs. This mean that we needed to be considerate when creating our designs, in particular, being aware that all design features needed to be able to be operated by touch screens.

The responsive templates allowed us to test with users on their own devices rather than with a device that they had never used before. It was very useful in gaining feedback early on in the project.

Visual Design

I helped to created the visual style for the application, along with another of the digital designers. Because the project was so large, we shared the workload, sometimes working together, sometimes separately on different areas of the project, and sometimes individually when there was other work that needed to be completed.

At the start of the project, we agreed upon a consistent design style that we would be using throughout. It was useful to have this ‘design language’ to work with so that we both created design elements that worked together consistently.

I found it a great experience working so closely with a colleague, as we were able to spend time brainstorming on problems, creating solutions that we were happy with, then implementing.

Front End Build

The front end build of this project happened in tandem with the design process, some design elements were created in Photoshop before being implemented, but the majority of the design work happened directly in the browser. We felt that for this particular project this would work far better as a huge amount of the content was to be table based. It made more sense to create the templates in the browser and experiment with how the information was best presented.

Usability Testing

To test the system, we ran usability tests with the identified users of the system. Luckily the client had an existing user base who were easily contactable.

We ran a number of usability tests with approximately 5 people per test. We then used the results of these to feedback and iterate on the design.

Project Review

With every project there are good bits and bad bits, and the only way to work on projects that have more good bits than not so good bits is to learn, and apply what is learned to new projects.

What went well?

  • Got to work on a large project for a large and recognisable company.
  • Working with a varied team, and working together with various UX designers, digital designers and developers throughout the project lifetime.
  • Getting feedback, and making changes to the design based on the feedback from real users.

What would I change?

  • Sometimes intents, or decisions were lost in translation, or forgot to be mentioned when transferring back onto the project after some time on another one.
  • Timescales were somewhat difficult to estimate, due to not knowing how long it would take other people to complete certain tasks.
  • Would have preferred to have had more testing at each stage of the designs being created.