.png)
UX Designer
Sep 2023 - Nov 2023
(7 weeks)
New feature design, working with 1 PM and getting feedback from many other lovely designers + engineers
As an intern at Autodesk Construction Services (ACS), I worked on designing solutions related to their Forms tool on the Autodesk Construction Cloud (ACC) platform.
As larger clients are onboarded to the platform, there is a need to support higher complexity workflows and resolve the current issues such as slow screen loading times and difficulties in finding relevant form sections to fill out posed by navigating long forms with 100+ sections and questions.
Section Pagination! That is, separating the form into different pages so that only some information is loading at a time. Since the Web version for this was already defined when I joined the team, I worked on the mobile designs, focusing on improving key pain points such as form navigation.
To begin, I first delved deep to understand the construction space and the users involved. The main user roles to consider were the following:
.svg)
.svg)
Once I got a grasp of the users, I went forward to map out the current flow on mobile as well as areas where section pagination would affect the experience. The main goal was to note the big design decisions and complexities that need to be considered and coordinate with the PM to translate them into user stories.
This process revealed several questions to tackle in the designs and points to start brainstorming on.
Since navigation was biggest challenge, I focused on it for the initial set of ideations. I started broad by brainstorming different approaches, looking at examples from other products and within ACC, reviewing best practices, thinking about pros and cons and connecting them back to create initial wireframes.
.svg)
The ideation process led to 7 different navigation ideas! Now started the process of narrowing down the thoughts to help focus and expand on specific concepts.
With the help of these guiding questions and my thoughts based on established pros and cons, I walked through the ideation with other designers + engineering leads + PMs. This session led to three top navigation ideas moving forward:
However, even after prototyping and flushing out these ideas, alongside gathering more feedback through design feedback sessions, offline feedback and more conversations with PMs and designers, there still wasn’t a clear winner. I also wanted to validate the specific concerns and questions that came up during these feedback sessions.
This led me to the next phase of the project - concept testing.
To help narrow down ideas further, and get better insight on user thoughts - I conducted internal moderated testing sessions with 5 Customer Service Managers and Implementation Consultants. Since they interact with users more frequently, they brought more updated knowledge and perspectives towards product improvements.
To get the most relevant feedback, I conducted usability testing, comparing the navigational experiences for the top 3 concepts, whilst confirming smaller details related to navigation. The main task for the testing: Navigate to a section
Navigation Hub
20% chose as their top pick
Hamburger Menu
20% chose as top pick however, 100% expressed discoverability concerns
Bottom Bar
60% chose as their top pick
The testing revealed ideas that were more favourable than others as well as an understanding of what an ideal navigation experience would encompass. They also validated the original concerns for the concepts. Despite the initial “accidental” swiping concern, the bottom bar was still the most popular concept!
.png)
After presenting these results and conducting further discussions with designers, engineering leads and PMs, a combination of the Navigation hub and the Bottom Bar ideas were chosen - integrating the feeling of familiarity with easy and quick navigation.
Before settling with the final designs, there were further iterations on both, the navigation, as well as other smaller decision points for the designs, including the complexities introduced through forms that have specific sections assigned to a form filler and the reviewer flows.
The original design of forms included a “section status details” with information that overlapped with the idea of the bottom sheet. However, since the bottom sheet was more accessible, consistent with web and highlighted more relevant information needed for the goal of improved navigation, I decided to move forward with that idea instead.
I iterated on different ideas for bottom sheet designs based on feedback before settling on the finalized designs. In this process, I wanted to make sure I was creating something that was intuitive and consistent with web.
%201.svg)
I also iterated on different ideas for bottom sheet designs based on feedback before settling on the finalized designs. In this process, I wanted to make sure I was surfacing the most relevant information while addressing the “accidental swiping” concerns.
%202.svg)
I also focused on improving the reviewer workflow, looking at different possibilities for the flow of sending back sections to users to ensure ease of navigation whilst accounting for form status changes and other complexities with section assignment.
While working on the smaller screen mobile designs, I also looked into working out the flows for tablet. Unlike the smaller screen issues with mobile, the tablet has enough real estate to include a side panel as originally designed in Web. This created another decision point.
Should tablet follow what is on web or be more similar to the rest of mobile designs for smartphones?
Although the approach for mobile works for smartphones, the side panel is still the most convenient for a user to use and reduces friction that may come when navigating using bottom sheet overlays. Therefore, after confirming the complexity of the approaches with engineers, I decided to move forward with a side panel format for tablet.
.svg)
iOS and Android versions for mobile and tablet were finalized for forms with and without section assignment.
.png)
Designing for mobile interactions isn't always straightforward - This was my first professional mobile project and there were lots of little things to keep in mind for interactions. Beyond general IOS and Android guidelines, considerations for limited screen space and scrolling interactions were key. I tried to continuously ask myself questions such as: Is this something that the user will miss? Will this button be in the way of the user scrolling? which ultimately helped me ideate, test and validate concepts.
There is no one solution to effectively collaborate with stakeholders - Whether it is collaborating with Engineering, PM and/or other designers, understanding the best ways to get feedback on items and communicate findings was important throughout the project. I learnt to establish rapport with different collaborators through initial meetings and adjust the ways I seek feedback based on individual capacity and communication styles (booking meetings and workshops vs offline conversations) in order to ensure that everyone is on the same page on technical constraints and user requirements. This also reinforced my understanding of when to involve what stakeholder, and make sure I come in with specific goals for conversations.
Not every design decision can be anticipated - Although my initial user flows and user stories helped in creating direction and outline the overall picture of what questions I would need to answer for the project, some questions and concerns only came up when working through the designs and getting feedback. This taught me to be flexible with my plans while ensuring that I am doing the one thing that I should - connecting everything back to the user.
Due to my limited time on the team, I wasn’t able to see the project implemented. However, if I were still working on the team, here would be my next steps -
.svg){kind=small}