Re: [Design update] Style guide for pgAdmin4

From: Shirley Wang <swang(at)pivotal(dot)io>
To: Dave Page <dpage(at)pgadmin(dot)org>
Cc: pgadmin-hackers <pgadmin-hackers(at)postgresql(dot)org>
Subject: Re: [Design update] Style guide for pgAdmin4
Date: 2017-05-02 19:47:02
Message-ID: CAPG3WN4-KTS0p6rRPxpXNqY8az+Sw8NQHfjx+RFYc8ZqB_00TQ@mail.gmail.com
Views: Raw Message | Whole Thread | Download mbox | Resend email
Thread:
Lists: pgadmin-hackers

Hello!

*Update on colors*
As of now, there are several greys are very similar, used across multiple
areas of pgAdmin with no overlaps on color.
[image: greys-in-pgAdmin.png]
Here are the greys organized by scale, with the narrowed down greys
underneath:
[image: v1- palette.png]

The palette of 6 greys is flexible enough to be used across all the areas
within pgAdmin, and easier to map consistency.[image: v1.png]
Here's what it looks like with the 6 greys

*Dropdown menus*
Change from having white hover to dark grey, keeps text color the same
[image: Screen Shot 2017-05-02 at 11.35.54 AM.png]

*Query tool*
[image: greys-v2 (1).png]
I think some interesting things with color contrast are introduced once we
look at the uneditable query editor as accessed through 'View all Data'.
[image: viewalldata-greys (2).png]
We can address this either by changing the greys in the results table, or
changing the grey in the query editor. As of now, I think changing the
query editor grey might work better to make sure that when columns are
selected in the 'Data Output' panel, they stand out with the blue.

If we lighten the editor table and fade out the text in the editor, it
would look like this:
[image: viewalldata-lightgrey-opacity.png]
Thoughts?

On Wed, Apr 26, 2017 at 11:24 PM Ashesh Vashi <ashesh(dot)vashi(at)enterprisedb(dot)com>
wrote:

> On Wed, Apr 26, 2017 at 9:56 PM, Dave Page <dpage(at)pgadmin(dot)org> wrote:
>
>>
>>
>> On Wed, Apr 26, 2017 at 4:45 PM, Shirley Wang <swang(at)pivotal(dot)io> wrote:
>>
>>>
>>>
>>> I think the addition of icons and some copy would help:
>>> [image: Screen Shot 2017-04-26 at 11.28.41 AM.png]
>>>
>>
>> Agreed.
>>
> +1
>
> --
>
> Thanks & Regards,
>
> Ashesh Vashi
> EnterpriseDB INDIA: Enterprise PostgreSQL Company
> <http://www.enterprisedb.com/>
>
>
> *http://www.linkedin.com/in/asheshvashi*
> <http://www.linkedin.com/in/asheshvashi>
>
>>
>> --
>> Dave Page
>> Blog: http://pgsnake.blogspot.com
>> Twitter: @pgsnake
>>
>> EnterpriseDB UK: http://www.enterprisedb.com
>> The Enterprise PostgreSQL Company
>>
>

Attachment Content-Type Size
image/png 65.9 KB
image/png 12.0 KB
image/png 71.5 KB

In response to

Responses

Browse pgadmin-hackers by date

  From Date Subject
Next Message Sarah McAlear 2017-05-02 21:17:03 Re: [patch] Dependents and Dependencies in GreenPlum
Previous Message Markus Zapke-Gründemann 2017-05-02 16:55:59 Re: pgadmin4 on PyPI