Better visual design and visual options

Features wanted...
shadi.lahham
Posts: 28
Joined: 17 Jun 2013 18:06

Better visual design and visual options

Post by shadi.lahham »

This program is strong on the technical side, but very lacking on the human usability and visual sides.

I would suggest to stop the development of technical features for a while and instead focus on the study and implementation of visual and usability features that will add a lot to the easy of use of xyplorer.

In particular the various views are lacking very basic visual separation.

Take the detail view for example...
1. There is no way to add spacing between the rows. By default they are tightly packed, you can see if from the icons that almost touch. There is no space, no breathing room.

2. The same is noticeable in the column titles, there is almost no space between the column edge and the column title.

3. Column contents are tightly packed as well. You can resize the columns to slightly improve this, but this doesn't work when the content is right aligned, for example the Size and Type columns. They will forever just have 10 pixels between them no matter what you do.

4. The program by default starts with back as the font color. Black on white is a very strong visual mechanism and should only be used for important information. The default color should be toned down to some shade of dark grey.

5. The starting default font size is too small, especially on modern screens. This also worsens legibility.

Points 4 and 5 can easily be solved in the options, but they should be the default for new users so that the program is instantly usable and friendly.
There are many other examples like this, some hard coded, others which are slightly, but not completely, improved by playing with the options.

Programs like this one, with a huge amount of details, should make better use of space to improve legibility rather than try to pack as much information into as little space as possible.

Do not copy problems from Windows Explorer. Remember that Explorer is from 2001, the visual design of applications has improved a lot since then. Also remember that Microsoft has always been horrible at design!

There are tons of resources online about best practices for improving usability and visual design, and they are written in a very technical and summarized way that is easy to follow even for people that see them for the first time. Think of it as an API for design.

Basic visual design practices would improve this program a lot with very little effort.
Spacing is a way of giving programs breathing room and in a lot of cases more white space improves and even speeds up use actions because things are not cluttered and it's easy to see what you're looking for.

I hope the developer will give some importance to visual design aspects.
I appreciate all the technical genius behind this program, but the lack of usability makes even Windows Explorer still preferable to use.

P.S. Usability doesn't mean shortcuts and fast actions, features or sorting. It means a deep understanding of how people use software and a hierarchy and design of information on each page in a way that takes into account those insights.

Stef123

Re: Better visual design and visual options

Post by Stef123 »

