nextcloud / nextcloud/server

Compact Mode Needed - Most Nextcloud Pages are Empty-Space

Open
#40,627 1 comment 6 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

0. Needs triage design enhancement
Dominant language
PHP
Stars
36.9k
Forks
5.2k
Avg merge
2d 3h
Merged PRs (30d)
713

Description

How to use GitHub
  • Please use the 👍 reaction to show that you are interested into the same feature.
  • Please don't comment if you have no relevant information to add. It's just extra noise for everyone subscribed to this issue.
  • Subscribe to receive notifications on status change and new comments.

Is your feature request related to a problem? Please describe.

When looking at any of the applications, contacts in particular, but the left Nav-pane in every app, the information is very sparse and it is frustrating to have to scroll to see a minimal amount of wanted information. A laptop with 1600x900 resolution should be able to see an entire contact, including the Detailed Name, Address Book, and Contract Groups. Instead that requires scrolling.

Taking some time to sort out why Nextcloud is so frustrating to use compared to say eGroupware, is I am basically looking at a lot of empty space on each page and the needed information isn't shown, or for navigation, there is an excessive amount of scrolling required.

Why is that? Well, I measured the nav-pane and there is a full 30px of empty-space between each of the generated name icons showing the initials. There is close to 50px of empty-space not including the generated initials icons between every item in the nav-pane (or contact in the contact list). Looking closer, the initials icons are really just fluff. They don't provide any useful information, but take an extra 20px per name in the nav-panel. Yes, if there was a photo for the contact, that would be appropriate, but for just wanting to quickly browse the nav-pane or rifle though the contacts to find a contact I can't recall a search-term for, the sparse layout is trying.

Don't get me wrong, I'm not against having the icons, or the photos, they look very nice -- for people that want to see that kind of non-information content. However, for those that want only relevant information at their fingertips without having to excessively scroll or search to reach it -- it is very frustrating.

For example, here is the measured spacing between the initials icons (in pixels):

nextcloud-nav-30px-empty

The looking at the overall spacing between names in the nav-pane (contact list), it's nearly 50px of empty-space between each name:

nextcloud-address-list-50px-empty

Then on the actual contact window, there is a whopping 200px between the name at top and the first piece of actual contact information for that person, e.g.

nextcloud-address-200px-empty

There is no way to make use of the address for copy/paste into another document without multiple copy/paste of each address component separately (subject of another feature request), and there is no way to see the Detailed Name, Address Book or Contact Group without scrolling on a 1600x900 laptop display.

There should be a compact way to view all of this information in 200px total (100px ideally). Instead the page is essentially empty with a single column of information stretched into 1200+px of vertical display space. (likely for mobile use, but the web-interface isn't only used by mobile users -- there are Nextcloud apps for that...)

That's a whole lot of wasted screen real estate. This same sparseness of actual information permeates nearly all applications (with the exception of Tasks which has a nice concise tabular display).

Describe the solution you'd like

Now the theme, default color choices, light/dark modes are all really nice, and for those that like the way Nextcloud looks right now, they should continue to be able to use it that way, but for people that actually have to use the information Nextcloud provides access to, there needs to be a Compact Mode.

The Compact Mode would eliminate the cruft, non-information, info displayed on the pages like the big circular initials icons in the nav-pane. The margins and padding would be reduced to minimal easily readable size (4px above/below is a good rule). The large border-radius used on hover would be reduced accordingly (or eliminated). The font would be reduced (or size selectable by the user). The information displayed would be in a concise (LOCALE appropriate) format.

Instead of 1 contact spilling over 1200px of vertical space, 5 or 6 full name, address, Address Book, Contact Group would be shown. A nice concise simple tabular or grid display is fine. The same would apply to Compact Mode for all apps, minimize padding/margins and reducing the blank space on each page to maximize the information shown in the available screen real estate.

Describe alternatives you've considered

I've tried the theme and font settings to reduce the font size, etc.., that does not effect the empty-space between the actual information. I've tried changing browser zoom level to see how the dynamic layout of information responds, it improves, but doesn't fix the basic issue of empty-space on the page.

A Compact Mode would provide user-choice on how they see information Nextcloud provides and a way to minimize the empty-space that makes up a lot of each page.

Additional context

Don't get me wrong, Nextcloud has a nice look, but it has to be functional as well as pretty. For those that want the current sparse look, don't change a thing, it does look nice, but for those that need to see fine-grained information and as much as possible without having to continually scroll, a Compact Mode would be a great compliment for what Nextcloud provides.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

No files, tests, or entry points are named, and the request spans Contacts and potentially every application. Start by locating the Contacts navigation and contact-detail UI, then establish a scoped definition of Compact Mode and how completion will be verified without changing the existing default layout.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, php
Domain
design, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.