[IPython-dev] feedback on modal UI

Doug Blank doug.blank at gmail.com
Fri Mar 14 16:00:59 EDT 2014


On Fri, Mar 14, 2014 at 3:40 PM, Sylvain Corlay
<sylvain.corlay at gmail.com> wrote:
> Hello,
>
> Some people trying the notebook environment for the first time around me got
> confused by the modal UI, just because they did not notice right away the
> green/gray line around the cell. Therefore we also decided to make it a bit
> thicker.

+1 ... the only difference I often notice is lack of a cursor! There
should a bigger difference.

> Another 2 cents about the user interface: Some first-time users are confused
> by the fact that the "run current cell" button only runs one cell rather
> than the entire notebook. How about using the "step-forward" font-awesome
> icon for this button?

Another +1 as a good idea, although at least there is a mouse-over for it.

-Doug

> Best,
> Sylvain
>
> Thanks for sharing this. I think we prefer to keep the default styling
> of this extremely simple and encourage users to customize to suite
> their needs. Your feedback is helpful though - we will monitor the
> situation.
>
> Cheers,
>
> Brian
>
> On Fri, Mar 14, 2014 at 7:58 AM, Alistair Miles
> <alimanfoo at googlemail.com> wrote:
>> Sorry for spam, in case it's useful for anyone else here's a couple more
>> CSS
>> tweaks which are helping me with the modal UI...
>>
>> div.cell.selected {
>>     border: 3px #ababab solid;
>>     background-color: #ddd;
>> }
>>
>> div.cell.edit_mode {
>>     border: 5px red solid;
>>     background-color: #faa;
>> }
>>
>> div.cell.selected div.output_subarea {
>>     background-color: #fff;
>>     margin: .5em 0 .5em 0;
>>     padding: .5em;
>>     border: 1px #ababab solid;
>>     border-radius: 4px;
>> }
>>
>> div.cell.edit_mode div.output_subarea {
>>     border: 1px red solid;
>>     border-radius: 4px;
>> }
>>
>> div.cell.edit_mode div.input_area {
>>     border: 1px red solid;
>> }
>>
>>
>>
>> On Fri, Mar 14, 2014 at 10:44 AM, Alistair Miles
>> <alimanfoo at googlemail.com>
>> wrote:
>>>
>>> P.S., adding this:
>>>
>>> div.cell.edit_mode {
>>>     border: 5px solid red;
>>>     background-color: #faa;
>>> }
>>>
>>> ...to custom.css is my temporary solution to help me remember to enter
>>> edit mode before typing :-)
>>>
>>>
>>> On Fri, Mar 14, 2014 at 10:32 AM, Alistair Miles
>>> <alimanfoo at googlemail.com> wrote:
>>>>
>>>> Hi all,
>>>>
>>>> In case this is helpful, here is some feedback on the new modal UI after
>>>> a couple of days working with IPython 2.0.0-b1.
>>>>
>>>> I'm sure I will get used to it (I had become very fluent with the old
>>>> set
>>>> of shortcut keys) but for now I am having a lot of accidents from
>>>> starting
>>>> to type and forgetting I'm still in command mode. I've lost count of the
>>>> number of times I've accidentally turned line numbers on or off,
>>>> randomly
>>>> added new cells above or below, switched the cell from code to markdown,
>>>> etc. Often I've got through typing a number of words before realising
>>>> something is wrong, and so found several unintended things have happened
>>>> to
>>>> my notebook. Fortunately there aren't many words in English with a
>>>> double d,
>>>> that could be particularly confusing, maybe deleting cells should be
>>>> double
>>>> [delete] key? Also having cut as a plain 'x' press is similar, maybe
>>>> cut/copy/paste/undo should need a control key modifier?
>>>>
>>>> I know these problems may only be transient and when I'm fully used to
>>>> the new UI they'll happen much less.
>>>>
>>>> I know this has been mentioned before, but think it might help if the
>>>> visual distinction between edit mode and command mode is made stronger.
>>>> My
>>>> eyes literally can't tell the difference between the green outline and
>>>> the
>>>> grey outline on most screens. I'm sure others will have better ideas,
>>>> but
>>>> maybe the box outline for edit mode could be a couple of points thicker,
>>>> or
>>>> the cell background could be a different colour/shade of grey/white, or
>>>> maybe lose the outline completely in command mode and indicate the
>>>> selected
>>>> cell by some other means? I'm not a visual designer, I'm sure there are
>>>> better ways.
>>>>
>>>> Hth, thanks for the revolutionary work!
>>>>
>>>> Alistair
>>>> --
>>>> Alistair Miles
>>>> Head of Epidemiological Informatics
>>>> Centre for Genomics and Global Health <http://cggh.org>
>>>> The Wellcome Trust Centre for Human Genetics
>>>> Roosevelt Drive
>>>> Oxford
>>>> OX3 7BN
>>>> United Kingdom
>>>> Web: http://purl.org/net/aliman
>>>> Email: alimanfoo at gmail.com
>>>> Tel: +44 (0)1865 287721 ***new number***
>>>
>>>
>>>
>>>
>>> --
>>> Alistair Miles
>>> Head of Epidemiological Informatics
>>> Centre for Genomics and Global Health <http://cggh.org>
>>> The Wellcome Trust Centre for Human Genetics
>>> Roosevelt Drive
>>> Oxford
>>> OX3 7BN
>>> United Kingdom
>>> Web: http://purl.org/net/aliman
>>> Email: alimanfoo at gmail.com
>>> Tel: +44 (0)1865 287721 ***new number***
>>
>>
>>
>>
>> --
>> Alistair Miles
>> Head of Epidemiological Informatics
>> Centre for Genomics and Global Health <http://cggh.org>
>> The Wellcome Trust Centre for Human Genetics
>> Roosevelt Drive
>> Oxford
>> OX3 7BN
>> United Kingdom
>> Web: http://purl.org/net/aliman
>> Email: alimanfoo at gmail.com
>> Tel: +44 (0)1865 287721 ***new number***
>>
>> _______________________________________________
>> IPython-dev mailing list
>> IPython-dev at scipy.org
>> http://mail.scipy.org/mailman/listinfo/ipython-dev
>>
>
>
>
> --
> Brian E. Granger
> Cal Poly State University, San Luis Obispo
> bgranger at calpoly.edu and ellisonbg at gmail.com
> _______________________________________________
> IPython-dev mailing list
> IPython-dev at scipy.org
> http://mail.scipy.org/mailman/listinfo/ipython-dev
>
> _______________________________________________
> IPython-dev mailing list
> IPython-dev at scipy.org
> http://mail.scipy.org/mailman/listinfo/ipython-dev
>



More information about the IPython-dev mailing list