Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-60701

Theme Boost: Improve design / dimensions of page header

    XMLWordPrintable

    Details

    • Type: Improvement
    • Status: Open
    • Priority: Minor
    • Resolution: Unresolved
    • Affects Version/s: 3.4
    • Fix Version/s: None
    • Component/s: Themes
    • Labels:
      None

      Description

      We came up with this issue especially because on small screens the page header takes so much space whilst it contains very few information.

      So, we thought of adding media queries to make the dimensions at least on mobile devices smaller.

      However, I would propose to improve the page header in general.

      Status quo

      • The page header displays the user's name and his avatar on many sites (e.g. dashboard, private files, user profile)
      • Especially the user's avatar picture blows up the size of the header
      • My login information is redundant on these sites as they are also displayed in the navbar that always stays in the sight because it is fixied to the top.

      Improvement proposal

      • Because I know who I am and I can always check my login status in the fixed to top navbar, I would remove user's information in the header entirely.
      • The page header cards could get a heading displaying the last breadcrumb title which is the most specific page a user is visiting currently

      Advantages

      • This would shrink the dimensions of the page header on all screen sizes, which means that there are no special media queries necessary for small screens.
      • Users would not see their name and avatar so often as they know who they are
      • Users get the information which page they are visiting currently with a quick view

      Mock ups

      Following some Mockups displaying the status quo and the result of the proposed solution:

      Status quo Proposal

        Attachments

        1. dashboard_proposal.png
          dashboard_proposal.png
          40 kB
        2. dashboard_status_quo.png
          dashboard_status_quo.png
          44 kB
        3. private_files_proposal.png
          private_files_proposal.png
          44 kB
        4. private_files_status_quo.png
          private_files_status_quo.png
          46 kB
        5. profile_proposal.png
          profile_proposal.png
          76 kB
        6. profile_status_quo.png
          profile_status_quo.png
          84 kB

          Issue Links

            Activity

              People

              • Assignee:
                Unassigned
                Reporter:
                kosswa Kathrin Osswald
                Participants:
                Component watchers:
                Bas Brands, Amaia Anabitarte, Carlos Escobedo, Ferran Recio, Sara Arjona (@sarjona), Víctor Déniz Falcón
              • Votes:
                3 Vote for this issue
                Watchers:
                6 Start watching this issue

                Dates

                • Created:
                  Updated: