Interviews (1 day)
UX Workshop (2 days)
User Story Mapping
Based on the interviews and notes from the client, we tried to understand the exciting workflow in the client’s company.
We have interviewed three employees at Visline: forwarding agent, dispatcher, and truck driver. It helped us to grab a sense of their daily activities and struggles. We understood the importance of communication within the company and that there are many communication problems between departments. It caused high stress and the quality of services.
The entire process was conducted hand-by-hand with the developers in an Agile approach. The client has been receiving a progress review every week. Close cooperation helped reducing project time as we could set up our ideas with the budget and time limits.
We understand the difficulties of software engineering. Any changes in the design phase are less time-consuming in contrast to the development phase, so we save time and money.
We spent two full days with the client with 11 employees, team of developers, examining the frustrations and needs related to their work. We’ve created four user personas, explored current work-flow and issues related, and how we can automate it using the software.
We spent the second day working on possible solutions, drawing low-fidelity wireframes all together, and created a user story map to determine the scope of MVP.
The most significant result was from the beginning, we have been working towards a mutual vision of the project and creating a 100% effective transportation management tool.
Establish common vision and set up measurable goals of success
We started with setting a mutual, realistic goal for this project. The main goal was building a communication bridge between individual departments by automating the exchange of information in the company and clients in order to achieve competitive advantage.
Based on discussions within the company and experts talks, we have created together four user personas, collecting their problems, frustrations and needs.
Together we voted on points, which problems need to be solved the most and MVP should focus on.
To have a clear picture of the relationships between the different roles inside of the company and to understand the transport process, we recreated the existing working flow.
"We draw together with participants how each persona participate in the process"
We had made 3 brianstorm rounds with “How might we” questions based on the main problems which came up in the “Ekspert Talks”. We gave participants time to speak loud their ideas.How might we improve the dispatcher and forwarder?
Afterwards, we moved to splitting the group into balanced teams with a developer and a designer in each one. A sketching stage began
We used a story mapping approach to establish what features and components are needed to provide solutions to the listed problems. There we also put the line what MVP wil cover and what will be implemented in the future.
Physical version of the User Story Map we did with participants. We listed main features in each step of the new process.
Together with a product owner and the developers, we set the scope for the first version of the product.
At this point, we had a great relationships with the client, product owner, and development team. What is also essential, we were entirely ready to jump into the next phase
Before we have started sketching, we were collecting detailed information about screens we were planning to create, including input forms, columns of a list of orders. The whole team from the client’s side was involved in that process. The menu has been designed at this phase based on the User Story Map.
Before jumping into user interface design, we have focused on building the app screen by screen. Getting feedback from the clients after each sprint helped us to spend time wisely.
Home screen - deciding on the way of showing the orders. The list of essential information in each order was growing and growing. The decision was to build it as a dynamic table. Knowing that the list will have a 3-digits number of rows only assured us to take this approach.
1. sorting tool in each column because employees have a different style of work
2. a communication tool, a separate channel for each order; notification about a message - in this case the order move on top
3. double pagination, the list of orders can reach hundreds of records
4. drivers inform about their availability by a tool to make a communication easier
5. design the system for prioritising the order status
6. each user can change the order status to keep the orders organised by phase
7. stepper evolved during the process as one order can have multiple loadings/unloadings
8. order updates which are also going to the client
9. seperate chat for each order to keep organised communication
We have sent three mood board to understand what the client’s like and dislike in terms of design. It allows us to work in the right direction from the beginning and saves time on multiple iterations.
Together with the client, we confirmed that the app would have a rough, simple, low-variety o color design with the domination of red, which is Visiline’s primary brand color.
The higher fidelity of the prototype, the more time consuming changes are. We respect our client’s time and we before we start the visual design phase, we want to get acceptance on mid-fidelity level for UX part (navigation, structure etc.)