New Navigation in CodeGrade!

We're excited to announce New Navigation within the CodeGrade application, which will launch this summer!

New Navigation does the following:

1. Modernizes CodeGrade’s navigation
2. Enhances performance
3. Improves the overall look and feel

This update introduces new designs and navigation patterns to streamline your experience.

So, what’s changed?

The new navigation framework

Left sidebar

The sidebar's role has been refined. Previously, it was heavily used for navigating the app and within entities. Now, it serves primarily to access the profile page. Navigation to courses and assignments no longer occurs through the sidebar.

Breadcrumbs

Every page now features a hierarchical breadcrumb trail at the top, clearly showing your current location within the app.

Clicking any part of the breadcrumb (except the final entry) will navigate you back to that page.

The final item in the breadcrumb is a dropdown menu. The top section of this dropdown provides actions for the current page or links to related locations. The bottom section allows you to navigate to other items at the same level, such as switching between submissions from different users.

Page menu

Located on the right-hand side of the screen, the Page Menu is your primary tool for navigating within a page. 

The top section contains page categories, replacing the previous category selector in the page header. Some categories can be expanded for more granular navigation.

The bottom section contains links to related or external entities. 

Action buttons

To improve clarity, we are moving away from buttons that contain only icons. In their place, we are introducing a new "Actions" button. This dropdown menu contains less frequently used options, with each action clearly described in words. When positioned next to a primary action like "Edit," the menu will also include that primary action.