/
Trends Wireframes Documentation

Trends Wireframes Documentation

Owned by Venkatasai Gudisa (Unlicensed)
Last updated: Nov 06, 2023
2 min read

Page 1 → Page 1 contains the user needs, motivations, and frustrations as well as the brainstorming stages of the wireframes designs

 

Components → Contains all of the components used in the designs (they will be referred to by their names)

  • extended-view-experience is the extended view of a class with the “Experience” tab selected

    • name is clickable (to track user demand)

  • extended-view-grades is the extended view of a class with the “Grades” tab selected

    • name is clickable (to track user demand)

  • compressed-view is the compressed view of the classes before a user clicks to extend it

    • name is clickable (to track user demand)

 

Homepage → Contains the lo-fidelity and hi-fidelity designs for the home page

 

Search Page (by class) → Has the search results pages that would come up when a user searches by class name

  • class-experience shows the results page when one of the classes (CS 4341) is clicked to extend and the “Experience” tab is selected

  • class-grades shows the results page when one of the classes (CS 4341) is extended and the grades tab is selected

    • graph-student-yr-filter depicts the class-grades page when the “Student Yr” filter is selected

  • basic functionality includes vertical scroll that reveals more cards; when one is clicked to extend, it scrolls the ones below it downward

 

Search Page (by class and prof) → Has the results page that comes up when a user searches by both class name and professor (ex: Alice Wang CS 4341)

  • also has the extended professor card on the left showing more information

  • basic functionality includes vertical scroll that reveals more cards; when one is clicked to extend, it scrolls the ones below it downward

 

Compare Page → shows the Compare page that’s accessible using the “Compare” button on the results pages

  • compare_page_<=3 is when there are <=3 classes to compare (the graph has more specific grades)

  • compare_page_>3 is when there are >3 pages (letter grades are grouped together)

 

Professor Cards → The cards on left side of screen in search results used to summarise a professor’s info

  • searching by class results in cards that contain only basic descriptions

    • overall rating, ratings in 4 other categories, and basic metadata about the statistics

  • searching by prof and class results in a card that has more information such as contact details and research info