1. New User Interface Training Guide for eCat November 2013

2. Introduction The purpose of this document is to help users quickly and easily transition to the new interface for eCat. The new interface offers a streamlined approach to navigating and using the application. For questions or more information, please contact ecat@mit.edu or visit the website at https://ecat.mit.eduecat@mit.edu https://ecat.mit.edu 2

3. Where to find the information you need… This guide has two sections: Overview of the new interface – Navigation 101 – Introduces the new user interface and instructions on how to navigate around the three main areas of the interface. Side-by-side comparison – What is different? – Provides a side-by-side comparison showing how and where tasks were completed in the old interface as well as in the new interface. This information provides a great snapshot of differences. 3

4. Overview of the New Interface 4

5. Three Main Areas of the System There are three main areas of the new eCat user interface explained in this training guide. Side Navigation Menu Top Banner Main Workspace 5

6. Main Workspace The main workspace is where you view and manage the active screen. Only the main workspace changes as you access other areas within the site. The side navigation menu and top banner remain in place The navigation breadcrumb in the top left corner of the main workspace tells you where you are in the application A drop-down icon beside a page name indicates that you can select it to access another page Breadcrumbs display active page and navigation path. 6

7. Side Navigation Bar Most areas of the application are accessed from the Side Navigation bar. The side navigation bar contains the top-level menu items When you roll over the main menu icons, slide-out sub-menus display Menus are generally grouped by related tasks Click on the icon to return to the homepage from anywhere in the application 7

8. Accessed directly from the Shop menu, Product Quick Search allows you to do a simple item search. In addition, quickly access advanced search and favorites. Note: The quick-key Alt + P also allows access to the product search. The My Carts and Orders sub-menu contains options for viewing your active cart, draft shopping carts and your most recent orders. Some users may have access to the Admin sub-menu, where they can view draft carts from other users. Side Navigation Bar Shop Menu The Shop menu contains the menu options related to shopping tasks including product quick search, access to the shopping page, favorites, and access to carts and orders. 8

9. Document search tasks are accessed from the Document Search sub-menu. Side Navigation Bar Orders & Documents Menu Menu items related to Document Search are located in the Orders & Documents menu. 9

10. The View Contracts sub-menu contains all options for contract management. Side Navigation Bar Catalogs and Contracts Tasks related to contracts are located in the Catalogs and Contracts menu. 10

11. You can search on menu keywords to locate that menu in the application. In addition to menu option link, the search results display breadcrumbs that show you the path to the menu item. In addition to accessing the Menu Search from the side navigation bar, you can use the quick-access key combination Alt + M. Side Navigation Bar Menu Search Option If you are unsure of the location of a specific menu, you can use the Menu Search feature. Menu Search is a keyword search that returns a list of pages containing that keyword. Search results are clickable to take you directly to the page. 11

12. Side-by-Side Comparison – What is different? 12

13. General Navigation The new interface features a slide-out menu. Menu items stay out of the way until they are needed for a cleaner, less cluttered site. The Classic interface was navigated via a tab-driven menu that is always present across the top of the page. Sub-menu items were located in sub- navigation tabs. ClassicNew Interface In the new interface, tab navigation has been replaced by a clean, slide-out side menu that displays the available menu options. 13

14. Menu Item Groupings Classic interface often separated related pages on to separate tabs. For example, the shopping page and favorites page were located in individual tabs. ClassicNew Interface Menu options are grouped by related tasks, making them easier to locate. Pages are easier to find with a Menu Search option. A keyword search returns a list of pages containing that keyword. Search results are clickable to take you directly to the page. In the new interface, the menu has been reorganized in a more logical manner to make locating pages easier. A brand new feature in the new interface is a Menu Search option to help find pages that are not frequently used. 14

15. Action items were located on the shopping page. Clicking on the action item took you to the appropriate area of the application to complete the action. Action Items ClassicNew Interface Action items are located in the top banner making them accessible from all areas of the site. Clicking on the action item takes you to the appropriate area of the application to complete the action. In the new interface, action items are located in the top banner area, making them accessible from anywhere in the application. 15

16. Notifications are located in the top banner making them accessible from all areas of the site. Newer notifications are highlighted. You will continue to receive email notifications. Notifications Notifications were not viewable in the application. You were notified by email only. Classic New Interface Certain action items and/or tasks trigger notifications to specified users. These notifications are not viewable in the Classic interface and are available only by email. In the new interface, you can view these notifications in the top banner. As with action items, notifications can be accessed from anywhere in the application. 16

17. User profile tasks were accessed from a series of navigation tabs and sub-tabs. As shown below, additional task buttons may display on the main page of the user profile. User Profile ClassicNew Interface In the new interface, the user profile contains simpler navigation. A main user profile menu groups similar tasks in a logical manner and Quick Links contain most commonly used tasks. All options are available in a single user profile menu. Options are grouped by similar tasks. 17

18. User Profile (continued) ClassicNew Interface Users access their own profiles by selecting the drop- down menu beside the user’s name, and selecting View My Profile. Users would access their own profiles through the my profile link. 18

19. Cart Preview ClassicNew Interface The new interface features a Cart Preview. By clicking on the shopping cart icon, you can get a quick view of the active cart from anywhere in the application. Clicking the View My Cart button takes you to the active cart. Clicking the Checkout button takes you directly to the page where you can review all order details and checkout. To view your current cart in the Classic interface, it was necessary to leave the page you were on and go to the active cart tab. 19

20. Quick Search is still accessible from all pages, but is hidden until you select the icon to display it. You can also use the quick-key Alt + Q to access the Quick Search menu. Quick Search was located at the top-right of the screen. Quick Search ClassicNew Interface 20

21. In Summary… The new interface provides a more modern, usable application for users. We hope you enjoy working in the system! The same functionality is available BUT the “look and feel” is different. For questions, please contact ecat@mit.edu or visit the website at https://ecat.mit.edu.ecat@mit.edu https://ecat.mit.edu 21

22. THIS PAGE LEFT INTENTIONALLY BLANK 22