UI case study: Periodic Table of AI
The project
A sales tool used by Accenture and clients. Its goal is to educate new employees and facilitate discussions with clients over AI solutions. The marketing team had already given a name and identity to the tool (Periodic table of AI) to demonstrate that Accenture has mapped the whole universe of Artificial Intelligence. The tool presents all AI functional capabilities, the vendors that provide them and all the products associated.
The problem
Artificial Intelligence is a very hot subject today. It constantly expands and Accenture uses it heavily to improve or enable services for clients. The sector is very disruptive and there is not a single source of all information needed to facilitate a discussion, help the client bring the knowledge back to their team and take a well-informed discussion.
My Role
I worked with the client to form the question or problem we were trying to solve.
How might we improve discussions about Artificial Intelligence between Accenture and clients?
After forming the question, I helped the client team distill the information we had about the clients usually engaging in the sales pitch. We came out with two personas.
Through our client stories, we identified the pain points of the current process, understood in deep the problems we were trying to solve and the context that these discussions take place.
After that, I reviewed the full content we were expected to include. I would definitely need to come up with simple and intuitive navigation among the 68 functional capabilities (main content of our project) and all the information that come with each one. Some of them had unexpectedly large names so I assigned a code name to each one.
I couldn’t find a Scrumble so instead I used paper squares to quickly group the functional capabilities in several ways till I had a look and feel that resembles the real periodic table.
I started sketching ideas, sharing them with everyone working on the project (project manager, developer, and the client team). I created an interactive mock-up using Adobe XD and InVision. We got as much as early feedback as possible from the client team but also from mock tests that took place in the office canteen.
The project had to be shipped within eight weeks and the work was split between myself and one developer. In order to reach the target, we worked with an iterative process that had the developer building the web app on a similar fashion we worked on the design, from wireframe to low and then higher fidelity as we processed. In that way, we were able to better test the interactivity that wasn’t working perfectly on InVision and we also got to have development start from the first week of the project.
Things I would have done differently and learnings
- Having a product called “Periodic Table” shouldn’t have limited my view of the design. I got too obsessed with delivering a product that looks like a periodic table and that in the end impacted the user experience. I should have tested versions were users could choose to see the functional capabilities in a library view supported by search function and keywords instead of just categories and drop-down menus. The current design fits the objective of the marketing team but can fail the user.
- The web app would fail some Web Accessibility Guidelines due to my sticking in delivering a “Periodic Table”.
- Signing an NDA doesn’t mean you can’t document the process or show part of the delivered outcome.
The design
Future
The first version of Periodic Table of AI has just been shipped but there are still a few more ideas to be realised to bring this solution further. The second version will give the ability for the sales team to build a custom periodic table, highlighting specific functionalities for specific clients and ways to improve communication among sales and client teams.