shadi.lahham wrote: .. visual design practices would improve this program a lot with very little effort.
Spacing is a way of giving programs breathing room and in a lot of cases more white space improves and even speeds up use actions because things are not cluttered and it's easy to see what you're looking for.
You're taking it off my tongue, exactly. Couldn't have said it better. Been testing various file managers for days now, and XY is vastly superior in technical terms. But alas, when I time myself doing routine tasks - I am considerably slower than on competitive products (if only they wouldn't lack in great features)

Part of my being slower is due to old workflows I need to re-think, of course, and part to not yet knowing my way around. But then there is a bulk of very basic stuff- and you're right on spot - it has to do with visuals, with being overwhelmed by tiny icons that are crammed into one corner, I am missing the generous list layout of "Show in Groups", and many things like that.

j_c_hallgren
XY Blog Master
Posts: 5824
Joined: 02 Jan 2006 19:34
Location: So. Chatham MA/Clearwater FL
Contact:

Re: Better visual design and visual options

Post by j_c_hallgren »

Hi and welcome to the XY forum!
shadi.lahham wrote:Spacing is a way of giving programs breathing room and in a lot of cases more white space improves and even speeds up use actions because things are not cluttered and it's easy to see what you're looking for.
Have you checked out these tweaks:

Code: Select all

; Tweak: increase tree node indent in pixels
TreeNodeIndent=0
; Tweak: increase tree/catalog/list row height in pixels
TreeItemDistY=0
CatalogItemDistY=0
ListItemDistY=0
; Tweak: pixels at the right end of columns
ListDetailsColumnsSpacing=0
; Tweak: line height extra pixels
WinVistaExtraLineSpacing=2
Not sure if those will do what you want but it's worth a look...because Don's approach is to not fill the config dialog with values that only a few people may want, ok?
I hope the developer will give some importance to visual design aspects.
I appreciate all the technical genius behind this program, but the lack of usability makes even Windows Explorer still preferable to use.
And just as a point of info: The longer the list of items that new forum member posts in first post, the less likely that Don will accept it...if someone new came into your home and started saying this-and-that-and-that is wrong with your decorating, would you be happy? I'm not saying your comments don't have merit, but it's not the best way to begin here...ok? Thanks for understanding.
Still spending WAY TOO much time here! But it's such a pleasure helping XY be a treasure!
(XP on laptop with touchpad and thus NO mouse!) Using latest beta vers when possible.

TheQwerty
Posts: 4373
Joined: 03 Aug 2007 22:30

Re: Better visual design and visual options

Post by TheQwerty »

shadi.lahham wrote:1. There is no way to add spacing between the rows. By default they are tightly packed, you can see if from the icons that almost touch. There is no space, no breathing room.
The ability to add spacing is already there by using Ctrl+Shift+Wheel.

So 3 of the 5 can already be addressed today. If you think there would be better default settings for them, please suggest them.
shadi.lahham wrote:Do not copy problems from Windows Explorer. Remember that Explorer is from 2001, the visual design of applications has improved a lot since then. Also remember that Microsoft has always been horrible at design!
This is not correct - Windows '95 contained Windows Explorer. Further, XYplorer is from 1997 so it too has a long history.

I'd also argue that Microsoft hasn't always been horrible at design; they may not always be at the forefront (although comparing iOS 7 to WP 8 at this point may speak otherwise :lol: ), but they aren't terrible. In a lot of ways the argument could be made that Microsoft actually does much better than their competition at designing interfaces for all types of users. Apple's designs tend to be great for lesser experienced users and not so great for more advanced ones. While *nix has taken forever to realize that maybe every family doesn't want to have a dedicated IT person.


shadi.lahham wrote:Basic visual design practices would improve this program a lot with very little effort.
shadi.lahham wrote:P.S. Usability doesn't mean shortcuts and fast actions, features or sorting. It means a deep understanding of how people use software and a hierarchy and design of information on each page in a way that takes into account those insights.
These two statements are completely at odds with each other.
No one has ever obtained a deep understanding of anything with very little effort.


Personally, as much as I'd love to see XYplorer have a more modern UX (not just UI) - I think it would be such a monumental task and given other questionable circumstances (64-bit compiler availability, Microsoft's design roadmap, the future of Windows/PCs) I'm just not sure it will ever make sense in the current code-base's lifetime.

shadi.lahham
Posts: 28
Joined: 17 Jun 2013 18:06

Re: Better visual design and visual options

Post by shadi.lahham »

j_c_hallgren wrote:Have you checked out these tweaks...
No, it's good to know that it's possible to tweak things that way. I will give it a try and see what changes.
From the names of the parameters I see that there are already more options for improving the visuals.

But the point that I was making was not that "I need this or that feature", what I was saying was that
1. XYplorer has problems (some serious, some minor) from a visual/usability point of view which prevent it from becoming a great program.
2. The default settings (fresh install) should be changed so that they include the best practices from a usability point of view, so that new users will find it more friendly and usable.
j_c_hallgren wrote:...if someone new came into your home and started saying this-and-that-and-that is wrong with your decorating, would you be happy? I'm not saying your comments don't have merit, but it's not the best way to begin here...ok? Thanks for understanding.
Yes I understand, and I wasn't attacking. In fact those are the first things that just jumped immediately as soon as I started trying XYplorer. So I thought I should mentioned them to give a voice to this side of things that seems to have been ignored.

There are many resources out there.
Here's an example http://www.amazon.com/Visual-Usability- ... 0123985366,
but there are many other free and digital ones.

Following are some more examples that have to do with tables and grids that could be relevant to XYplorer.
Please note that I did a 5min google search for these, better guides can be found with a little more searching.

http://designingwebinterfaces.com/ultim ... i-patterns
http://www.smashingmagazine.com/2008/10 ... practices/
http://www.propublica.org/nerds/item/de ... s-graphics
https://aim.uoregon.edu/research/pdfs/Stabina2005.pdf (look at the example in the appendix, it's very simplistic and not directly relevant, but it shows that even a few correct design choices can impact visibility and easy of viewing greatly)

I hope this helps

shadi.lahham
Posts: 28
Joined: 17 Jun 2013 18:06

Re: Better visual design and visual options

Post by shadi.lahham »

