![](https://cdn.myportfolio.com/cbf5d2afaba09d056a770abe655edeff/c04c3cd0-2539-4ea9-97cf-16a94fa0b116_rw_1920.png?h=e2d6e6a1a0fcd8050e0484ad9708b87a)
The old UI:
With a lack of graphics and green being the only available color in the UI meant that there was a huge potential to improve the user experience and increase the efficiency. Most of issues in UX were caused by lack of clarity, single color and poorly designed menu structure.
![](https://cdn.myportfolio.com/cbf5d2afaba09d056a770abe655edeff/c4f61e42-5cac-4258-ae26-fe5972fb8eba_rw_600.png?h=7ebbb3c31688a7788f11d355d02064ce)
![](https://cdn.myportfolio.com/cbf5d2afaba09d056a770abe655edeff/2e8437fa-3b8d-4880-8bc4-85f0ea879b97_rw_600.png?h=2effc8d0d9ae9fef9beffb1cfb8846da)
![](https://cdn.myportfolio.com/cbf5d2afaba09d056a770abe655edeff/84f0f0cc-a47c-46a8-96d2-2fea9a86d5c3_rw_600.png?h=1758c3952fe446e75b8378005fd283c2)
![](https://cdn.myportfolio.com/cbf5d2afaba09d056a770abe655edeff/a180eac0-962a-48f8-a3af-bed2b0f04f22_rw_600.png?h=5f9f51c815d53c44d88090ffc255ee49)
The new UI:
With all colors available to use, we were able to show errors in red color and confirmation in green, which helped users identify problems quickly. Having a touch screen also meant that we could introduce gestures, like swipes to reveal detailed information without cluttering the UI. I have designed custom components and features to reduce the error rates. These features all helped to create a better user experience for our users.
![](https://cdn.myportfolio.com/cbf5d2afaba09d056a770abe655edeff/dfafef19-7e55-4a2a-a08c-4e92b16fca9f_rw_1920.png?h=cb6e62db358e2fe9c8039eb929245421)
The impact:
With the TE, what used to be a 5 step process is now reduced down to a single tap, helping to increase efficiency. A standard user journey to finish a complete task on the old UI vs. the new one is now up to 20% faster on average, another significant increase in efficiency with reduced errors.