Thread: Disabled or Not applicable Tabs design
Hi Hackers,
I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.
Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.
I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.
Please share your feedback on this.
Thanks,
Aditya Toshniwal
"Don't Complain about Heat, Plant a TREE"
Attachment
On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.
Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?
Dave Page
pgAdmin: https://www.pgadmin.org
PostgreSQL: https://www.postgresql.org
Attachment
Hello,
Comments inline..
On Fri, 21 Feb 2025 at 2:51 PM, Dave Page <dpage@pgadmin.org> wrote:
On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?
Agreed with Dave. We need to follow the GUI standards while designing, so that it’s more usable.
With the disabled gray label, we might change the disabled tab colour to dark gray, and on pointer move event, we can show the reason of disablement.
The use of semiotics on tabs may complex or provide a heavy look and feel.
Attachment
Hi Dave,
On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:
On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?
I thought of adding an icon for better accessibility. Greying is pretty straightforward.
Thanks,
Aditya Toshniwal
"Don't Complain about Heat, Plant a TREE"
Attachment
Hi Hackers,
Updated design:
On Fri, Feb 21, 2025 at 3:56 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Dave,On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?I thought of adding an icon for better accessibility. Greying is pretty straightforward.--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"
Thanks,
Aditya Toshniwal
"Don't Complain about Heat, Plant a TREE"
Attachment
Hello Aditya,
The above design looks good to me. We could improve visibility by adding vertical and horizontal lines in a combination of blue, gray, and black. Blue represents the current active tab, gray indicates a disabled tab, and black signifies available clickable options.
e.g.
Regards,
Zaid Shabbir
On Fri, Feb 21, 2025 at 3:32 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Hackers,Updated design:On Fri, Feb 21, 2025 at 3:56 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Dave,On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?I thought of adding an icon for better accessibility. Greying is pretty straightforward.--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"
Attachment
Hi Zaid,
On Fri, Feb 21, 2025 at 4:26 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:
Hello Aditya,The above design looks good to me. We could improve visibility by adding vertical and horizontal lines in a combination of blue, gray, and black. Blue represents the current active tab, gray indicates a disabled tab, and black signifies available clickable options.e.g.
That doesn't match the pgAdmin design. The colors which you mentioned are already being used.
Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:32 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Updated design:On Fri, Feb 21, 2025 at 3:56 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Dave,On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?I thought of adding an icon for better accessibility. Greying is pretty straightforward.--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"
Thanks,
Aditya Toshniwal
"Don't Complain about Heat, Plant a TREE"
Attachment
Hello,
Some other samples for the tabular window.
Aditiya it's just a suggestion, you can use the most suitable layout and colors.
Regards,
Zaid Shabbir
On Fri, Feb 21, 2025 at 3:59 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Zaid,On Fri, Feb 21, 2025 at 4:26 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:Hello Aditya,The above design looks good to me. We could improve visibility by adding vertical and horizontal lines in a combination of blue, gray, and black. Blue represents the current active tab, gray indicates a disabled tab, and black signifies available clickable options.e.g.That doesn't match the pgAdmin design. The colors which you mentioned are already being used.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:32 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Updated design:On Fri, Feb 21, 2025 at 3:56 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Dave,On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?I thought of adding an icon for better accessibility. Greying is pretty straightforward.--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"
Attachment
Hi Zaid,
Changing tab design will need changes in the complete application. It also needs to be discussed with everyone before changing it.
Anyway, it should not be part of the task I'm working on. You can open a separate thread for discussions.
On Fri, Feb 21, 2025 at 5:03 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:
Hello,Some other samples for the tabular window.Aditiya it's just a suggestion, you can use the most suitable layout and colors.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:59 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Zaid,On Fri, Feb 21, 2025 at 4:26 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:Hello Aditya,The above design looks good to me. We could improve visibility by adding vertical and horizontal lines in a combination of blue, gray, and black. Blue represents the current active tab, gray indicates a disabled tab, and black signifies available clickable options.e.g.That doesn't match the pgAdmin design. The colors which you mentioned are already being used.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:32 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Updated design:On Fri, Feb 21, 2025 at 3:56 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Dave,On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?I thought of adding an icon for better accessibility. Greying is pretty straightforward.--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"
Thanks,
Aditya Toshniwal
"Don't Complain about Heat, Plant a TREE"
Attachment
On Fri, 21 Feb 2025 at 11:40, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Zaid,Changing tab design will need changes in the complete application. It also needs to be discussed with everyone before changing it.Anyway, it should not be part of the task I'm working on. You can open a separate thread for discussions.
Agreed.
I do think the greyed option is the best way forward, even if there are potential improvements we could make to the design app-wide.
On Fri, Feb 21, 2025 at 5:03 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:Hello,Some other samples for the tabular window.Aditiya it's just a suggestion, you can use the most suitable layout and colors.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:59 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Zaid,On Fri, Feb 21, 2025 at 4:26 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:Hello Aditya,The above design looks good to me. We could improve visibility by adding vertical and horizontal lines in a combination of blue, gray, and black. Blue represents the current active tab, gray indicates a disabled tab, and black signifies available clickable options.e.g.That doesn't match the pgAdmin design. The colors which you mentioned are already being used.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:32 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Updated design:On Fri, Feb 21, 2025 at 3:56 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Dave,On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?I thought of adding an icon for better accessibility. Greying is pretty straightforward.--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"
Dave Page
pgAdmin: https://www.pgadmin.org
PostgreSQL: https://www.postgresql.org
Attachment
On Fri, Feb 21, 2025 at 4:47 PM Dave Page <dpage@pgadmin.org> wrote:
On Fri, 21 Feb 2025 at 11:40, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Zaid,Changing tab design will need changes in the complete application. It also needs to be discussed with everyone before changing it.Anyway, it should not be part of the task I'm working on. You can open a separate thread for discussions.Agreed.I do think the greyed option is the best way forward, even if there are potential improvements we could make to the design app-wide.On Fri, Feb 21, 2025 at 5:03 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:Hello,Some other samples for the tabular window.Aditiya it's just a suggestion, you can use the most suitable layout and colors.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:59 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Zaid,On Fri, Feb 21, 2025 at 4:26 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:Hello Aditya,The above design looks good to me. We could improve visibility by adding vertical and horizontal lines in a combination of blue, gray, and black. Blue represents the current active tab, gray indicates a disabled tab, and black signifies available clickable options.e.g.That doesn't match the pgAdmin design. The colors which you mentioned are already being used.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:32 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Updated design:On Fri, Feb 21, 2025 at 3:56 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Dave,On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?I thought of adding an icon for better accessibility. Greying is pretty straightforward.--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Dave PagepgAdmin: https://www.pgadmin.orgPostgreSQL: https://www.postgresql.org
Attachment
+1
On Fri, Feb 21, 2025 at 4:47 PM Dave Page <dpage@pgadmin.org> wrote:
On Fri, 21 Feb 2025 at 11:40, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Zaid,Changing tab design will need changes in the complete application. It also needs to be discussed with everyone before changing it.Anyway, it should not be part of the task I'm working on. You can open a separate thread for discussions.Agreed.I do think the greyed option is the best way forward, even if there are potential improvements we could make to the design app-wide.On Fri, Feb 21, 2025 at 5:03 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:Hello,Some other samples for the tabular window.Aditiya it's just a suggestion, you can use the most suitable layout and colors.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:59 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Zaid,On Fri, Feb 21, 2025 at 4:26 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:Hello Aditya,The above design looks good to me. We could improve visibility by adding vertical and horizontal lines in a combination of blue, gray, and black. Blue represents the current active tab, gray indicates a disabled tab, and black signifies available clickable options.e.g.That doesn't match the pgAdmin design. The colors which you mentioned are already being used.Regards,Zaid ShabbirOn Fri, Feb 21, 2025 at 3:32 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Updated design:On Fri, Feb 21, 2025 at 3:56 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Dave,On Fri, Feb 21, 2025 at 3:21 PM Dave Page <dpage@pgadmin.org> wrote:On Fri, 21 Feb 2025 at 09:38, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,I've been working on a new feature to restore a plain SQL using the pgAdmin restore dialog. Internally, it will select pg_restore or psql based on the format.Now, when restoring plain format the tabs like Data Options, Query Options are not applicable. So instead of going and disabling all the fields under these tabs, I think we can simply disable the complete tab.I've come up with the following UI design for the disabled tabs. The tabs will enable/disable based on the format selected.Please share your feedback on this.Normally when something is disabled, it is simply greyed out and made to not respond to input. Why not do the same here instead of designing a new way of indicating disabled state?I thought of adding an icon for better accessibility. Greying is pretty straightforward.--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Thanks,Aditya Toshniwal"Don't Complain about Heat, Plant a TREE"--Dave PagepgAdmin: https://www.pgadmin.orgPostgreSQL: https://www.postgresql.org
