HP Telesales Platform redesign

The HP telesales & customer service team had been using the same platform to process customer information and purchases for almost 20 years.
The project is still being implemented and tested so no finals will be showed.



My Role

I was the UX and UI designer assigned to this project. As an outsider to this part of the business, my job went from understanding the platform, how everything connected together and observing how telesales agents used it, to wireframing, prototyping and providing the final interface design.



Design problem

Being a 20 year old web application that had never received any modifications, the challenges were many:

  1. Outdated design not compliant with the HP brand anymore.
  2. Parts of the platform in desuse as they no longer were useful.
  3. Complicated flow, a lot of back and forward, elements only visible in one page or related information distributed in different parts of the same page.
  4. Unnecessary huge amount of scrolling for very simple tasks.
  5. Agents wanted to open all links in tabs.
  6. Agents wanted a notepad on their main screen as they would normally take small notes in other programs.
  7. Some telesales customers were businesses that sometimes would have over a hundred addresses. Agents needed to navigate through them one click at a time, being a very tedious unnecesarily long process especially having the client on the phone.
  8. Some agents work for more than one country.
    E.G: a german or french speaker agent could be answering a call from a German/French customer or a swiss one. They needed to log out of the system in order to change to the other country’s database.



Similar design chaos my eyes dealt with on the original platform




  • The project manager got the initial needs and wants with the business and agent managers.
  • Visit and interview to several telesales agents to see how they used the platform and gather immediate feedback from their day to day.
  • Wireframing the new structure of the platform along with the project manager.
  • First prototype and feedback with different country agent managers and developers.
  • Second prototype and final discussions with PM
  • Validation of final design with the business.
  • Design deliverables and documentation for developers.
  • QA by devs and myself.
  • Beta run and final implementation world wide.




    1. Updated design following HP Store brand guidelines.
    2. Home dashboard from which the agents would navigate to the different sections.
    3. Every link from this dashboard would always open in a new tab.
    4. Dashboard includes a click-to-edit notepad that minimizes the interaction of the agents to enter ans store data.
    5. The agents can choose what country they want to work with from the dashboard instead of login out to switch country.
    6. The focus of the interactions is mostly above the fold with minimal scrolling.
      The platform was designed to work in the resolution all agents were using on my visit to the telesales center (1366×768).


  1. The user’s address search was improved by adding an input search based on the street with autosuggestions and a dropdown with the 5 last used addresses.
  2. The platform is currently about to be implemented. Feedback after a couple months is planned.



One of the mockups for the platform home




I normally faced smaller projects with a lot of previous discussion within the HP Store. However this one was a whole platform not directly involving HP customers’ interaction, but its very own workers. It was really interesting understanding its complexities and an amazing opportunity to do everything from scratch.

Communication with all parts is key. Design decisions must align with the business needs and sometimes that requires an extra effort on both sides to really understand what and why something is needed. 

The interviews were key aswell to get an in-depth  look into the real problems agents faced everyday with the interface.
There is no way I would have noticed that agents normally had an external notepad open and their regular screen resolution without visiting them.


YEAR: 2017
TOOLS: UX, UI, Research, Axure