IBM Visual Insights makes computer vision with deep learning more accessible to business users. The application includes an intuitive toolset that empowers subject matter experts to label, train, and deploy deep learning vision models, without coding or deep learning expertise.
IBM Visual Insights makes computer vision with deep learning more accessible to business users. The application includes an intuitive toolset that empowers subject matter experts to label, train, and deploy deep learning vision models, without coding or deep learning expertise.
IBM Visual Insights makes computer vision with deep learning more accessible to business users. The application includes an intuitive toolset that empowers subject matter experts to label, train, and deploy deep learning vision models, without coding or deep learning expertise.
IBM Visual Insights makes computer vision with deep learning more accessible to business users. The application includes an intuitive toolset that empowers subject matter experts to label, train, and deploy deep learning vision models, without coding or deep learning expertise.
Role
When
Where
UX & UI
2019 - 2020
IBM
The problem space
Computer Vision is a highly technical and laborious business solution, but has phenomenal potential for enhancing work. IBM Visual Insights makes computer vision with deep learning more accessible to business users. It includes an intuitive toolset that empowers subject matter experts to label, train, and deploy deep learning vision models, without coding or deep learning expertise.
My role
As a UX and UI designer on this product, it was my responsibility to understand complex data science practices and turn them into user-friendly interaction flows. In addition to this, I was specifically responsible for updating the UI to meet IBM's latest design standards through a design system upgrade and layout design.
Design System Upgrade
One of the first and most extended projects I undertook on my time designing Visual Insights was getting the product onto the design system, Carbon. The state of the product was quite a patchwork of one-off stylings and componets.
This project involved frequent communication with the front-end development team and production of a stylesheet that had every spacing, component, and property tokens outlined.
Another goal of this project was to improve the performance of the application on tablet devices. The responsive design was achieved by describing how each of the components and layouts was designed with respect to the web grid.
84%
of users interviewed preferred new interface
of users interviewed preferred new interface
100%
of the product meets 2019 WACg accessibility standards for color and type contrast
Layout Refresh
Thinking through how the users consume the application was a big part of adjusting layouts of screens in Visual Insights. The goal was to leave all UX unchanged (as it was all user-tested and validated) and find a way to restructure layouts to maximize the window screen. This relied heavily on the web grid and making sure we were considering all responsive sizes.
The product had plenty of white-space to work with as the first interface relied heavily on scrolling. After the change, the product is an application that presents information, not one that tucks information away for users to hopefully find after scrolling.
80%
of users interviewed considered the updated layout more informative even though no new information is present
Making waves
Visual Insights was used in the unmanned voayge of the Mayflower Autonomus Ship, retracing the path of the original Mayflower on the 400th anniversary of the voyage.
Teammates
Teammates
Design lead
UX Lead
User research
Keep reading
