TCP Design System
Here I’ll tell a little about my experience working as a UX/UI Designer in a seaport.
About
The Paranaguá Container Terminal (TCP) moves an average of 1240 containers per day. In 2018 724 ships were operating. The port has been modernized in recent years and most of the operations are now digital. The fast growth of information available on the TCP Customer Application made usability, information architecture, and user experience to be set aside.
The first challenge was understanding how the system works in real-time with several numbers of processes and user flows, improving the user experience for almost 4.200 clients with 100 accesses per minute. Dealing with this, another big issue was to change the culture of their development team, because the developers didn’t know their user’s needs and that made them built a non-user-friendly system.
Research
The TCP system has an average of 100 user accesses per minute as I said before and an infinity of possible user flows. So, the question was: “How can I start it?” My first step was analyzing their Google Analytics page, at least to see how these accesses working, the profiles, permissions, and overall numbers.
After this part, I started to contact real users for a quick interview and send them a survey.
Pain Points:
- Too many screens to complete the same task;
- User flows totally broken or confused;
- The users didn’t receive any feedback about the processes and sometimes they had to call Customer Service.
Planning
In this phase, I started to create the Personas to make all the processes easier to understand as a real user of the system.
I’ve built the user flows for each permission profile to help the developers to see the relationship between the screens, create the components, and get the overall complexity of the system.
Design Sprint
In this phase of this part of the project, our main objective was delivering
the new search feature, with this in mind, I called all the developers for a design sprint, to get all the ideas, pain points, insights, and help to put the team on the same track.
User testing
After the part of research and planning, I started to do the wireframes and de mid-fi prototypes. We selected six companies to start to test our beta version of the system.
Subsequently the period of tests and improvements (3 months), we delivered the first version of the new feature with a new style guide.
User interface
Thanks for watching :)