Ansys UX Internship

Improving the experience of 3D product design and simulation software
Overview
Project 1Project 2Project 3Reflections
OVERVIEW
Summary

Background
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 engineers explore ideas, iterate and innovate with better speed, accuracy and overall experience.

Achievement
Ansys sponsored my ongoing one-year capstone project and provided the opportunity to explore AR/VR/MR technology for Discovery.

During internship, I worked in a cross-functional team of product managers, designers, developers with two fellow interns. Ansys UX team practices agile process for software development where the project plans are broken down into small design tasks to respond to changes.

I worked on 7 mini projects that had different goals and required different approaches. Out of those seven, I will briefly describe three interesting ones that I worked on:

1. Discovery Style Guide
2. User flow improvements
3. Message box re-design

PROJECT #1

It is difficult for product designers and developers to implement and confirm the design paradigms in the product. It can lead to a lack of design consistency. How might we establish a shared understanding within the team that can guide them to achieve consistency and collaborate efficiently?

1
THE SOLUTION
Discovery Style Guide

Designed a living product—Discovery Style Guide—a website that dictates how each design component looks, how it can be reused, and how it shapes the overall user experience, improving the product design and development process.

ITERATIONS AND EXPLORATIONS
Establishing a system

We defined the goals and identified constraints from the discussions with stakeholders.
I collaborated with fellow UX interns—Lai Jiang and Lawrence Liu on this task. After receiving the project brief, we laid out the software 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) as a starting point: Buttons, Typography and Colors. Out of these, I worked on the Buttons page. Also, out of two primary user segments of developers and designers, we focused on the needs of designers due to time constraints.


Why a Style Guide?

    Google's Material Design
    Atlassian Design System
    IBM's Carbon
    Fluent by Microsoft
    Ansys Discovery Toolkit - existing resource to test and collect the hi-fidelity design components

    The preparation started with the UI audit and I created an Interface Inventory for buttons.
    I audited and analyzed 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: Button states, tabs, toggles/radio buttons, slideshow buttons, buttons with icons, buttons with dropdown menu and selection buttons.

    Inventory for Buttons
    A site map helped me visualize the logical structure of the information clearly.
    It was challenging to determine the structure and hierarchy of the information because of the open-ended nature of the style guide. I mapped out the Information Architecture to get a clear understanding of the scope, structure and relationship between the content sections of the website.
    Site map
    Then, I laid out my ideas in the form of wireframes and validated the concepts by testing them with the team members.
    Based on my research, I created medium-fidelity wireframes for home page and buttons page, and presented them to the lead designers and interns for feedback.
    FINAL DESIGN
    Style Guide (Buttons Page)

    We took inspiration from other popular design systems.
    I watched several talks about the design systems, attended webinars and analyzed 20+ style guides and design systems built by other companies to get a better understanding of the design systems world. Also, we audited the existing internal resource: The Toolkit, that is currently being used by both designers and developers to manage and test UI components.

    NEXT STEPS
    Laid the foundation for Ansys Design System

    This is an ongoing project. It helped me discover my interest in the design systems. I learned how to build a design system. Discovery Style Guide is now published internally for Ansys UX team. 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 sparked the discussion of the need of Ansys Design System to unify multiple products in future.

    PROJECT #2

    The two features—1. Online Help and 2. Parameters Table can be accessed and discovered in multiple ways. Also, the placement of these two features is not aligned with the user's expectations. This affects the mental model of the user and decreases the learnability of the product. Evaluate these features and provide recommendations to improve their discoverability and accessibility.

    2

    THE SOLUTION
    User flow improvements with prototyping


    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.

    BEFORE
    AFTER
    Adding an in-context search option at the top


    2. How might we modify the Driving Dimensions and Parameters manager tables to make them more connected, discoverable and intuitive?

    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. I optimized the interaction by relocating and combining the Driving Dimensions and Parameters table strategically, making it more seamless and cohesive.

    BEFORE
    AFTER
    Two tables combined
    PROJECT #3

    Dialog boxes communicate the software feedback to the user. Currently they are not consistent with the visual style of the product. How might we re-design the dialog boxes to make them consistent with the visual style, standardized for different types of messages and reusable for other products?

    3
    THE SOLUTION
    Dialog box redesign

    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 consistent in visual style with other modals without losing the legibility.

    THE PROCESS
    How did we get there?

    We collaborated on this task and started our work by studying the current dialog box design and themes from the Discovery Toolkit. Our goal was to create a dialog box that is consistent in visual style with the current software UI.

    Before


    Initial sketches

    After gathering the basic requirements, I brainstormed some initial ideas and explored some layouts. These rough sketches led to the questions such as - 'what are the different types of messages?', 'what colors to use to show them?', 'what changes can we make to the information and layout?', etc.


    Iterations and explorations

    I translated 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 manager and other lead designers, and sought feedback.

    Behind the scenes
    DESIGN ALTERNATIVES
    Narrowing it down

    Based on the feedback received from our team, we identified key attributes of the Discovery visual style and made our designs more consistent with them. Some of the design attributes we focused on are outline, background gradient, colored bar, background pattern and icon style.

    Below are the three dialog box alternatives that I came up with:

    FINAL DESIGN
    High-fidelity mockup

    We iterated on each other's concepts and combined some of the ideas to align them with Discovery design paradigms. We presented our final designs to the team in the context of the software UI.

    NEXT STEPS
    Hand-off to developers

    We created multiple variants of message boxes for different text lengths and heights, themes, message types and button states and presented them to the team. Also, we discussed if there are any technical challenges that might occur during the implementation.

    Long text w/ scroll
    Long text w/o scroll
    Medium text
    Short text
    Finally, we presented the design specifications to the developers in a meeting and discussed how visuals are laid out in detail. We communicated our design decisions, recommendations and achieved their buy-in. Dialog boxes are currently under development.
    LEARNINGS AND TAKEAWAYS
    Practice collaboration
    To be a good leader, you have to be the best team player first. Ensure that everyone is heard, involved and valued equally. Soft skills including facilitation, organizing, planning, maintaining positive energy and communication are extremely important.
    Understand product goals
    Ask questions to understand the product from business and user's standpoint. In-depth understanding of the context will help in framing and exploring the problem space. Asking 'why' is important and necessary to scope out and test the work early on.
    Balance trade-offs
    Every design decision comes with consequences, both good and bad. Anticipating tradeoffs and striking the right balance between them provides clear direction to move forward. Support every design decision with a solid rationale and evidence.
    Be a quick learner
    Every problem brings new opportunities. It calls for new approaches, tools and methods to be employed. Be ready to pick up new things quickly and adapt to the environment. Strong foundation of UX design makes it easier to navigate in an unfamiliar domain.
    TEAM PHOTO
    Thank you for reading!
    mixspace
    Conceptualizing an innovative way for stress relief of future employees
    Upkeep
    Connecting residents to local on demand home service professionals
    © Designed by Shriyash Shete