In summer 2020, I worked at Ansys as a UX Design Intern. Ansys builds multi-physics engineering simulation softwares for 3D product design, testing and operations. I worked on Discovery product—an enterprise software for 3D modeling and simulation to help design engineers explore ideas, iterate and innovate with better speed, accuracy and overall experience.
Achievement
Skills recognized, Ansys sponsored my ongoing one-year capstone project and provided the opportunity to explore and integrate AR/VR technology for Discovery software.
During my internship, I worked in a fast-paced environment with a cross-functional team of product managers, designers, developers with two fellow interns. Ansys UX team practices an agile process for software development where the project plans are broken down into small design tasks to respond to changes.
I worked on seven mini projects that had different goals and required different approaches. Out of those seven, I will briefly describe three projects that I find interesting:
1. Discovery design system
2. User flow improvements
3. Dialog box redesign
It is difficult for product designers and developers to manage and reuse the design paradigms of the software. It can lead to a lack of design consistency. How might we establish a shared understanding and a common design language within the team to achieve visual consistency, efficiency and collaboration?
Team
1 PM
1 Sr. UX Designer
1 developer
Me + 2 interns
Duration
3 weeks
Designed a living document—a website that dictates how each UI component looks and works, how it can be reused, and how it shapes the overall user experience, improving the product design and development process.
Discovery Design System as a stepping stone to the Ansys Design System
Ansys owns a large product family (more than 50 software) for design and simulation, many of which were added through small business acquisitions. With every product came it’s own product development process and visual language. Merging all products into a single cohesive style needs a larger Ansys global design system to govern them. To spark a conversation about Ansys design system across the organization, we took the bottom-up approach and created an individual product design system for Discovery software as a starting point.
Why a design system?
We started off by gathering requirements, defining design goals and constraints.
After receiving the project brief, we broke down the software UI into smaller building blocks that need to be included. Because of the time limitations we decided to focus on three basic design elements (or 'atoms' as Brad Frost would put it) initially: Buttons, Typography and Colors. Out of these, I worked on the Buttons page.
Target audience
Out of the two intended user groups of developers and designers, we focused on the needs of designers due to time constraints and technical challenges.
Format
We chose a website over a printable format to capture the dynamic interactions, make quick updates and share document with the consumers easily.
As a newbie in the design systems world, research helped me in navigating the ambiguity.
I watched several talks, read articles and analyzed over 20 popular design systems for inspiration. My exploration and collaboration answered pressing questions regarding the following challenges and guided key decisions about:
Also, I audited the existing shared platform: The WPF Toolkit, that designers and developers currently use to experiment, manage and test UI components.
The preparation started with the UI audit and I created an Interface Inventory for buttons.
I evaluated the software UI and compiled various buttons and their interaction states in a Figma document that served as an inventory. I classified them into several categories: tabs, toggles/radio buttons, slideshow buttons, buttons with icons, buttons with dropdown menu and selection buttons. I noticed that all buttons in the software have consistent interaction behaviors (states). I validated naming conventions with UX writer and engineers.
This is an ongoing project. I discovered my interest in the design systems while working on this project. I learned what it takes to establish brand new design system. Discovery Design System is now published internally for all Ansys employees. I'm honored that my Home and Buttons page design proposals were picked up and adopted by the UX team for further development. This project facilitated the discussion of the need of the global Ansys Design System to unify multiple products in future.
Project learnings:
1. Design system is a living document. That means it requires frequent updates and dedicated personnel to organize and manage it.
2. Design systems don't limit creativity. In fact, they help product teams to document and automate redundant tasks so that designers and developers can focus on innovation and creative work.
3. Design systems are followers, not leaders. Product teams build products. As the design of the product evolves, patterns emerge and by capturing those patterns, the design system also evolves.
Two features—1. Online Help and 2. Parameters Table can be accessed and discovered in multiple ways. Research shows that users struggle to use these features. Evaluate the interactions of these features and provide recommendations to improve their usability.
Team
1 Sr. UX Designer
Me + 2 interns
Duration
2 weeks
1. How might we minimize the steps to reach the Online Help?
We studied how users are using Online Help feature through multiple access points (see the pictures below). To make it easily discoverable and accessible, we provided an in-context search bar at the top right corner of the software. It minimized the number of clicks to reach the online help option. I prototyped the flow that got approved and will be implemented in the next software release.
2. How might we modify the Driving Dimensions and Parameters manager tables to make them more connected, discoverable and intuitive?
From usability testing, we found that the current placement of Driving Dimensions inside the advanced selection menu is not very intuitive. Also, two different tables to manage the same entity 'groups' causes a disconnection in the data and that is unexpected for the users. By applying the law of proximity, I optimized the interaction by relocating and combining the Driving Dimensions and Parameters table, making it more seamless and cohesive.
Dialog boxes communicate system feedback to the user. Currently they are not consistent with the design paradigms of the product. How might we standardize them for different types of messages and make reusable for other products?
Team
1 UX Manager
1 developer
2 Sr. UX Designers
Me + 2 interns
Duration
3 weeks
Redesigned the dialog box for three message types: information, warning and error, three themes: dark, medium and, light and three button states: hover, tabbed and default. We made it visually consistent with other modals in UI without losing the legibility.
I collaborated with two designers on this task and started by studying the current dialog box design and themes from Discovery Toolkit. Our goal was to create a dialog box that is consistent in visual style with the current software UI.
Initial sketches
After gathering the basic requirements, I brainstormed some initial ideas and sketched out several layouts. These rough sketches led to the questions such as - 'what are the different types of messages?', 'How to color code them?', 'what changes can I make to the current layout and size?', etc.
Iterations and explorations
We transformed those sketches into medium-fidelity mockups to get a better understanding of colors, UI themes and dimensions. At this stage, we presented our concepts to the manager and other lead designers, and sought feedback.
Based on the feedback received from our team, we identified common key attributes of the Discovery visual style and made our designs more consistent with them. Some of the visual design attributes we considered and compared were outline, background gradient, colored bar, background pattern and icon style.
Below are the three dialog box alternatives that I came up with:
We eliminated some concepts by dot-voting, iterated on the remaining and combined them in a final design. We presented our final designs to the team in the context of the software UI.
We created multiple variants of the final design of dialog boxes for different text lengths and heights, themes, message types and button states and presented them to the entire team. Also, we discussed if there are any potential technical challenges that might occur during the implementation.