advantium oven screen refresh
advantium oven screen refresh
advantium oven screen refresh
Worked on the Advantium OTA update which was an overhaul of the design and data structure of the Advantium Series of kitchen appliances for GE Appliances.
For this project, I worked with the UX Team to understand the existing structure of the Advantium system and to look into how this could be improved. Working with the Human factors team, we developed and tested an improved information architecture and layout design for the system with a major focus on the Precision Cooking/Speedcook part of the system.
Type
Screen Redesign
Client
GE Appliances
Collaborators
UX Designers, Human Factors Specialist & Developers
Role
Prototyping
Dev Handoff
Information Architecture
UI Design
Home Screen Redesign
Overhauled the Home Screen of the Advantium oven to incorporate multiple modes
Redesigned Layout
Redesigned screen layout to improve tap targets
Selector Menu Redesign
Improved layouts along with selectors to make information readily accessible
Worked on the Advantium OTA update which was an overhaul of the design and data structure of the Advantium Series of kitchen appliances for GE Appliances.
For this project, I worked with the UX Team to understand the existing structure of the Advantium system and to look into how this could be improved. Working with the Human factors team, we developed and tested an improved information architecture and layout design for the system with a major focus on the Precision Cooking/Speedcook part of the system.
Type
Screen Redesign
Client
GE Appliances
Collaborators
UX Designers, Human Factors Specialist & Developers
Role
Prototyping
Dev Handoff
Information Architecture
UI Design
Home Screen Redesign
Overhauled the Home Screen of the Advantium oven to incorporate multiple modes
Redesigned Layout
Redesigned screen layout to improve tap targets
Selector Menu Redesign
Improved layouts along with selectors to make information readily accessible
Worked on the Advantium OTA update which was an overhaul of the design and data structure of the Advantium Series of kitchen appliances for GE Appliances.
For this project, I worked with the UX Team to understand the existing structure of the Advantium system and to look into how this could be improved. Working with the Human factors team, we developed and tested an improved information architecture and layout design for the system with a major focus on the Precision Cooking/Speedcook part of the system.
Type
Screen Redesign
Client
GE Appliances
Collaborators
UX Designers, Human Factors Specialist & Developers
Role
Prototyping
Dev Handoff
Information Architecture
UI Design
Home Screen Redesign
Overhauled the Home Screen of the Advantium oven to incorporate multiple modes
Redesigned Layout
Redesigned screen layout to improve tap targets
Selector Menu Redesign
Improved layouts along with selectors to make information readily accessible
Design Comparisons
Move the handle left and right to see how the redesign impacted the interface. The older design is on the left, and the redesign is on the right.
Home Screen Redesign
Overhauled the Home Screen of the Advantium oven to incorporate multiple modes
Revamp Categories
Revamp category names and surface frequently used options that were nested within menus
Improved Selection
Added distinct button layouts for differing options for a better visual hierarchy
Clearer Options
Overhaul wording on relevant options
Figma Prototype
Design Comparisons
Move the handle left and right to see how the redesign impacted the interface. The older design is on the left, and the redesign is on the right.
Home Screen Redesign
Overhauled the Home Screen of the Advantium oven to incorporate multiple modes
Revamp Categories
Revamp category names and surface frequently used options that were nested within menus
Improved Selection
Added distinct button layouts for differing options for a better visual hierarchy
Clearer Options
Overhaul wording on relevant options
Figma Prototype
Design Comparisons
Move the handle left and right to see how the redesign impacted the interface. The older design is on the left, and the redesign is on the right.
Home Screen Redesign
Overhauled the Home Screen of the Advantium oven to incorporate multiple modes
Revamp Categories
Revamp category names and surface frequently used options that were nested within menus
Improved Selection
Added distinct button layouts for differing options for a better visual hierarchy
Clearer Options
Overhaul wording on relevant options
Figma Prototype
Case Study
Case Study
Case Study
Background
To get an understanding of the system, we looked into why the way the information needed to change. Firstly we found that in the current system, there were quite a few taps to get to a particular food item that the user would want to access.
Complex Nested Hierarchy
Unintuitive Naming Categories
Limited Display Options
Background
To get an understanding of the system, we looked into why the way the information needed to change. Firstly we found that in the current system, there were quite a few taps to get to a particular food item that the user would want to access.
Complex Nested Hierarchy
Unintuitive Naming Categories
Limited Display Options
Background
To get an understanding of the system, we looked into why the way the information needed to change. Firstly we found that in the current system, there were quite a few taps to get to a particular food item that the user would want to access.
Complex Nested Hierarchy
Unintuitive Naming Categories
Limited Display Options
In this case study of trying to cook some Filet Mignon, it takes the user 9 taps on the screen to get from the home screen to the cook screen. This was an unusually large amount of taps to get to the final cook screen. By looking at the screens, a conclusion was reached that to get to section where the initial Filet Mignon option was took too many taps.
The example of Filet Mignon can be looked into with more detail in this information architecture breakdown under the precision cook section of the current system. We focused a majority of our efforts in the precision cook section as it was the one with over 150 menu items.
To access the Filet Mignon option the user has to go through the following path Home > Precision Cook > Fresh > Meats > Beef > Filet Mignon. That right there is 5 taps just to access the cooking options for Filet Mignon. We felt this section could be drastically improved with some restructuring.
The other issue that we came across was ambiguity with naming schemes. Cuisines in particular was highlighted as the name seemed too ambiguous and some users had issues with navigating to certain items located in them. One user even brought up that they didn't think Fish Sticks would be nested under the American Cuisines section of Frozen Food.
The Crisp Reheat function didn't fit the mold of precision cooking. It was better suited to be a section of its own mainly due to its high frequency of usage.
In this case study of trying to cook some Filet Mignon, it takes the user 9 taps on the screen to get from the home screen to the cook screen. This was an unusually large amount of taps to get to the final cook screen. By looking at the screens, a conclusion was reached that to get to section where the initial Filet Mignon option was took too many taps.
The example of Filet Mignon can be looked into with more detail in this information architecture breakdown under the precision cook section of the current system. We focused a majority of our efforts in the precision cook section as it was the one with over 150 menu items.
To access the Filet Mignon option the user has to go through the following path Home > Precision Cook > Fresh > Meats > Beef > Filet Mignon. That right there is 5 taps just to access the cooking options for Filet Mignon. We felt this section could be drastically improved with some restructuring.
The other issue that we came across was ambiguity with naming schemes. Cuisines in particular was highlighted as the name seemed too ambiguous and some users had issues with navigating to certain items located in them. One user even brought up that they didn't think Fish Sticks would be nested under the American Cuisines section of Frozen Food.
The Crisp Reheat function didn't fit the mold of precision cooking. It was better suited to be a section of its own mainly due to its high frequency of usage.
In this case study of trying to cook some Filet Mignon, it takes the user 9 taps on the screen to get from the home screen to the cook screen. This was an unusually large amount of taps to get to the final cook screen. By looking at the screens, a conclusion was reached that to get to section where the initial Filet Mignon option was took too many taps.
The example of Filet Mignon can be looked into with more detail in this information architecture breakdown under the precision cook section of the current system. We focused a majority of our efforts in the precision cook section as it was the one with over 150 menu items.
To access the Filet Mignon option the user has to go through the following path Home > Precision Cook > Fresh > Meats > Beef > Filet Mignon. That right there is 5 taps just to access the cooking options for Filet Mignon. We felt this section could be drastically improved with some restructuring.
The other issue that we came across was ambiguity with naming schemes. Cuisines in particular was highlighted as the name seemed too ambiguous and some users had issues with navigating to certain items located in them. One user even brought up that they didn't think Fish Sticks would be nested under the American Cuisines section of Frozen Food.
The Crisp Reheat function didn't fit the mold of precision cooking. It was better suited to be a section of its own mainly due to its high frequency of usage.
“What steps can I take to enhance the navigation experience for Advantium oven users?”
“What steps can I take to enhance the navigation experience for Advantium oven users?”
“What steps can I take to enhance the navigation experience for Advantium oven users?”
Exploring Ideas
I brainstormed ideas with the UX team and put together some initial ideas to get the conversation flowing on improving this navigation structure. The team wanted to explore ideas that would use the existing layout of screens as well as look into more options that could be developed quickly.
Nested Toggle Switches
Search and Indexing
Populate Additional Options
Combining Parameters
Exploring Ideas
I brainstormed ideas with the UX team and put together some initial ideas to get the conversation flowing on improving this navigation structure. The team wanted to explore ideas that would use the existing layout of screens as well as look into more options that could be developed quickly.
Nested Toggle Switches
Search and Indexing
Populate Additional Options
Combining Parameters
Exploring Ideas
I brainstormed ideas with the UX team and put together some initial ideas to get the conversation flowing on improving this navigation structure. The team wanted to explore ideas that would use the existing layout of screens as well as look into more options that could be developed quickly.
Nested Toggle Switches
Search and Indexing
Populate Additional Options
Combining Parameters
Nested Toggle Switches
The user can choose between fresh and frozen in the precision cooking menu. We wanted to see how it would look if the option of Fresh vs Frozen was moved a lot later into the selection. This way, the users have to pick the item they want, and then they will be asked about their choice of fresh vs frozen. This would sometimes eliminate backtracking if the users were unsure about the section they were in.
Search and Indexing
Staying with the idea of improving our current layout, we considered including a search function. We felt this could allow the user to quickly search for the exact item they were looking for without going through the menu tree. We looked into a couple of different ways of searching.
Populate Additional Options
The existing layout for Advantium used a ribbon structure that could display a maximum of six elements at once. A pagination structure was used to help users navigate other menu items that weren't displayed on the first screen. We wanted to keep the general outline of the ribbon but increase the number of elements visible on each screen. This led to the ideation of a grid style display within a now-expanded ribbon. This way, each screen could accommodate 33% more items than before.
Combining Parameters
Once the users had selected their choice of food that they were ready to cook, they had to go through a few screens that would walk them through the size, quantity, and doneness (if applicable) of the food item. These screens would ask the users about their selections one after the other. We felt we could combine up to two selection parameters within the same screen. The information presented was enclosed in toggle selectors, and having multiple toggles helped compare the choices and have an overview of all the choices being made simultaneously.
Nested Toggle Switches
The user can choose between fresh and frozen in the precision cooking menu. We wanted to see how it would look if the option of Fresh vs Frozen was moved a lot later into the selection. This way, the users have to pick the item they want, and then they will be asked about their choice of fresh vs frozen. This would sometimes eliminate backtracking if the users were unsure about the section they were in.
Search and Indexing
Staying with the idea of improving our current layout, we considered including a search function. We felt this could allow the user to quickly search for the exact item they were looking for without going through the menu tree. We looked into a couple of different ways of searching.
Populate Additional Options
The existing layout for Advantium used a ribbon structure that could display a maximum of six elements at once. A pagination structure was used to help users navigate other menu items that weren't displayed on the first screen. We wanted to keep the general outline of the ribbon but increase the number of elements visible on each screen. This led to the ideation of a grid style display within a now-expanded ribbon. This way, each screen could accommodate 33% more items than before.
Combining Parameters
Once the users had selected their choice of food that they were ready to cook, they had to go through a few screens that would walk them through the size, quantity, and doneness (if applicable) of the food item. These screens would ask the users about their selections one after the other. We felt we could combine up to two selection parameters within the same screen. The information presented was enclosed in toggle selectors, and having multiple toggles helped compare the choices and have an overview of all the choices being made simultaneously.
Nested Toggle Switches
The user can choose between fresh and frozen in the precision cooking menu. We wanted to see how it would look if the option of Fresh vs Frozen was moved a lot later into the selection. This way, the users have to pick the item they want, and then they will be asked about their choice of fresh vs frozen. This would sometimes eliminate backtracking if the users were unsure about the section they were in.
Search and Indexing
Staying with the idea of improving our current layout, we considered including a search function. We felt this could allow the user to quickly search for the exact item they were looking for without going through the menu tree. We looked into a couple of different ways of searching.
Populate Additional Options
The existing layout for Advantium used a ribbon structure that could display a maximum of six elements at once. A pagination structure was used to help users navigate other menu items that weren't displayed on the first screen. We wanted to keep the general outline of the ribbon but increase the number of elements visible on each screen. This led to the ideation of a grid style display within a now-expanded ribbon. This way, each screen could accommodate 33% more items than before.
Combining Parameters
Once the users had selected their choice of food that they were ready to cook, they had to go through a few screens that would walk them through the size, quantity, and doneness (if applicable) of the food item. These screens would ask the users about their selections one after the other. We felt we could combine up to two selection parameters within the same screen. The information presented was enclosed in toggle selectors, and having multiple toggles helped compare the choices and have an overview of all the choices being made simultaneously.
Data Driven Decisions
Decisions on how to proceed forward were made with data collected from usage statistics. After consulting with the human factors team, the decision was made to showcase 8 menu options on one screen.
Eight Option Menu
Remove Low Usage Items
Revamp Item Categories
To reach our limit of 8 items per menu screen, we wanted to depopulate certain items in the menu that we felt didn't meet a target frequency threshold in the measured time span from July 2019 to February 2021. Items with a frequency of use under 100 were considered depopulation candidates.
With certain items depopulated from our initial list, a major restructure of the information architecture was required. Working with the data obtained from the Human Factors team, the Precision Cook section was split into 8 categories. Each category would either have 8 items listed in it or be split into different toggles, with the 8 items under them.
It is important to note that while 8 items is the maximum limit, there is no minimum limit for the items. Thus, specific categories have less than 8 items. Another reason for the lower item numbers was that there would be room to populate additional items if the need arose.
Data Driven Decisions
Decisions on how to proceed forward were made with data collected from usage statistics. After consulting with the human factors team, the decision was made to showcase 8 menu options on one screen.
Eight Option Menu
Remove Low Usage Items
Revamp Item Categories
To reach our limit of 8 items per menu screen, we wanted to depopulate certain items in the menu that we felt didn't meet a target frequency threshold in the measured time span from July 2019 to February 2021. Items with a frequency of use under 100 were considered depopulation candidates.
With certain items depopulated from our initial list, a major restructure of the information architecture was required. Working with the data obtained from the Human Factors team, the Precision Cook section was split into 8 categories. Each category would either have 8 items listed in it or be split into different toggles, with the 8 items under them.
It is important to note that while 8 items is the maximum limit, there is no minimum limit for the items. Thus, specific categories have less than 8 items. Another reason for the lower item numbers was that there would be room to populate additional items if the need arose.
Data Driven Decisions
Decisions on how to proceed forward were made with data collected from usage statistics. After consulting with the human factors team, the decision was made to showcase 8 menu options on one screen.
Eight Option Menu
Remove Low Usage Items
Revamp Item Categories
To reach our limit of 8 items per menu screen, we wanted to depopulate certain items in the menu that we felt didn't meet a target frequency threshold in the measured time span from July 2019 to February 2021. Items with a frequency of use under 100 were considered depopulation candidates.
With certain items depopulated from our initial list, a major restructure of the information architecture was required. Working with the data obtained from the Human Factors team, the Precision Cook section was split into 8 categories. Each category would either have 8 items listed in it or be split into different toggles, with the 8 items under them.
It is important to note that while 8 items is the maximum limit, there is no minimum limit for the items. Thus, specific categories have less than 8 items. Another reason for the lower item numbers was that there would be room to populate additional items if the need arose.
Settling on a Direction
With our information reordered and unused items depopulated, we settled on the final look and feel of the screens on the Advantium Oven.
Ribbon-less Categories
Toggle Parameters for Categories
Combine Selections Screens
Settling on a Direction
With our information reordered and unused items depopulated, we settled on the final look and feel of the screens on the Advantium Oven.
Ribbon-less Categories
Toggle Parameters for Categories
Combine Selections Screens
Settling on a Direction
With our information reordered and unused items depopulated, we settled on the final look and feel of the screens on the Advantium Oven.
Ribbon-less Categories
Toggle Parameters for Categories
Combine Selections Screens
Ribbon-less Categories
The ribbon like look was dropped in favor of a more cleaner, individual, button style look. This was done to make the categories stand out better and to make them stand out individually as selectors. We also felt this look would highlight grid style structure a lot better.
Toggle Parameters for Categories
Specific categories were given toggle parameters. These parameters would help switch between items that would be related and belong in the same section but would break the 8-item limit if displayed together.
Combine Selections Screens
The ribbon is not completely taken out of the equation. It still makes a comeback in the selection section of the process which was overhauled. Multiple selections in one screen are present with two different button styles to distinguish between the options. Icons are added to the pill shaped buttons to give added context to the action.
Ribbon-less Categories
The ribbon like look was dropped in favor of a more cleaner, individual, button style look. This was done to make the categories stand out better and to make them stand out individually as selectors. We also felt this look would highlight grid style structure a lot better.
Toggle Parameters for Categories
Specific categories were given toggle parameters. These parameters would help switch between items that would be related and belong in the same section but would break the 8-item limit if displayed together.
Combine Selections Screens
The ribbon is not completely taken out of the equation. It still makes a comeback in the selection section of the process which was overhauled. Multiple selections in one screen are present with two different button styles to distinguish between the options. Icons are added to the pill shaped buttons to give added context to the action.
Ribbon-less Categories
The ribbon like look was dropped in favor of a more cleaner, individual, button style look. This was done to make the categories stand out better and to make them stand out individually as selectors. We also felt this look would highlight grid style structure a lot better.
Toggle Parameters for Categories
Specific categories were given toggle parameters. These parameters would help switch between items that would be related and belong in the same section but would break the 8-item limit if displayed together.
Combine Selections Screens
The ribbon is not completely taken out of the equation. It still makes a comeback in the selection section of the process which was overhauled. Multiple selections in one screen are present with two different button styles to distinguish between the options. Icons are added to the pill shaped buttons to give added context to the action.
Internal Feedback Integration
We had a solid idea of what our design would be at this point. Before being handed over to the developers, we had an internal meeting to discuss the designs and get multiple eyes on the screens for internal feedback. With this feedback, a few final tweaks were made to the design
Home Screen Tweaks
Consistency in Toggle Shapes
Removed Iconography
Internal Feedback Integration
We had a solid idea of what our design would be at this point. Before being handed over to the developers, we had an internal meeting to discuss the designs and get multiple eyes on the screens for internal feedback. With this feedback, a few final tweaks were made to the design
Home Screen Tweaks
Consistency in Toggle Shapes
Removed Iconography
Internal Feedback Integration
We had a solid idea of what our design would be at this point. Before being handed over to the developers, we had an internal meeting to discuss the designs and get multiple eyes on the screens for internal feedback. With this feedback, a few final tweaks were made to the design
Home Screen Tweaks
Consistency in Toggle Shapes
Removed Iconography
Home Screen
The Precision Cook feature was renamed to Speed Cook. The top selector toggle had its background changed to match the style of the buttons. The custom input feature was excluded from the screens due to some oversight so we had to find a way to incorporate the button on the home screen. A bigger ninth button was added to accommodate the "Custom Speed Cook" and a quick access "Microwave 30s" button.
Sub Category
The toggle selector deeper into the menu tree had its style changed to make it more consistent with the selector in the home screen.
Toggle Screens
The button in the selection screen had their colors altered to match the selectors mentioned before. We also removed the icons as some of the buttons had icons that were unclear and would not fit the context.
Home Screen
The Precision Cook feature was renamed to Speed Cook. The top selector toggle had its background changed to match the style of the buttons. The custom input feature was excluded from the screens due to some oversight so we had to find a way to incorporate the button on the home screen. A bigger ninth button was added to accommodate the "Custom Speed Cook" and a quick access "Microwave 30s" button.
Sub Category
The toggle selector deeper into the menu tree had its style changed to make it more consistent with the selector in the home screen.
Toggle Screens
The button in the selection screen had their colors altered to match the selectors mentioned before. We also removed the icons as some of the buttons had icons that were unclear and would not fit the context.
Home Screen
The Precision Cook feature was renamed to Speed Cook. The top selector toggle had its background changed to match the style of the buttons. The custom input feature was excluded from the screens due to some oversight so we had to find a way to incorporate the button on the home screen. A bigger ninth button was added to accommodate the "Custom Speed Cook" and a quick access "Microwave 30s" button.
Sub Category
The toggle selector deeper into the menu tree had its style changed to make it more consistent with the selector in the home screen.
Toggle Screens
The button in the selection screen had their colors altered to match the selectors mentioned before. We also removed the icons as some of the buttons had icons that were unclear and would not fit the context.
Usability Testing
As the design for the prototypes was being built, we worked with the human factors team to validate the proposed menu structure. Validation required the conduction of a usability test.
Testing Navigation & Menu Structure
We evaluated users' navigation in the current menu versus the proposed menu. To best capture this, we observed if they were able to quickly and efficiently find their desired food item within the menu structures.
Current and Novice Users
Tests were conducted with two sets of user groups. Current Advantium Users are individuals who currently own an Advantium and have used Precision Cooking. Novice Advantium Users are those who are in the market for a speed cook oven.
Remote Treejack Test
Testing was done remotely. Each participant received the text-only hierarchy of each menu structure. Within each structure, they are asked to find specific menu items. We then compared these results to evaluate time, efficiency, and usability of the structures.
Participants were asked to find a total of 17 items per menu structure. Items were chosen based on frequency of usage data. The top 15 items were used in conjunction with two items that we felt may be difficult for users to find.
The following is an example of how users would navigate and find Baked Potatoes in the menu structure.
Usability Testing
As the design for the prototypes was being built, we worked with the human factors team to validate the proposed menu structure. Validation required the conduction of a usability test.
Testing Navigation & Menu Structure
We evaluated users' navigation in the current menu versus the proposed menu. To best capture this, we observed if they were able to quickly and efficiently find their desired food item within the menu structures.
Current and Novice Users
Tests were conducted with two sets of user groups. Current Advantium Users are individuals who currently own an Advantium and have used Precision Cooking. Novice Advantium Users are those who are in the market for a speed cook oven.
Remote Treejack Test
Testing was done remotely. Each participant received the text-only hierarchy of each menu structure. Within each structure, they are asked to find specific menu items. We then compared these results to evaluate time, efficiency, and usability of the structures.
Participants were asked to find a total of 17 items per menu structure. Items were chosen based on frequency of usage data. The top 15 items were used in conjunction with two items that we felt may be difficult for users to find.
The following is an example of how users would navigate and find Baked Potatoes in the menu structure.
Usability Testing
As the design for the prototypes was being built, we worked with the human factors team to validate the proposed menu structure. Validation required the conduction of a usability test.
Testing Navigation & Menu Structure
We evaluated users' navigation in the current menu versus the proposed menu. To best capture this, we observed if they were able to quickly and efficiently find their desired food item within the menu structures.
Current and Novice Users
Tests were conducted with two sets of user groups. Current Advantium Users are individuals who currently own an Advantium and have used Precision Cooking. Novice Advantium Users are those who are in the market for a speed cook oven.
Remote Treejack Test
Testing was done remotely. Each participant received the text-only hierarchy of each menu structure. Within each structure, they are asked to find specific menu items. We then compared these results to evaluate time, efficiency, and usability of the structures.
Participants were asked to find a total of 17 items per menu structure. Items were chosen based on frequency of usage data. The top 15 items were used in conjunction with two items that we felt may be difficult for users to find.
The following is an example of how users would navigate and find Baked Potatoes in the menu structure.
Metrics of Success
Success Rate
Refers to the users correctly selecting the menu item provided in the task
Directness
Did the user go directly to the item, and if not, where did they look before making their selection
Time on Task
How long did it take for the user to complete each task
SUS Score
How did users rate the usability of the menu structures
Metrics of Success
Success Rate
Refers to the users correctly selecting the menu item provided in the task
Directness
Did the user go directly to the item, and if not, where did they look before making their selection
Time on Task
How long did it take for the user to complete each task
SUS Score
How did users rate the usability of the menu structures
Metrics of Success
Success Rate
Refers to the users correctly selecting the menu item provided in the task
Directness
Did the user go directly to the item, and if not, where did they look before making their selection
Time on Task
How long did it take for the user to complete each task
SUS Score
How did users rate the usability of the menu structures
Usability Test Results
The research results suggested that the proposed menu structure was superior in performance compared to the existing menu structure. Participants completed tasks quicker and more efficiently using the proposed structure. Participants also preferred the proposed structure over the current structure from a usability perspective.
100%
Success Rate
All the participants completed the tasks without skipping or encountering any errors. The tasks were not extremely difficult to complete as the users navigated until they found their desired item.
3% Improvement
Directness
The proposed structure received an overall directness score of 82
The current structure received an overall directness score of 79
27% Improvement
Time on Task
Both the Current Advantium Users and Novice Advantium Users completed the tasks quicker in the proposed structure.
40% Improvement
SUS Score
The proposed structure received an overall SUS score of 89 (97 percentile)
The current structure received an overall SUS score of 70 (58 percentile)
Usability Test Results
The research results suggested that the proposed menu structure was superior in performance compared to the existing menu structure. Participants completed tasks quicker and more efficiently using the proposed structure. Participants also preferred the proposed structure over the current structure from a usability perspective.
100%
Success Rate
All the participants completed the tasks without skipping or encountering any errors. The tasks were not extremely difficult to complete as the users navigated until they found their desired item.
3% Improvement
Directness
The proposed structure received an overall directness score of 82
The current structure received an overall directness score of 79
27% Improvement
Time on Task
Both the Current Advantium Users and Novice Advantium Users completed the tasks quicker in the proposed structure.
40% Improvement
SUS Score
The proposed structure received an overall SUS score of 89 (97 percentile)
The current structure received an overall SUS score of 70 (58 percentile)
Usability Test Results
The research results suggested that the proposed menu structure was superior in performance compared to the existing menu structure. Participants completed tasks quicker and more efficiently using the proposed structure. Participants also preferred the proposed structure over the current structure from a usability perspective.
100%
Success Rate
All the participants completed the tasks without skipping or encountering any errors. The tasks were not extremely difficult to complete as the users navigated until they found their desired item.
3% Improvement
Directness
The proposed structure received an overall directness score of 82
The current structure received an overall directness score of 79
27% Improvement
Time on Task
Both the Current Advantium Users and Novice Advantium Users completed the tasks quicker in the proposed structure.
40% Improvement
SUS Score
The proposed structure received an overall SUS score of 89 (97 percentile)
The current structure received an overall SUS score of 70 (58 percentile)
Impacts
Looking back to the start of the project, the screens were almost completely overhauled in their menu structure. We managed to get a more direct path to the food items that users were looking for and revisiting an example from earlier to get to cooking a Filet Mignon, the user now has only 7 taps instead of 9 taps. This was a 22% reduction in the user's required taps.
As the designs were being handed off to the developers, the screens had to be reskinned for a different brand too. The same structure and layout were maintained when he screens were reskinned for Monogram. The only changes were in the styling. Buttons, colors, and imagery were changed to be consistent with branding guidelines.
Impacts
Looking back to the start of the project, the screens were almost completely overhauled in their menu structure. We managed to get a more direct path to the food items that users were looking for and revisiting an example from earlier to get to cooking a Filet Mignon, the user now has only 7 taps instead of 9 taps. This was a 22% reduction in the user's required taps.
As the designs were being handed off to the developers, the screens had to be reskinned for a different brand too. The same structure and layout were maintained when he screens were reskinned for Monogram. The only changes were in the styling. Buttons, colors, and imagery were changed to be consistent with branding guidelines.
Impacts
Looking back to the start of the project, the screens were almost completely overhauled in their menu structure. We managed to get a more direct path to the food items that users were looking for and revisiting an example from earlier to get to cooking a Filet Mignon, the user now has only 7 taps instead of 9 taps. This was a 22% reduction in the user's required taps.
As the designs were being handed off to the developers, the screens had to be reskinned for a different brand too. The same structure and layout were maintained when he screens were reskinned for Monogram. The only changes were in the styling. Buttons, colors, and imagery were changed to be consistent with branding guidelines.
Learnings
This was a fantastic project! I felt like I learned a lot on this project. Working with other people and seeing multiple rounds of iterations and design changes really improved my workflow. I became more cognizant of using components and how I could harness their power in making global changes. Keeping track of file versions and implementing change logs and version control on Figma files was an interesting little nugget I picked up.
Regarding design skills, I felt working with the human factors team would greatly benefit me. I saw firsthand how the proposed structures were tested, and these test results helped drive our point of redesign and advocating for change. The challenge to build multiple screens and paths within an actual short window was one I relished as it helped me think on my feet and quickly. Overall, a great project to work on and one that I will credit for many changes in how I approach the design process.
Learnings
This was a fantastic project! I felt like I learned a lot on this project. Working with other people and seeing multiple rounds of iterations and design changes really improved my workflow. I became more cognizant of using components and how I could harness their power in making global changes. Keeping track of file versions and implementing change logs and version control on Figma files was an interesting little nugget I picked up.
Regarding design skills, I felt working with the human factors team would greatly benefit me. I saw firsthand how the proposed structures were tested, and these test results helped drive our point of redesign and advocating for change. The challenge to build multiple screens and paths within an actual short window was one I relished as it helped me think on my feet and quickly. Overall, a great project to work on and one that I will credit for many changes in how I approach the design process.
Learnings
This was a fantastic project! I felt like I learned a lot on this project. Working with other people and seeing multiple rounds of iterations and design changes really improved my workflow. I became more cognizant of using components and how I could harness their power in making global changes. Keeping track of file versions and implementing change logs and version control on Figma files was an interesting little nugget I picked up.
Regarding design skills, I felt working with the human factors team would greatly benefit me. I saw firsthand how the proposed structures were tested, and these test results helped drive our point of redesign and advocating for change. The challenge to build multiple screens and paths within an actual short window was one I relished as it helped me think on my feet and quickly. Overall, a great project to work on and one that I will credit for many changes in how I approach the design process.