TheQwerty wrote: If you think there would be better default settings for them, please suggest them.
If I start using and customizing XYplorer I can submit my ini file as an example of better 'default' settings.
TheQwerty wrote: This is not correct - Windows '95 contained Windows Explorer. Further, XYplorer is from 1997 so it too has a long history.
I was referring to the XP version of W.E. that seems to be the closest to XYplorer in terms of look and feel.
Anyway, the point is visual design of applications has matured a lot since 1995 or 2001 and XYplorer would do well to mature (visually) as well.
TheQwerty wrote: I'd also argue that Microsoft hasn't always been horrible at design ...
I wasn't referring to MS, Apple or *nix, visual design and usability are beyond OSes or specific applications.
They are guidelines that have been achieved after a lot of though, experimentation and testing and have been tested and improved over time.
TheQwerty wrote:
shadi.lahham wrote:Basic visual design practices would improve this program a lot with very little effort.
shadi.lahham wrote:P.S. Usability doesn't mean shortcuts and fast actions, features or sorting. It means a deep understanding of how people use software and a hierarchy and design of information on each page in a way that takes into account those insights.
These two statements are completely at odds with each other.
No one has ever obtained a deep understanding of anything with very little effort.
No they are not. Following basic design principles takes very little effort because other people have put thought and effort into understanding UX issues globally and thus arrived at Guidelines, best practices and design principles. There still needs to be some specific study to apply them to XYplorer specifically, but there is no need to re-invent usability and design to do that.
I hope it's clearer to you now.
TheQwerty wrote: Personally, as much as I'd love to see XYplorer have a more modern UX (not just UI) - I think it would be such a monumental task and given other questionable circumstances (64-bit compiler availability, Microsoft's design roadmap, the future of Windows/PCs) I'm just not sure it will ever make sense in the current code-base's lifetime.
We are not talking about a complete overhaul here .. we're following the 80/20 rule, doing minor changes (20% effort) that achieve the most impact (80%) improvement.

Anyone that has anything to do with UX and UI would agree that there are even minor things that would make XYplorer better with just small improvements like spacing, contrasts, font size, hierarchy.

Professional graphic design work would also be nice (maybe partner with someone from Deviantart) but that is not the main issue.
Simple meaningful icons work just as well. They have to be well thought out though.

Filehero
Posts: 2644
Joined: 27 Feb 2012 18:50
Location: Windows 10 Pro x64

Re: Better visual design and visual options

Post by Filehero »

Well,

there's always room for improvements, and Don is the last person in this universe (don't know about the others) to disagree.

What is obvious to me is:
1. Both of you probably haven't spent sufficient time to get beyond scratching XY's surface. And as you will read below, even after a year of heavy usage I still find "new" features.

