The redesigned UI components reduced task completion time by 30%, streamlining workflow for construction managers and subcontractors. This enhancement not only increased productivity but also allowed users to focus more on strategic decision-making rather than mundane tasks.
Impact
Improved User Efficiency
A effective method to prevent such errors is to implement a confirmation dialog, preventing users from losing previously entered data.
The objective is to design a confirmation dialog with a message that is self-explanatory. The choice of an orange icon is deliberate, as its color naturally draws the user's attention, reinforcing the overall message.
Additionally, a clear distinction is maintained between the message area and the calls-to-action (CTAs), achieved through a white background for the message and a very light blue for the CTAs.
The solution for suggestion 3:
Confirmation Dialog
Suggestion 3:
"It happened to my colleague multiple times that while filling out the form, he accidentally clicked on the dark background and it closed the form. This way he lost all the changes he had made.
Maybe this should not happen?"
To enable users to choose both options, checkboxes should be employed instead of radio buttons.
Checkboxes are commonly utilized when presenting lists of options, allowing users to select any number of choices. In essence, each checkbox operates independently within the list, so checking one box doesn't affect the others.
The solution for suggestion 2:
Checkboxes
Suggestion 2:
"For some projects I want to do both simultaneously:
Award work to subcontractors and collect estimates for budgeting. Can you make it possible
that I can select both at the same time?"
Initially, the concept involves displaying the number of users associated with each project at first glance.
Following each user's name, I opted to incorporate a tag (role) to intuitively convey the user's role within the project.
The inclusion of an icon labeled "Add new user" offers the Admin the capability to introduce new users to the project.
The presence of three dots provides additional options, allowing us to remove users from a project, manage their permissions, and incorporate other functionalities that may prove beneficial in the future.
The solution for suggestion 1:
Simplifying user management
Suggestion 1:
"Currently, only one user can be associated with each project.
We would like to be able to associate multiple users with each project, since normally a team of people
is working on a project, with each user taking on a different role in the context of that project."
📝
The Challenge
The Request from Constructio
"As a Product Designer, based on this message, you are asked to:
Create a specific graphical user interface design suggestion for each of the customer's requests based on the information you have. Describe how the solution works in a few sentences, so it could be given to a developer.
Separately, write some brief commentary detailing why you chose to design each solution in the way you did, and what alternatives (if any) you were considering while doing so."
"It happened to my colleague multiple times that while filling out the form, he accidentally clicked on the dark background and it closed the form. This way he lost all the changes he had made. Maybe this should not happen?"
Suggestion 3
Best,
Mr. Martin Schröder
"For some projects I want to do both simultaneously: Award work to subcontractors and collect estimates for budgeting. Can you make it possible that I can select both at the same time?"
Suggestion 2
Best,
Mr. Martin Schröder
"Currently, only one user can be associated with each project. We would like to be able to associate multiple users with each project, since normally a team of people is working on a project, with each user taking on a different role in the context of that project. Could you extend the form to make this possible?"
Best,
Mr. Martin Schröder
Suggestion 1
📨
How it all starts
An important customer writes an email to the
company with the following suggestions:
Product Design
Software as a Service
Web Application
UI KIT