[UX] The Profile Settings Page is too long and contains huge fields in one section.

[alamenai]

Issue description

In the Settings page all sections are expanded by default ( no show more options ) which makes the length too long. In addition, all fields are hand-typing without autocompletes.

Case one :

• I want to change just username and save it. Why I need to scroll the whole page to click save ?.

Case two :

• I want to change my skills tags but the Textarea has not an autocomplete for skills badges. See stackoverflow example.

Case three:

• Most users will not have all links you provided once time.

Issue Solution

Case one:

• Move save button to the left side with fixed-position.

Case two :

• Add autocomplete suggestions based on user reactions and/or his posts.

Case three :

• Provide only common URLs and let users show more options.

[rhymes]

Hi @MenaiAla, would it be possible to split this in three separate issues? Though they pertain to the same area they are indeed three different feature requests.

[alamenai]

@rhymes Would it possible to suggest titles for me?

[rhymes]

1. Settings: reduce scrolling for saving
2. Settings: add autocompletion for skills
3. Settings: emphasize common URLs

Something like this?

[TheJaredWilcurt]

The Links section should be reduced to a list of input fields where you can input any link. Then auto-detect if it is one of the "known" options and display a favicon for it. If you are worried about spam accounts putting spam links there, then just have a list of known-good domains, and others can be "pending approval". But this would fix the following issues:

• #7697 - Add Glitch link
• #6117 - Add DeviantArt link
• #6118 - Add Pinterest link
• #6087 - Add CodePen link
• #9646 - Add Twitter link

With this approach the length of the page is reduced, since we only need the link fields for links the user added + 1 empty field for them to add the next link to. Also, people are not arbitrarily prevented from linking to whatever sites they want. Any additional requests in the future would only require vetting a domain name then adding it to a list, and a new favicon. There are plenty of libraries, like simple-icons that can dynamically handle icons via CDN. You could even add to the white-list all of the social sites that simple-icons supports currently preemptively, thus making the process much smoother (one-time vetting process, followed by much more rare requests).

[ludwiczakpawel]

@MenaiAla

1. I believe this issue has been already fixed. We now show "SAVE" button attached to the bottom edge of the browser WHEN you make a change in any field. I believe it works on pages: /settings/profile and /settings/ux.

2. Having autocomplete for some fields definitely makes sense. But in terms of this particular field we first have to figure out whether or not this should be autocomplete or free form kind of a field where user can enter a bit more than just tags/keywords. I'm personally leaning towards first option (autocomplete with just tags).

3. I can see the issue and I think @TheJaredWilcurt 's suggestion is really nice. If you could create a separate issue for that (as @rhymes has suggested) I'd be happy to contribute some UI idea for this proposed solution 🙌

[rhymes]

@ludwiczakpawel regarding #3 they did:

• Reduce scrolling for saving: [Settings] reduce scrolling for saving #9240 which was partially addressed by Make profile settings save button sticky when modified #9378 Make UX settings save button sticky when modified #9478
• Settings: add autocompletion for skills: [Feature] Settings: add autocompletion for skills #9259
• Emphasize common URLs which is what @TheJaredWilcurt mentioned [Settings] emphasize common URLs #9287

I'm going to close this as it's an umbrella issue and we risk having multiple conversations as once.

@ludwiczakpawel @TheJaredWilcurt @MenaiAla please continue the conversation on the proper issues.