2. Well not everybody uses "modern screens", simple as that (even I with my 27" 16:10 screen start to become ancient, now consider those working with 1280x1024 or even 1024x768). And not everybody likes eye-candy. And not everyone asks for "modern" GUI design principles, especially since there are literally hundreds of them.

shadi.lahham wrote: http://designingwebinterfaces.com/ultim ... i-patterns
http://www.smashingmagazine.com/2008/10 ... practices/
http://www.propublica.org/nerds/item/de ... s-graphics
https://aim.uoregon.edu/research/pdfs/Stabina2005.pdf (look at the example in the appendix, it's very simplistic and not directly relevant, but it shows that even a few correct design choices can impact visibility and easy of viewing greatly)
I'm really sorry, but your random set of links is simply off. Some stuff deals with the design of web interfaces with no obvious link to XY's list view. Another link reveals an article on context specific data presentation, and yet another one deals with spreadsheet use cases (the list view at first is no spreadsheet).

My advice:
- take your time to learn XY's huge set of customization options (for instance, look out for Folder Views, Color Filters or Custom File Icons)
- try to get some more inspiration from this forum, you could start with Show off your XYplorer!
- if you don't have time for it, stop being generic and start becoming concrete (current situation/problems deriving/solution)
TheQwerty wrote:The ability to add spacing is already there by using Ctrl+Shift+Wheel.
Arghhhh, another great feature I successfully managed to overlook. :mrgreen: Thanks heaps. :D


Edit: added some missing words regarding display solutions

Cheers,
Filehero
Last edited by Filehero on 17 Jun 2013 20:19, edited 1 time in total.

j_c_hallgren
XY Blog Master
Posts: 5824
Joined: 02 Jan 2006 19:34
Location: So. Chatham MA/Clearwater FL
Contact:

Re: Better visual design and visual options

Post by j_c_hallgren »

Filehero wrote:2. Well not everybody uses "modern screens", simple as that (even I with my 27" 16:10 screen start to become ancient, no consider those. And not everybody likes eye-candy. And not everyone asks for "modern" GUI design principles, especially since there are literally hundreds of them.
Exactly! I'm using a 5+ yr old laptop with XP and I'm still getting used to the XP look as had been using W2K until last year so anything more modern than that looks bad to me...I have to use W7 at library and I have real issues with that style of design as it's not as clear to me...so I like the slightly older look of XY as it fits right in with my needs.
Still spending WAY TOO much time here! But it's such a pleasure helping XY be a treasure!
(XP on laptop with touchpad and thus NO mouse!) Using latest beta vers when possible.

admin
Site Admin
Posts: 60598
Joined: 22 May 2004 16:48
Location: Win8.1 @100%, Win10 @100%
Contact:

Re: Better visual design and visual options

Post by admin »

Interesting topic. I'm interested in it since I'm doing this, and I'm working on it day and night for 16 years now.
There is no simple good and bad in interface design, it depends at least on who you are, what you want, and what can be done. That's a BIG triangle.
I did not hear anything that convinces of changing anything of the current setup.
But, of course, I'm always open for good ideas.

Generally, I'm all for white space, but the problem is at the other side: the black space. This is the part that cannot be easily generalized. Each user needs his specific black space. And therefore XY is extremely customizable. So you can maximize your personal white space by optimizing your personal black space.

binocular222
Posts: 1416
Joined: 04 Nov 2008 05:35
Location: Hanoi, Vietnam

Re: Better visual design and visual options

Post by binocular222 »

Just had a look at fresh install and this is my opinion:
- Default font size is a little small
- Should enable "Autosized column" in List
- Everything else is ok. Flat buttons is a plus over "modern UI concepts" such as Tabbed Toolbar.
- First impression on first run is important to convince new users to continue exploring further. Once he start touching F9, the power of XYplorer start shinning.
I'm a casual coder using AHK language. All of my xys scripts:
http://www.xyplorer.com/xyfc/viewtopic. ... 243#p82488

admin
Site Admin
Posts: 60598
Joined: 22 May 2004 16:48
Location: Win8.1 @100%, Win10 @100%
Contact:

Re: Better visual design and visual options

Post by admin »

Default font size is a little small: Really? Is it smaller than in Windows Explorer?
Should enable "Autosized column" in List: Not sure. If you have very long file names this setting is not so great IMO.

admin
Site Admin
Posts: 60598
Joined: 22 May 2004 16:48
Location: Win8.1 @100%, Win10 @100%
Contact:

Re: Better visual design and visual options

Post by admin »

BTW, I agree with shadi.lahham that the columns are a bit tight. I will see if I make this configurable.

EDIT: Ah, there is already the tweak ListDetailsColumnsSpacing for this. So should this be raised to UI, or should the factory default for this value be raised from 0 to 2 or even 4? Not sure...

grindax

Re: Better visual design and visual options

Post by grindax »

.
Last edited by grindax on 23 Jan 2016 19:58, edited 1 time in total.

admin
Site Admin
Posts: 60598
Joined: 22 May 2004 16:48
Location: Win8.1 @100%, Win10 @100%
Contact:

Re: Better visual design and visual options

Post by admin »

grindax wrote:
admin wrote:Ah, there is already the tweak ListDetailsColumnsSpacing for this. So should this be raised to UI, or should the factory default for this value be raised from 0 to 2 or even 4? Not sure...
IMO the current default is OK, but it probably makes sense to have this configurable as a setting in the GUI.
Well, most people will never have the idea that this could be configurable and thus not look for it. I'll wait until somebody is screaming for it.

j_c_hallgren
XY Blog Master
Posts: 5824
Joined: 02 Jan 2006 19:34
Location: So. Chatham MA/Clearwater FL
Contact:

Re: Better visual design and visual options

Post by j_c_hallgren »

admin wrote:
grindax wrote:
admin wrote:Ah, there is already the tweak ListDetailsColumnsSpacing for this. So should this be raised to UI, or should the factory default for this value be raised from 0 to 2 or even 4? Not sure...
IMO the current default is OK, but it probably makes sense to have this configurable as a setting in the GUI.
Well, most people will never have the idea that this could be configurable and thus not look for it. I'll wait until somebody is screaming for it.
I haven't looked at it lately, but maybe as compromise, could some of these tweaks be documented in Help in a special 'tweak' section if they aren't already? Not everyone is going to search the INI for possible solutions...all it would need in Help is the variable name and the description from INI in most cases.
Still spending WAY TOO much time here! But it's such a pleasure helping XY be a treasure!
(XP on laptop with touchpad and thus NO mouse!) Using latest beta vers when possible.

Post Reply