Thomson Reuters

An agency helped design the initial branding for this project, which included some Sketch libraries, which included atomic design elements to help the Design team with creating modules/components through to templates. However, they failed to include any functionality specifications, so it was hard to understand how things worked. This would be a major challenge that we had to come over as Thomson Reuters’ internal team.

Research

As it was difficult to understand what has already happened during this project, I thought it was important to put together a presentation explain design basics as well as feedback on the current design system created by the agency.

I did this, to try to get everyone on the same page. This presentation tried to bring balance, education and questions not thought about to the project.

• Space
• Typography
• Scale
• Colours
• Copy
• Accessibility
• Touch devices
• Input devices
• Patterns
• Iconography
• Orientation
• Signposts
• Progress bars
• Consistent mechanisms
• Feedback
• Repetition

UX

One of the areas I was assigned to look at was the Help & Support area. As there was very little UX documentation, we started from scratch in some design areas.

We decided to have several discussions to meet all the business owners and analysts so that they could give us the real insight:

We had very constructive discussions and from there we split the section into two areas:

“I have an issue or I need help with something” and “I want to learn”

The design system was comprised of Sketch libraries, which included atomic design elements to help us with creating templates, patterns, modules, etc. Across these libraries, we had to ensure that all of them worked on three viewports: Smart phones, tablets and computers.

During this process, I started up internal discussions to make sure that we were all on the same when it came to designs elements such as: spacing, typography, colours and iconography. It was important to have these discussions early on (and weekly) so that consistent designs could be carried across all sections and viewports.

Once we started putting together the templates from all the atoms, it was easy to get into the flow of producing all the correct templates and content for each area of the website.

We used Trello as kanban wall, between us and the product team to keep track of what we were doing and working on next.

Once we were finished, the stories from Trello would be converted into JIRA tickets that the development team (who were based in Indian), could put them into their sprints.

We used a google sheets to keep track of our progress using sprint methodology to allow us to estimate, compare between different teams together. I liked this method a lot, as it allowed us to keep an open forum to see what everyone was working and where/when another team needed help.

Each template needed at least three variations: desktop viewport, tablet viewport and phone viewport. It really helped using Sketch libraries and certain plugins to allow us to easy and quickly change elements around during the design process. We used Invision to communicate the specs to the developers and this proved to be successful as their rate of production increased dramatically over the right I was there.

One of the key aspects for this project, was to allow everyone to able to access their information from any devices. This free and open idea, gives more power and freedom back to the user who is driving the data. Being involved in a project like this enforces the essence of this idea.